Files
web/components/MyPages/Blocks/Points/EarnAndBurn/Client.tsx
2024-06-19 14:51:00 +02:00

46 lines
1.2 KiB
TypeScript

"use client"
import { trpc } from "@/lib/trpc/client"
import DesktopTable from "./Desktop"
import MobileTable from "./Mobile"
import type {
ClientEarnAndBurnProps,
TransactionsNonNullResponseObject,
} from "@/types/components/myPages/myPage/earnAndBurn"
export default function ClientEarnAndBurn({
initialData,
lang,
}: ClientEarnAndBurnProps) {
/**
* desctruct fetchNextPage, hasNextPage once pagination is
* possible through API
*/
const { data } = trpc.user.transaction.friendTransactions.useInfiniteQuery(
{ limit: 5 },
{
getNextPageParam: (lastPage) => lastPage?.nextCursor,
initialData: {
pageParams: [undefined, 1],
pages: [initialData],
},
}
)
// TS having a hard time with the filtered type.
// This is only temporary as we will not return null
// later on when we handle errors appropriately.
const filteredTransactions = (data?.pages.filter(
(page) => page && page.data
) ?? []) as unknown as TransactionsNonNullResponseObject[]
const transactions = filteredTransactions.flatMap((page) => page.data)
return (
<>
<MobileTable lang={lang} transactions={transactions} />
<DesktopTable lang={lang} transactions={transactions} />
</>
)
}