All files / src/ahuora-design-system/ui paginated-table.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
24x
 
24x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { DataTable } from "@/ahuora-design-system/ui/data-table";
import Paginator from "@/ahuora-design-system/ui/paginator";
import { ScrollBar } from "@/ahuora-design-system/ui/scroll-area";
import { cn } from "@/lib/utils";
import { ScrollArea } from "@radix-ui/react-scroll-area";
 
export type PaginatedTableProps = {
    data: any;
    columns: any[];
    page: number;
    setPage: (page: number) => void;
    className?: string;
    [key: string]: any;
};
 
export function PaginatedTable({data, columns, page, setPage, className, ...props}: PaginatedTableProps) {
    const fullTable = data?.results
 
    return (
        <ScrollArea className="h-full">
            <div className={cn('h-full w-full p-4 flex flex-col gap-4 relative', className)}>
                <DataTable columns={columns} data={fullTable || []} rowSelection={{}} columnSelection {...props}/>
                <Paginator
                    page={page}
                    setPage={setPage}
                    data={data}
                />
                <ScrollBar orientation="vertical" />
                <ScrollBar orientation="horizontal" />
            </div>
        </ScrollArea>
    )
}