pagination

src/pages/sent/List.tsx

@@ -13,12 +13,14 @@ import { formatDate } from '@/config/func';
 
 const List: FC = () => {
     const navigate = useNavigate();
-    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 { data: sentData, isLoading, refetch, isFetching } = useGetSentMessages({
-        page: currentPage,
+        next: nextCursor,
+        previous: previousCursor,
         limit: 10,
         ...filters
     });
@@ -91,7 +93,8 @@ const List: FC = () => {
 
     const handleFilterChange = (newFilters: FilterValues) => {
         setFilters(newFilters);
-        setCurrentPage(1);
+        setNextCursor(undefined);
+        setPreviousCursor(undefined);
     };
 
     const handleRowClick = (id: number, item: InboxMessage) => {
@@ -138,8 +141,14 @@ const List: FC = () => {
         },
     ];
 
-    const handlePageChange = (page: number) => {
-        setCurrentPage(page);
+    const handleNext = (cursor?: string) => {
+        setNextCursor(cursor);
+        setPreviousCursor(undefined);
+    };
+
+    const handlePrevious = (cursor?: string) => {
+        setPreviousCursor(cursor);
+        setNextCursor(undefined);
     };
 
     const messages = sentData?.data?.sentMails || [];
@@ -178,9 +187,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}
             />