CoreControl/components/Pagination.tsx

export default function Pagination({
    currentPage,
    totalItems,
    itemsPerPage,
    onPageChange
}: {
    currentPage: number;
    totalItems: number;
    itemsPerPage: number;
    onPageChange: (page: number) => void;
}) {
    const totalPages = Math.max(1, Math.ceil(totalItems / itemsPerPage));
    
    if (totalItems === 0) {
        return null;
    }

    return (
        <div className="flex justify-center pt-4">   
                <div className="join">
                    <button 
                        className="join-item btn" 
                        onClick={() => onPageChange(currentPage - 1)} 
                        disabled={currentPage === 1}
                    >
                        «
                    </button>
                    <button className="join-item btn">Page {currentPage}</button>
                    <button 
                        className="join-item btn" 
                        onClick={() => onPageChange(currentPage + 1)} 
                        disabled={currentPage === totalPages || totalItems === 0}
                    >
                        »
                    </button>
                </div>
            </div>
    );
}