From 041e9110f5bd2aa4f28b2a318596dac9ddc143b2 Mon Sep 17 00:00:00 2001
From: "Yohan @ ScreenshotLabs" <yohantancrez@gmail.com>
Date: Thu, 4 Apr 2024 15:41:32 +0200
Subject: [PATCH] fix: mainnet whitelisted collections (#178)

* fixed images

* used public provider instead of our juno node for now

* fetched whitelisted collections from bridge l1 contract

* fix medias

* nft medias in transfer list

* fix: whitelist
---
 .../(routes)/lounge/_components/NftTransferItem.tsx   |  7 ++++---
 .../(routes)/lounge/_components/NftTransferList.tsx   |  4 ++--
 apps/web/src/server/api/routers/bridgeRequest.ts      | 11 +++++++----
 apps/web/src/server/api/routers/l1Nfts.ts             |  6 +++++-
 4 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/apps/web/src/app/(routes)/lounge/_components/NftTransferItem.tsx b/apps/web/src/app/(routes)/lounge/_components/NftTransferItem.tsx
index ded1e1e0..3e0ca45a 100644
--- a/apps/web/src/app/(routes)/lounge/_components/NftTransferItem.tsx
+++ b/apps/web/src/app/(routes)/lounge/_components/NftTransferItem.tsx
@@ -8,6 +8,7 @@ import { useEnsName } from "wagmi";
 
 import Media from "~/app/_components/Media";
 import { type Chain } from "~/app/_types";
+import { type NftMedia } from "~/server/api/types";
 
 import NftTransferItemContent from "./NftTransferItemContent";
 import NftTransferStatus from "./NftTransferStatus";
@@ -17,7 +18,7 @@ interface NftTransferItemProps {
   arrivalAddress: string;
   arrivalChain: Chain;
   arrivalTimestamp?: number;
-  collectionImage: string | undefined;
+  collectionMedia: NftMedia;
   collectionName: string;
   contractAddress: string;
   onWithdrawSuccess: () => void;
@@ -49,7 +50,7 @@ export default function NftTransferItem({
   arrivalAddress,
   arrivalChain,
   arrivalTimestamp,
-  collectionImage,
+  collectionMedia,
   collectionName,
   contractAddress,
   onWithdrawSuccess,
@@ -90,7 +91,7 @@ export default function NftTransferItem({
             alt="nft"
             className="rounded-lg"
             height={62}
-            media={{ format: "image", src: collectionImage }}
+            media={collectionMedia}
             width={62}
           />
           <div className="text-left">
diff --git a/apps/web/src/app/(routes)/lounge/_components/NftTransferList.tsx b/apps/web/src/app/(routes)/lounge/_components/NftTransferList.tsx
index 32366ee4..80c55dc4 100644
--- a/apps/web/src/app/(routes)/lounge/_components/NftTransferList.tsx
+++ b/apps/web/src/app/(routes)/lounge/_components/NftTransferList.tsx
@@ -133,7 +133,7 @@ export default function NftTransferList({
                 <NftTransferItem
                   arrivalAddress={bridgeRequest.arrivalAddress}
                   arrivalChain={bridgeRequest.arrivalChain}
-                  collectionImage={bridgeRequest.collectionImage}
+                  collectionMedia={bridgeRequest.collectionMedia}
                   collectionName={bridgeRequest.collectionName}
                   contractAddress={bridgeRequest.collectionSourceAddress}
                   key={`${bridgeRequest.statusTimestamp}-$${bridgeRequest.collectionName}}`}
@@ -173,7 +173,7 @@ export default function NftTransferList({
                   arrivalAddress={bridgeRequest.arrivalAddress}
                   arrivalChain={bridgeRequest.arrivalChain}
                   arrivalTimestamp={bridgeRequest.arrivalTimestamp}
-                  collectionImage={bridgeRequest.collectionImage}
+                  collectionMedia={bridgeRequest.collectionMedia}
                   collectionName={bridgeRequest.collectionName}
                   contractAddress={bridgeRequest.collectionSourceAddress}
                   key={bridgeRequest.statusTimestamp}
diff --git a/apps/web/src/server/api/routers/bridgeRequest.ts b/apps/web/src/server/api/routers/bridgeRequest.ts
index ecd5a722..89f25818 100644
--- a/apps/web/src/server/api/routers/bridgeRequest.ts
+++ b/apps/web/src/server/api/routers/bridgeRequest.ts
@@ -4,6 +4,8 @@ import { z } from "zod";
 import { type Chain } from "~/app/_types";
 import { createTRPCRouter, publicProcedure } from "~/server/api/trpc";
 
+import { type NftMedia } from "../types";
+
 const alchemy = new Alchemy({
   apiKey: process.env.ALCHEMY_API_KEY,
   // network: Network.ETH_MAINNET,
@@ -42,7 +44,7 @@ type BridgeRequestResponse = {
   arrivalAddress: string;
   arrivalChain: Chain;
   arrivalTimestamp?: number;
-  collectionImage: string | undefined;
+  collectionMedia: NftMedia;
   collectionName: string;
   collectionSourceAddress: string;
   requestContent: Array<string>;
@@ -115,6 +117,9 @@ export const bridgeRequestRouter = createTRPCRouter({
               lastBridgeRequestEvent?.label === "withdraw_available_l1" ||
               lastBridgeRequestEvent?.label === "withdraw_completed_l1" ||
               lastBridgeRequestEvent?.label === "withdraw_completed_l2";
+            const media = requestMetadata[index]?.media[0];
+            const mediaSrc = media?.gateway ?? media?.thumbnail ?? media?.raw;
+            const mediaFormat = media?.format === "mp4" ? "video" : "image";
 
             return {
               arrivalAddress: bridgeRequest.req.to,
@@ -125,9 +130,7 @@ export const bridgeRequestRouter = createTRPCRouter({
               arrivalTimestamp: isArrived
                 ? lastBridgeRequestEvent?.block_timestamp
                 : undefined,
-              collectionImage:
-                requestMetadata[index]?.media[0]?.raw ??
-                requestMetadata[index]?.media[0]?.thumbnail,
+              collectionMedia: { format: mediaFormat, src: mediaSrc },
               collectionName: requestMetadata[index]?.contract.name ?? "",
               collectionSourceAddress: bridgeRequest.req.collection_src,
               requestContent: JSON.parse(
diff --git a/apps/web/src/server/api/routers/l1Nfts.ts b/apps/web/src/server/api/routers/l1Nfts.ts
index 736838a9..51aebd25 100644
--- a/apps/web/src/server/api/routers/l1Nfts.ts
+++ b/apps/web/src/server/api/routers/l1Nfts.ts
@@ -64,7 +64,11 @@ export const l1NftsRouter = createTRPCRouter({
         const mediaFormat = media?.format === "mp4" ? "video" : "image";
         const isBridgeable =
           whitelistedCollections !== undefined &&
-          whitelistedCollections.includes(contract.address);
+          whitelistedCollections.find(
+            (whitelistedCollection) =>
+              whitelistedCollection.toLowerCase() ===
+              contract.address.toLocaleLowerCase()
+          ) !== undefined;
 
         return {
           contractAddress: contract.address,