2024-07-09 16:21:12 +00:00
|
|
|
import { PaginationState } from "@/lib/hooks";
|
2024-06-13 11:09:26 +00:00
|
|
|
import { SortingState } from "@tanstack/react-table";
|
2024-07-09 16:21:12 +00:00
|
|
|
import {
|
|
|
|
|
Dispatch,
|
|
|
|
|
PropsWithChildren,
|
|
|
|
|
SetStateAction,
|
|
|
|
|
createContext,
|
|
|
|
|
useCallback,
|
|
|
|
|
useMemo,
|
|
|
|
|
useState,
|
|
|
|
|
} from "react";
|
|
|
|
|
import { useSyncedPagination } from "./useSyncedPagination";
|
2024-06-11 16:48:09 +00:00
|
|
|
|
2024-06-13 11:09:26 +00:00
|
|
|
export interface IDataTableContextState {
|
|
|
|
|
pagination: PaginationState;
|
|
|
|
|
setPagination: (newPagination: PaginationState) => void;
|
2024-07-09 16:21:12 +00:00
|
|
|
sorting: SortingState;
|
|
|
|
|
setSorting: Dispatch<SetStateAction<SortingState>>;
|
2024-08-26 15:16:42 +00:00
|
|
|
globalFilter?: string;
|
2024-06-13 11:09:26 +00:00
|
|
|
setGlobalFilter: (newGlobalFilter: string) => void;
|
|
|
|
|
resetGlobalFilter: () => void;
|
|
|
|
|
isFiltered: boolean;
|
|
|
|
|
}
|
2024-06-11 16:48:09 +00:00
|
|
|
|
|
|
|
|
export const DataTableContext = createContext<IDataTableContextState | null>(null);
|
|
|
|
|
|
2024-06-13 11:09:26 +00:00
|
|
|
export const DataTableProvider = ({
|
2024-07-09 16:21:12 +00:00
|
|
|
syncWithLocation = true,
|
2024-08-26 15:16:42 +00:00
|
|
|
initialGlobalFilter = undefined,
|
2024-08-12 18:22:34 +00:00
|
|
|
initialPageIndex,
|
|
|
|
|
initialPageSize,
|
2024-06-13 11:09:26 +00:00
|
|
|
children,
|
|
|
|
|
}: PropsWithChildren<{
|
2024-07-09 16:21:12 +00:00
|
|
|
syncWithLocation?: boolean;
|
2024-06-13 11:09:26 +00:00
|
|
|
initialGlobalFilter?: string;
|
2024-08-12 18:22:34 +00:00
|
|
|
initialPageIndex?: number;
|
|
|
|
|
initialPageSize?: number;
|
2024-06-13 11:09:26 +00:00
|
|
|
}>) => {
|
2024-08-12 18:22:34 +00:00
|
|
|
const [pagination, setPagination] = useSyncedPagination({
|
|
|
|
|
syncWithLocation,
|
|
|
|
|
initialPageIndex,
|
|
|
|
|
initialPageSize,
|
|
|
|
|
});
|
2024-08-26 15:16:42 +00:00
|
|
|
const [globalFilter, setGlobalFilter] = useState<string | undefined>(initialGlobalFilter);
|
2024-06-13 11:09:26 +00:00
|
|
|
const [sorting, setSorting] = useState<SortingState>([]);
|
|
|
|
|
|
2024-08-26 15:16:42 +00:00
|
|
|
const isFiltered = useMemo(() => Boolean(globalFilter && globalFilter.length), [globalFilter]);
|
2024-06-13 11:09:26 +00:00
|
|
|
const resetGlobalFilter = useCallback(() => setGlobalFilter(""), []);
|
2024-06-11 16:48:09 +00:00
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<DataTableContext.Provider
|
|
|
|
|
value={{
|
|
|
|
|
pagination,
|
|
|
|
|
setPagination,
|
2024-06-13 11:09:26 +00:00
|
|
|
sorting,
|
|
|
|
|
setSorting,
|
|
|
|
|
globalFilter,
|
|
|
|
|
setGlobalFilter,
|
|
|
|
|
resetGlobalFilter,
|
|
|
|
|
isFiltered,
|
2024-06-11 16:48:09 +00:00
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
{children}
|
|
|
|
|
</DataTableContext.Provider>
|
|
|
|
|
);
|
|
|
|
|
};
|