pagination code in elster react-boilder code

PHOTO EMBED

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([]);
      }
    },
    [],
  );
content_copyCOPY