Paginaton

<https://api.example.com/resource?page=1&pageSize=10>

import React from "react";  
import { useMany, useTable, HttpError } from "@refinedev/core";  
  
interface IPost {  
 id: number;  
 title: string;  
 content: string;  
 status: "published" | "draft" | "rejected";  
 createdAt: string;  
}  
  
const PostList: React.FC = () => {  
 const {  
 tableQueryResult,  
 current,  
 setCurrent,  
 pageSize,  
 setPageSize,  
 pageCount,  
 } = useTable<IPost, HttpError>();  
  
 // Fetches the posts for the current page  
 const posts = tableQueryResult?.data?.data ?? [];  
 // Checks if there is a next page available  
 const hasNext = current < pageCount;  
 // Checks if there is a previous page available  
 const hasPrev = current > 1;  
  
 return (  
 <div>  
 <h1>Posts</h1>  
 <table>  
 <thead>  
 <tr>  
 <th>ID</th>  
 <th>Title</th>  
 <th>Status</th>  
 <th>Created At</th>  
 </tr>  
 </thead>  
 <tbody>  
 {tableQueryResult.data?.data.map((post) => (  
 <tr key={post.id}>  
 <td>{post.id}</td>  
...

app.get('/resource', (req, res) => {
  const { page, pageSize } = req.query;
  const offset = (page - 1) * pageSize;
  const records = db.get('resource').slice(offset, offset + pageSize);
  const totalCount = db.get('resource').size().value();
  res.set('X-Total-Count', totalCount);
  res.json(records);
});

const {
    tableProps,
    paginationProps,
    // other returned props
} = useTable({
    resource: "posts",
    columns,
    pagination: {
        defaultCurrent: 1,
        defaultPageSize: 10,
        pageSizeOptions: ["10", "20", "50", "100"],
    },
});

import { useTable, IResourceComponentsProps, HttpError } from "@pankod/refine";

interface IPost {
    id: string;
    title: string;
    content: string;
}

export const PostList: React.FC<IResourceComponentsProps> = () => {
    const { tableProps, paginationProps } = useTable<IPost, HttpError>({
        resource: "posts",
        columns: [
            {
                title: "Title",
                dataIndex: "title",
                key: "title",
            },
            {
                title: "Content",
                dataIndex: "content",
                key: "content",
            },
        ],
        pagination: {
            defaultPageSize: 10,
            pageSizeOptions: ["10", "20", "50", "100"],
        },
    });

    return (
        <Table {...tableProps} rowKey="id">
            <Table.Column dataIndex="title" title="Title" />
            <Table.Column dataIndex="content" title="Content" />
            <Table.Pagination {...paginationProps} />
        </Table>
    );
};

const { tableProps } = useTable({
  resource: "jobs",
  columns: [
    // Define your columns here
  ],
  pagination: {
    defaultPageSize: 10,
    pageSizeOptions: ["10", "20", "50", "100"],
  },
});

return (
  <Table {...tableProps} rowKey="id">
    {/* Define your Table.Columns here */}
  </Table>
);

const {{
    tableProps,
    paginationProps,
    pageSize,
    pageCount,
}} = useTable({{
    resource: "posts",
    columns: [
        // your columns here
    ],
    pagination: {{
        defaultPageSize: 10,
        pageSizeOptions: ["10", "20", "50", "100"],
    }},
}});

const totalCount = pageSize * pageCount;

getList: async ({ resource, pagination }) => {
  const url = `${apiUrl}/${resource}`;

  const { data, headers } = await httpClient.get(url, {
    params: {
      _start: (pagination.current - 1) * pagination.pageSize,
      _end: pagination.current * pagination.pageSize,
    },
  });

  const total = +headers["x-total-count"];

  return {
    data,
    total: total || data.length,
  };
},