fix(bridge-ui-v2): fix for crosschain nft metadata (#15488)

taikoxyz · Jan 12, 2024 · 703c46e · 703c46e
1 parent 8b81028
commit 703c46e
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 11 deletions.
diff --git a/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ImportStep.svelte b/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ImportStep.svelte
@@ -74,7 +74,6 @@
     enteredIds = '';
     isOwnerOfAllToken = false;
     detectedTokenType = null;
-    amountComponent?.clearAmount();
   };
 
   const changeNFTView = () => {

diff --git a/packages/bridge-ui-v2/src/components/NFTs/NFTCards/NFTCardGrid.svelte b/packages/bridge-ui-v2/src/components/NFTs/NFTCards/NFTCardGrid.svelte
@@ -40,14 +40,9 @@
         <span class="badge badge-primary badge-outline badge-xs px-[10px] h-[24px] ml-[10px]"
           ><span class="text-xs">{nftsGroup[0].type}</span></span>
       </div>
-      <div class="token-ids mt-[16px] grid gap-4 grid-cols-3">
+      <div class="token-ids mt-[16px] grid gap-4 md:grid-cols-3 grid-cols-2">
         {#each nftsGroup as nft}
-          {@const collectionAddress = nft.addresses[chainId]}
-          {#if collectionAddress === undefined}
-            <div>TODO: Address for {nft.name} is undefined</div>
-          {:else}
-            <NFTCard {nft} {selectNFT} {viewOnly} />
-          {/if}
+          <NFTCard {nft} {selectNFT} {viewOnly} />
         {/each}
       </div>
       {#if Object.keys(collections).length > 1 || nfts.length > 3}

diff --git a/packages/bridge-ui-v2/src/components/NFTs/NFTDisplay.svelte b/packages/bridge-ui-v2/src/components/NFTs/NFTDisplay.svelte
@@ -17,7 +17,7 @@
 
   export let nftView: NFTView = NFTView.LIST;
 
-  $: size = nfts?.length && nfts?.length > 3 ? 'max-h-[350px] min-h-[350px]' : 'max-h-[249px] min-h-[249px]';
+  $: size = nfts?.length && nfts?.length > 2 ? 'max-h-[350px] min-h-[350px]' : 'max-h-[249px] min-h-[249px]';
 
   $: outerClasses = 'relative m bg-neutral rounded-[20px] overflow-hidden ' + size;
   $: innerClasses = 'overflow-y-auto p-[24px] ' + size;

diff --git a/packages/bridge-ui-v2/src/libs/token/fetchNFTImageUrl.ts b/packages/bridge-ui-v2/src/libs/token/fetchNFTImageUrl.ts
@@ -111,9 +111,15 @@ const crossChainFetchNFTMetadata = async (token: NFT, srcChainId: number, destCh
       address: vaultAddress,
     });
 
-    const isBridgedToken = await srcChainTokenVault.read.isBridgedToken([token.addresses[srcChainId]]);
+    const tokenAddress = token.addresses[srcChainId];
+
+    const bridgedAddress = (await srcChainTokenVault.read.canonicalToBridged([
+      BigInt(srcChainId),
+      tokenAddress,
+    ])) as Address;
+
     // if the token has no metadata but is also not bridged, we do not need to continue searching
-    if (!isBridgedToken) throw new Error('Token is not bridged');
+    if (!bridgedAddress) throw new Error('Token is not bridged');
 
     canonicalAddress = await findCanonicalTokenAddress(token, srcChainId, destChainId);
     if (!canonicalAddress) return null;