Dưới đây là đoạn code pagination : 

Bạn tạo component app\component\MyPaginate.tsx

'use client';

import { Pagination } from 'flowbite-react';
import { usePathname, useRouter, useSearchParams } from 'next/navigation';
import React, { useState, useEffect } from 'react';

const MyPaginate = ({ totalpage }: { totalpage: number }) => {
    const router = useRouter();
    const pathname = usePathname();
    const searchParams = useSearchParams();
    // Total page
    const pageCount = totalpage;
    // Get current page from URL query, default to 1 if not present
    const currentPageFromQuery = parseInt(searchParams.get("page") ?? '1', 10);
    const [currentPage, setCurrentPage] = useState(currentPageFromQuery);
    useEffect(() => {
        setCurrentPage(currentPageFromQuery);
    }, [currentPageFromQuery]);

    const handlePagination = (page: number) => {
        const selectedPage = page;
        if (isNaN(selectedPage) || selectedPage <= 0) {
            router.push(`${pathname}`);
        } else {
            router.push(`${pathname}?page=${selectedPage}`);
        }
    };

    return (
        <div>
            <Pagination
                totalPages={pageCount}
                currentPage={currentPage}
                onPageChange={handlePagination}
                showIcons
            />
        </div>
    );
};

export default MyPaginate;

Để sử dụng nó ta chỉ cần gọi như sau 

.............
import MyPaginate from "@/component/MyPaginate";
...................
 <MyPaginate totalpage={10} />

Vậy là xong