53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
"use client"
|
|
|
|
import { _ } from "@/lib/translation"
|
|
import { trpc } from "@/lib/trpc/client"
|
|
|
|
import Container from "../Container"
|
|
import Header from "../Header"
|
|
import ListContainer from "../ListContainer"
|
|
import ShowMoreButton from "../ShowMoreButton"
|
|
import StayList from "../StayList"
|
|
import EmptyPreviousStaysBlock from "./EmptyPreviousStays"
|
|
|
|
import type { Page } from "@/types/components/myPages/myStays/page"
|
|
import type { LangParams } from "@/types/params"
|
|
|
|
export default function PreviousStays({ lang }: LangParams) {
|
|
const { data, isFetching, fetchNextPage, hasNextPage } =
|
|
trpc.user.stays.previous.useInfiniteQuery(
|
|
{},
|
|
{
|
|
getNextPageParam: (lastPage: Page) => lastPage.nextCursor,
|
|
}
|
|
)
|
|
|
|
function loadMoreData() {
|
|
fetchNextPage()
|
|
}
|
|
|
|
return (
|
|
<Container>
|
|
<Header
|
|
title={_("Previous stays")}
|
|
subtitle={_(
|
|
"Revisit your stays and rekindle those our moments together, with ease."
|
|
)}
|
|
></Header>
|
|
{data?.pages.length ? (
|
|
<ListContainer>
|
|
<StayList
|
|
lang={lang}
|
|
stays={data?.pages.flatMap((page) => page.data) ?? []}
|
|
/>
|
|
{hasNextPage ? (
|
|
<ShowMoreButton disabled={isFetching} loadMoreData={loadMoreData} />
|
|
) : null}
|
|
</ListContainer>
|
|
) : (
|
|
<EmptyPreviousStaysBlock />
|
|
)}
|
|
</Container>
|
|
)
|
|
}
|