fix: stop showing the token logos from different chains as a fallback (#5761)

src/constants/TokenLogoLookupTable.ts

@@ -13,11 +13,11 @@ class TokenLogoLookupTable {
       store.getState().lists.byUrl[list].current?.tokens.forEach((token) => {
         if (token.logoURI) {
           const lowercaseAddress = token.address.toLowerCase()
-          const currentEntry = dict[lowercaseAddress]
+          const currentEntry = dict[lowercaseAddress + ':' + token.chainId]
           if (currentEntry) {
             currentEntry.push(token.logoURI)
           } else {
-            dict[lowercaseAddress] = [token.logoURI]
+            dict[lowercaseAddress + ':' + token.chainId] = [token.logoURI]
           }
         }
       })
@@ -25,13 +25,14 @@ class TokenLogoLookupTable {
     this.dict = dict
     this.initialized = true
   }
-  getIcons(address?: string | null) {
+  getIcons(address?: string | null, chainId: number | null = 1) {
     if (!address) return undefined
 
     if (!this.initialized) {
       this.initialize()
     }
-    return this.dict[address.toLowerCase()]
+
+    return this.dict[address.toLowerCase() + ':' + chainId]
   }
 }
 

src/hooks/useAssetLogoSource.ts

@@ -66,7 +66,7 @@ export default function useAssetLogoSource(
     }
     // Parses and stores logo sources from tokenlists if assets repo url fails
     if (!fallbackSrcs) {
-      const uris = TokenLogoLookupTable.getIcons(address) ?? []
+      const uris = TokenLogoLookupTable.getIcons(address, chainId) ?? []
       if (backupImg) uris.push(backupImg)
       const tokenListIcons = prioritizeLogoSources(parseLogoSources(uris))
 
@@ -75,7 +75,7 @@ export default function useAssetLogoSource(
     } else {
       setCurrent(fallbackSrcs.find((src) => !BAD_SRCS[src]))
     }
-  }, [current, fallbackSrcs, address, backupImg])
+  }, [current, fallbackSrcs, address, chainId, backupImg])
 
   return [current, nextSrc]
 }