Hide network selector, remove goerli support in production (#852)

* Hide network selector in production * Make goerli unsupported in production * goerli unsupported (#854) * update isSupportedChain * update modal text --------- Co-authored-by: Tyler Sorensen <[email protected]>
makerdao · Feb 23, 2024 · fba3fce · fba3fce
1 parent ca1e90b
commit fba3fce
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 10 deletions.
diff --git a/modules/app/components/layout/Header.tsx b/modules/app/components/layout/Header.tsx
@@ -124,6 +124,8 @@ const HeaderMenu = ({ onToggleTheme, mode, ...props }): JSX.Element => {
 };
 
 const Header = (): JSX.Element => {
+  const isProduction = process.env.NODE_ENV === 'production';
+
   const router = useRouter();
   const [showMobileMenu, setShowMobileMenu] = useState(false);
   const bpi = useBreakpointIndex();
@@ -259,7 +261,7 @@ const Header = (): JSX.Element => {
           </ExternalLink>
         )}
         {bpi > 3 && account && router.pathname.includes('polling') && <BallotStatus mr={3} />}
-        {bpi > 1 && (
+        {!isProduction && bpi > 1 && (
           <Flex mr={3}>
             <NetworkSelect />
           </Flex>
@@ -300,6 +302,8 @@ const Header = (): JSX.Element => {
 };
 
 const MobileMenu = ({ hide, router, gas, onToggleTheme, mode, network }) => {
+  const isProduction = process.env.NODE_ENV === 'production';
+
   useEffect(() => {
     if (typeof window !== 'undefined') {
       router.events.on('routeChangeComplete', hide);
@@ -321,7 +325,7 @@ const MobileMenu = ({ hide, router, gas, onToggleTheme, mode, network }) => {
           </IconButton>
         </InternalLink>
         <Flex sx={{ alignItems: 'center', gap: 2 }}>
-          <NetworkSelect />
+          {!isProduction && <NetworkSelect />}
           <Close sx={{ display: ['block'], '> svg': { size: [4] } }} onClick={hide} />
         </Flex>
       </Flex>

diff --git a/modules/app/components/layout/header/NetworkSelect.tsx b/modules/app/components/layout/header/NetworkSelect.tsx
@@ -83,6 +83,7 @@ const NetworkSelect = (): React.ReactElement => {
     .filter(
       k => ![SupportedChainId.GOERLIFORK].includes(CHAIN_INFO[k].chainId) && CHAIN_INFO[k].type === 'normal'
     )
+    .filter(k => process.env.NODE_ENV !== 'production' || CHAIN_INFO[k].showInProduction)
     .map(chainKey => (
       <Flex
         sx={walletButtonStyle}

diff --git a/modules/web3/components/NetworkAlertModal.tsx b/modules/web3/components/NetworkAlertModal.tsx
@@ -62,7 +62,7 @@ export const NetworkAlertModal = ({
 
             <Text sx={{ mt: 3 }}>
               Your wallet is connected to an unsupported network, please switch it to{' '}
-              {SupportedNetworks.MAINNET} or {SupportedNetworks.GOERLI} to continue.
+              {SupportedNetworks.MAINNET} to continue.
             </Text>
             {/* <Button onClick={() => handleSwitchNetwork(SupportedNetworks.MAINNET)}>Switch to mainnet</Button>
             <Button onClick={() => handleSwitchNetwork(SupportedNetworks.GOERLI)}>Switch to goerli</Button> */}

diff --git a/modules/web3/constants/networks.ts b/modules/web3/constants/networks.ts
@@ -61,7 +61,8 @@ export const CHAIN_INFO: ChainInfo = {
     rpcs: {
       [NodeProviders.INFURA]: `https://mainnet.infura.io/v3/${config.INFURA_KEY}`,
       [NodeProviders.ALCHEMY]: `https://eth-mainnet.g.alchemy.com/v2/${config.ALCHEMY_KEY}`
-    }
+    },
+    showInProduction: true
   },
   [SupportedChainId.GOERLI]: {
     blockExplorerUrl: 'goerli.etherscan.io',
@@ -75,7 +76,8 @@ export const CHAIN_INFO: ChainInfo = {
     rpcs: {
       [NodeProviders.INFURA]: `https://goerli.infura.io/v3/${config.INFURA_KEY}`,
       [NodeProviders.ALCHEMY]: `https://eth-goerli.alchemyapi.io/v2/${config.ALCHEMY_KEY}`
-    }
+    },
+    showInProduction: false
   },
   [SupportedChainId.GOERLIFORK]: {
     blockExplorerUrl: 'goerli.etherscan.io',
@@ -88,7 +90,8 @@ export const CHAIN_INFO: ChainInfo = {
     spockUrl: LOCAL_SPOCK_URL,
     rpcs: {
       [NodeProviders.LOCAL]: 'http://127.0.0.1:8545/'
-    }
+    },
+    showInProduction: false
   },
   [SupportedChainId.ARBITRUMTESTNET]: {
     blockExplorerUrl: 'goerli-rollup-explorer.arbitrum.io',
@@ -100,7 +103,8 @@ export const CHAIN_INFO: ChainInfo = {
     defaultRpc: NodeProviders.ALCHEMY,
     rpcs: {
       [NodeProviders.ALCHEMY]: `https://arb-goerli.g.alchemy.com/v2/${config.ALCHEMY_ARBITRUM_TESTNET_KEY}`
-    }
+    },
+    showInProduction: false
   },
   [SupportedChainId.ARBITRUMTESTNETFORK]: {
     blockExplorerUrl: 'goerli-rollup-explorer.arbitrum.io',
@@ -113,7 +117,8 @@ export const CHAIN_INFO: ChainInfo = {
     spockUrl: LOCAL_SPOCK_URL,
     rpcs: {
       [NodeProviders.LOCAL]: 'http://127.0.0.1:8546/'
-    }
+    },
+    showInProduction: false
   },
   [SupportedChainId.ARBITRUM]: {
     blockExplorerUrl: 'arbiscan.io',
@@ -125,7 +130,8 @@ export const CHAIN_INFO: ChainInfo = {
     defaultRpc: NodeProviders.ALCHEMY,
     rpcs: {
       [NodeProviders.ALCHEMY]: `https://arb-mainnet.g.alchemy.com/v2/${config.ALCHEMY_ARBITRUM_KEY}`
-    }
+    },
+    showInProduction: false
   }
 };
 

diff --git a/modules/web3/helpers/chain.ts b/modules/web3/helpers/chain.ts
@@ -26,7 +26,7 @@ export const networkNameToChainId = (networkName: string): number => {
 
 export const isSupportedChain = (chainId?: number): boolean => {
   if (!chainId) return false;
-  return CHAIN_INFO[chainId] && CHAIN_INFO[chainId].type === 'normal';
+  return CHAIN_INFO[chainId] && CHAIN_INFO[chainId].type === 'normal' && (process.env.NODE_ENV !== 'production' || CHAIN_INFO[chainId].showInProduction);
 };
 
 export const getGaslessNetwork = (network: SupportedNetworks): SupportedNetworks => {

diff --git a/modules/web3/types/chain.d.ts b/modules/web3/types/chain.d.ts
@@ -20,6 +20,7 @@ export type SupportedChain = {
   defaultRpc: string;
   spockUrl?: string;
   type: 'gasless' | 'normal';
+  showInProduction: boolean;
   rpcs: {
     [key: string]: string;
   };