40 lines
2.1 KiB
TypeScript
40 lines
2.1 KiB
TypeScript
'use client';
|
|
import { useEffect, useState } from "react";
|
|
import PageLivingSpaceBuildsTableSection from "../tables/builds/page";
|
|
import { Button } from "@/components/ui/button";
|
|
import { useRouter } from "next/navigation";
|
|
import { IconPlus } from "@tabler/icons-react";
|
|
import { LivingSpaceDataTable } from "../tables/living-spaces/list/data-table";
|
|
import { useGraphQlLivingSpaceList } from "./queries";
|
|
|
|
const PageLivingSpaceList = () => {
|
|
|
|
const router = useRouter();
|
|
const [buildID, setBuildID] = useState<string | null>(null);
|
|
const [isUserTypeEnabled, setIsUserTypeEnabled] = useState(false);
|
|
const [page, setPage] = useState(1);
|
|
const [limit, setLimit] = useState(10);
|
|
const [sort, setSort] = useState({ createdAt: 'desc' });
|
|
const [filters, setFilters] = useState({});
|
|
|
|
useEffect(() => { console.log(`buildID: ${buildID} is changed.`) }, [buildID]);
|
|
const additionButtons = <>
|
|
<Button variant="outline" size="sm" onClick={() => { router.push("/living-spaces/add") }}>
|
|
<IconPlus /><span className="hidden lg:inline">Add Living Space</span>
|
|
</Button>
|
|
</>
|
|
const { data, isLoading, refetch } = useGraphQlLivingSpaceList(buildID || '', { limit, skip: (page - 1) * limit, sort, filters });
|
|
const handlePageChange = (newPage: number) => { setPage(newPage) };
|
|
const handlePageSizeChange = (newSize: number) => { setLimit(newSize); setPage(1) };
|
|
|
|
return <>
|
|
<div className="flex flex-col gap-2.5">
|
|
<PageLivingSpaceBuildsTableSection buildID={buildID} setBuildID={setBuildID} setIsUserTypeEnabled={setIsUserTypeEnabled} additionButtons={additionButtons} />
|
|
<h1 className="text-center justify-center">Living Space Added to selected Build with collectionToken: </h1><h1 className="text-center justify-center text-2xl font-bold">{buildID}</h1>
|
|
{buildID && <LivingSpaceDataTable data={data?.data || []} totalCount={data?.totalCount || 0} currentPage={page} pageSize={limit} onPageChange={handlePageChange} onPageSizeChange={handlePageSizeChange} refetchTable={refetch} buildID={buildID} />}
|
|
</div>
|
|
</>;
|
|
}
|
|
|
|
export { PageLivingSpaceList };
|