fixes for unknown networks (#725)

* fixes for unknown networks

* hack in native token symbol

src/components/molecules/Wallet/Details.tsx

@@ -11,8 +11,14 @@ import Web3Feedback from './Feedback'
 import styles from './Details.module.css'
 
 export default function Details(): ReactElement {
-  const { web3Provider, web3ProviderInfo, connect, logout, networkData } =
-    useWeb3()
+  const {
+    web3Provider,
+    web3ProviderInfo,
+    connect,
+    logout,
+    networkId,
+    networkData
+  } = useWeb3()
   const { balance, config } = useOcean()
   const { locale } = useUserPreferences()
 
@@ -20,10 +26,11 @@ export default function Details(): ReactElement {
   // const [portisNetwork, setPortisNetwork] = useState<string>()
 
   useEffect(() => {
-    if (!networkData) return
+    const symbol =
+      networkId === 2021000 ? 'GX' : networkData?.nativeCurrency.symbol
 
-    setMainCurrency(networkData.nativeCurrency.symbol)
-  }, [networkData])
+    setMainCurrency(symbol)
+  }, [networkData, networkId])
 
   // Handle network change for Portis
   // async function handlePortisNetworkChange(e: ChangeEvent<HTMLSelectElement>) {

src/providers/Web3.tsx

@@ -188,14 +188,19 @@ function Web3Provider({ children }: { children: ReactNode }): ReactElement {
 
     const networkData = getNetworkData(networksList, networkId)
     setNetworkData(networkData)
-    Logger.log('[web3] Network metadata found.', networkData)
+    Logger.log(
+      networkData
+        ? `[web3] Network metadata found.`
+        : `[web3] No network metadata found.`,
+      networkData
+    )
 
     // Construct network display name
     const networkDisplayName = getNetworkDisplayName(networkData, networkId)
     setNetworkDisplayName(networkDisplayName)
 
     // Figure out if we're on a chain's testnet, or not
-    setIsTestnet(networkData.network !== 'mainnet')
+    setIsTestnet(networkData?.network !== 'mainnet')
 
     Logger.log(`[web3] Network display name set to: ${networkDisplayName}`)
   }, [networkId, networksList])

src/utils/web3.ts

@@ -47,8 +47,9 @@ export function getNetworkData(
 ): EthereumListsChain {
   const networkData = data.filter(
     ({ node }: { node: EthereumListsChain }) => node.chainId === networkId
-  )[0]
-  return networkData.node
+  )
+
+  return networkData[0]?.node
 }
 
 export function addCustomNetwork(