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}
/>
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({
;
@@ -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(