fix(L2): block L2 tokens explicitly linked to L1 tokens that are blocked (#2721)

* block L2 tokens explicitly linked to L1 tokens that are blocked

src/constants/chains.ts

@@ -3,6 +3,8 @@ import arbitrumLogoUrl from 'assets/svg/arbitrum_logo.svg'
 import optimismLogoUrl from 'assets/svg/optimistic_ethereum.svg'
 import ms from 'ms.macro'
 
+import { ARBITRUM_LIST, OPTIMISM_LIST } from './lists'
+
 export enum SupportedChainId {
   MAINNET = 1,
   ROPSTEN = 3,
@@ -66,6 +68,7 @@ export interface L2ChainInfo extends L1ChainInfo {
   readonly bridge: string
   readonly logoUrl: string
   readonly statusPage?: string
+  readonly defaultListUrl: string
 }
 
 export type ChainInfo = { readonly [chainId: number]: L1ChainInfo | L2ChainInfo } & {
@@ -77,6 +80,7 @@ export const CHAIN_INFO: ChainInfo = {
   [SupportedChainId.ARBITRUM_ONE]: {
     blockWaitMsBeforeWarning: ms`10m`,
     bridge: 'https://bridge.arbitrum.io/',
+    defaultListUrl: ARBITRUM_LIST,
     docs: 'https://offchainlabs.com/',
     explorer: 'https://arbiscan.io/',
     infoLink: 'https://info.uniswap.org/#/arbitrum/',
@@ -88,6 +92,7 @@ export const CHAIN_INFO: ChainInfo = {
   [SupportedChainId.ARBITRUM_RINKEBY]: {
     blockWaitMsBeforeWarning: ms`10m`,
     bridge: 'https://bridge.arbitrum.io/',
+    defaultListUrl: ARBITRUM_LIST,
     docs: 'https://offchainlabs.com/',
     explorer: 'https://rinkeby-explorer.arbitrum.io/',
     infoLink: 'https://info.uniswap.org/#/arbitrum/',
@@ -135,6 +140,7 @@ export const CHAIN_INFO: ChainInfo = {
   [SupportedChainId.OPTIMISM]: {
     blockWaitMsBeforeWarning: ms`15m`,
     bridge: 'https://gateway.optimism.io/',
+    defaultListUrl: OPTIMISM_LIST,
     docs: 'https://optimism.io/',
     explorer: 'https://optimistic.etherscan.io/',
     infoLink: 'https://info.uniswap.org/#/optimism/',
@@ -146,6 +152,7 @@ export const CHAIN_INFO: ChainInfo = {
   [SupportedChainId.OPTIMISTIC_KOVAN]: {
     blockWaitMsBeforeWarning: ms`15m`,
     bridge: 'https://gateway.optimism.io/',
+    defaultListUrl: OPTIMISM_LIST,
     docs: 'https://optimism.io/',
     explorer: 'https://optimistic.etherscan.io/',
     infoLink: 'https://info.uniswap.org/#/optimism/',

src/hooks/Tokens.ts

 import { arrayify } from '@ethersproject/bytes'
 import { parseBytes32String } from '@ethersproject/strings'
 import { Currency, Token } from '@uniswap/sdk-core'
-import { SupportedChainId } from 'constants/chains'
+import { CHAIN_INFO, L2_CHAIN_IDS, SupportedChainId, SupportedL2ChainId } from 'constants/chains'
+import { ARBITRUM_LIST, OPTIMISM_LIST } from 'constants/lists'
 import { useMemo } from 'react'
 
 import { createTokenFilterFunction } from '../components/SearchModal/filtering'
@@ -57,9 +58,56 @@ export function useAllTokens(): { [address: string]: Token } {
   return useTokensFromMap(allTokens, true)
 }
 
+type BridgeInfo = Record<
+  SupportedChainId,
+  {
+    tokenAddress: string
+    originBridgeAddress: string
+    destBridgeAddress: string
+  }
+>
+
 export function useUnsupportedTokens(): { [address: string]: Token } {
+  const { chainId } = useActiveWeb3React()
+  const listsByUrl = useAllLists()
   const unsupportedTokensMap = useUnsupportedTokenList()
-  return useTokensFromMap(unsupportedTokensMap, false)
+  const unsupportedTokens = useTokensFromMap(unsupportedTokensMap, false)
+
+  // checks the default L2 lists to see if `bridgeInfo` has an L1 address value that is unsupported
+  const l2InferredBlockedTokens: typeof unsupportedTokens = useMemo(() => {
+    if (!chainId || !L2_CHAIN_IDS.includes(chainId)) {
+      return {}
+    }
+
+    if (!listsByUrl) {
+      return {}
+    }
+
+    const listUrl = CHAIN_INFO[chainId as SupportedL2ChainId].defaultListUrl
+    const { current: list } = listsByUrl[listUrl]
+    if (!list) {
+      return {}
+    }
+
+    const unsupportedSet = new Set(Object.keys(unsupportedTokens))
+
+    return list.tokens.reduce((acc, tokenInfo) => {
+      const bridgeInfo = tokenInfo.extensions?.bridgeInfo as unknown as BridgeInfo
+      if (
+        bridgeInfo &&
+        bridgeInfo[SupportedChainId.MAINNET] &&
+        bridgeInfo[SupportedChainId.MAINNET].tokenAddress &&
+        unsupportedSet.has(bridgeInfo[SupportedChainId.MAINNET].tokenAddress)
+      ) {
+        const address = bridgeInfo[SupportedChainId.MAINNET].tokenAddress
+        // don't rely on decimals--it's possible that a token could be bridged w/ different decimals on the L2
+        return { ...acc, [address]: new Token(SupportedChainId.MAINNET, address, tokenInfo.decimals) }
+      }
+      return acc
+    }, {})
+  }, [chainId, listsByUrl, unsupportedTokens])
+
+  return { ...unsupportedTokens, ...l2InferredBlockedTokens }
 }
 
 export function useSearchInactiveTokenLists(search: string | undefined, minResults = 10): WrappedTokenInfo[] {

src/hooks/useIsSwapUnsupported.ts

-import { Currency, Token } from '@uniswap/sdk-core'
+import { Currency } from '@uniswap/sdk-core'
 import { useMemo } from 'react'
 
 import { useUnsupportedTokens } from './Tokens'
@@ -9,14 +9,13 @@ import { useUnsupportedTokens } from './Tokens'
  * @param currencyOut the output currency to check
  */
 export function useIsSwapUnsupported(currencyIn?: Currency | null, currencyOut?: Currency | null): boolean {
-  const unsupportedTokens: { [address: string]: Token } = useUnsupportedTokens()
-
+  const unsupportedTokens = useUnsupportedTokens()
   return useMemo(() => {
-    // if unsupported list loaded & either token on list, mark as unsupported
-    return Boolean(
-      unsupportedTokens &&
-        ((currencyIn?.isToken && unsupportedTokens[currencyIn.address]) ||
-          (currencyOut?.isToken && unsupportedTokens[currencyOut.address]))
-    )
+    if (!unsupportedTokens) {
+      return false
+    }
+    const currencyInUnsupported = Boolean(currencyIn?.isToken && unsupportedTokens[currencyIn.address])
+    const currencyOutUnsupported = Boolean(currencyOut?.isToken && unsupportedTokens[currencyOut.address])
+    return currencyInUnsupported || currencyOutUnsupported
   }, [currencyIn, currencyOut, unsupportedTokens])
 }