pagination code in elster react-boilder code
Wed Jul 31 2024 07:42:46 GMT+0000 (Coordinated Universal Time)
Saved by @chiragwebelight
const [queryData, setQueryData] = useState<UserQueryData>({ is_active: null, pageIndex: 1, pageSize: 10, pages: 10, total: 0, }); const { isPending, data: userData } = useGetAllUsers( { size: queryData.pageSize, page: queryData.pageIndex, search: debouncedResults, is_active: queryData.is_active, }, { query: { queryKey: [ queryKeys.getUser, queryData.pageSize, queryData.pageIndex, queryData.is_active, debouncedResults, ], }, }, ); const handleUnselectAll = useCallback(() => { dataTableRef.current?.resetSelected(); }, [dataTableRef]); useEffect(() => { if (selectedCells.length <= 0) { handleUnselectAll(); } }, [selectedCells, handleUnselectAll]); const handlePaginationChange = (pageIndex: number) => { dataTableRef.current?.resetSelected(); setSelectedCells([]); setQueryData((prevData) => { return { ...prevData, ...{ pageIndex } }; }); }; const handleSelectChange = (pageSize: number) => { setQueryData((prevData) => ({ ...prevData, ...{ pageSize } })); }; const onRowSelect = (checked: boolean, row: CategoriesCell) => { setSelectedCells((prevSelectedCells) => { const existsIndex = prevSelectedCells.findIndex( (item) => item.id === row.id, ); if (checked) { if (existsIndex === -1) { return [...prevSelectedCells, row]; } return prevSelectedCells; } else { if (existsIndex !== -1) { const updatedSelection = [...prevSelectedCells]; updatedSelection.splice(existsIndex, 1); return updatedSelection; } return prevSelectedCells; } }); }; const onAllRowSelect = useCallback( (checked: boolean, rows: Row<MoodsCell>[]) => { if (checked) { const originalRows = rows.map((row) => row.original); const selectedIds: MoodsCell[] = []; originalRows.forEach((row) => { selectedIds.push(row); }); setSelectedCells(selectedIds); } else { setSelectedCells([]); } }, [], );
Comments