pagination

src/pages/draft/List.tsx

@@ -15,13 +15,15 @@ import { useSharedStore } from '@/shared/store/sharedStore';
 const List: FC = () => {
     const navigate = useNavigate();
     const { t } = useTranslation();
-    const [currentPage, setCurrentPage] = useState(1);
+    const [nextCursor, setNextCursor] = useState<string | undefined>(undefined);
+    const [previousCursor, setPreviousCursor] = useState<string | undefined>(undefined);
     const [filters, setFilters] = useState<FilterValues>({});
     const emailActions = useEmailActions();
     const { setDraftData, setOpenNewMessage, setEditingDraftId } = useSharedStore();
 
     const { data: draftData, isLoading, refetch, isFetching } = useGetDrafts({
-        page: currentPage,
+        next: nextCursor,
+        previous: previousCursor,
         limit: 10,
         ...filters
     });
@@ -106,7 +108,8 @@ const List: FC = () => {
 
     const handleFilterChange = (newFilters: FilterValues) => {
         setFilters(newFilters);
-        setCurrentPage(1);
+        setNextCursor(undefined);
+        setPreviousCursor(undefined);
     };
 
     const handleSelectionChange = (selectedRows: DraftMessage[]) => {
@@ -171,11 +174,19 @@ const List: FC = () => {
         },
     ];
 
-    const handlePageChange = (page: number) => {
-        setCurrentPage(page);
+
+
+    const handleNext = (cursor?: string) => {
+        setNextCursor(cursor);
+        setPreviousCursor(undefined);
     };
 
-    const messages = draftData?.data?.draftsMail || [];
+    const handlePrevious = (cursor?: string) => {
+        setPreviousCursor(cursor);
+        setNextCursor(undefined);
+    };
+
+    const messages = draftData?.data?.draftMails || [];
     const pager = draftData?.data?.pager;
 
     return (
@@ -211,9 +222,11 @@ const List: FC = () => {
                 selectable={true}
                 rowActions={getRowActions}
                 pagination={pager ? {
-                    totalPages: pager.totalPages,
-                    currentPage: pager.page,
-                    onPageChange: handlePageChange
+                    hasNext: typeof pager.nextCursor === 'string',
+                    nextCursor: typeof pager.nextCursor === 'string' ? pager.nextCursor : undefined,
+                    previousCursor: typeof pager.previousCursor === 'string' ? pager.previousCursor : undefined,
+                    onNext: handleNext,
+                    onPrevious: handlePrevious
                 } : undefined}
             />
         </div>