From 9484a7e1f23c7463c56e8434bb2fe75950572ed9 Mon Sep 17 00:00:00 2001 From: Valentin Dosimont Date: Mon, 4 Nov 2024 09:27:28 +0100 Subject: [PATCH] fix: collection list table view --- .../components/collection-items-data-list-view.tsx | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data-list-view.tsx b/apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data-list-view.tsx index 7514f5fa..c4ce204d 100644 --- a/apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data-list-view.tsx +++ b/apps/arkmarket/src/app/collection/[collectionAddress]/components/collection-items-data-list-view.tsx @@ -1,6 +1,6 @@ "use client"; -import { useRef } from "react"; +import { useMemo, useRef } from "react"; import { useWindowVirtualizer } from "@tanstack/react-virtual"; import { cn, ellipsableStyles, formatUnits } from "@ark-market/ui"; @@ -19,6 +19,7 @@ import type { CollectionToken } from "~/types"; import Media from "~/components/media"; import { PriceTag } from "@ark-market/ui/price-tag"; import Link from "next/link"; +import { env } from "~/env"; const gridTemplateColumnValue = "grid-cols-[minmax(10rem,2fr)_repeat(5,minmax(7.25rem,1fr))]"; @@ -32,11 +33,17 @@ export default function CollectionItemsDataListView({ }: CollectionItemsDataListViewProps) { const tableRef = useRef(null); + + // Filtering out tokens client side to only display token listed out in lords or not listed + const tokens = useMemo(() => collectionTokens.filter((token) => { + return token.listing === null || token.listing.currency.contract === env.NEXT_PUBLIC_LORDS_TOKEN_ADDRESS; + }), [collectionTokens]); + const rowVirtualizer = useWindowVirtualizer({ // Approximate initial rect for SSR initialRect: { height: 1080, width: 1920 }, // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition - count: collectionTokens.length ?? 0, + count: tokens.length ?? 0, estimateSize: () => 75, // Estimation of row height for accurate scrollbar dragging // Measure dynamic row height, except in firefox because it measures table border height incorrectly measureElement: @@ -78,7 +85,7 @@ export default function CollectionItemsDataListView({ }} > {rowVirtualizer.getVirtualItems().map((virtualRow) => { - const token = collectionTokens[virtualRow.index]; + const token = tokens[virtualRow.index]; if (!token) { return null;