import {
    ChevronLeft,
    ChevronRight,
    ChevronsLeft,
    ChevronsRight,
} from 'lucide-react';

import { Button } from '@/Components/ui/button';

export function DataTablePagination({
    changePage,
    currentPage,
    pageCount,
}: {
    currentPage: number;
    pageCount: number;
    changePage: (value: number) => void;
    table?: unknown;
}) {
    return (
        <div className="flex items-center justify-between pl-2">
            <div></div>
            <div className="flex items-center space-x-6 lg:space-x-8">
                <div className="flex items-center space-x-2">
                    <Button
                        variant="outline"
                        className="h-8 w-8 rounded-full border-0 bg-white p-0 shadow-md lg:flex"
                        onClick={() => changePage(1)}
                        disabled={currentPage === 1}
                    >
                        <span className="sr-only">Go to first page</span>
                        <ChevronsLeft />
                    </Button>
                    <Button
                        variant="outline"
                        className="h-8 w-8 rounded-full border-0 bg-white p-0 shadow-md"
                        onClick={() => changePage(currentPage - 1)}
                        disabled={currentPage === 1}
                    >
                        <span className="sr-only">Go to previous page</span>
                        <ChevronLeft />
                    </Button>
                    <div className="flex w-[100px] items-center justify-center text-sm font-medium">
                        Pagina {currentPage} di {pageCount}
                    </div>
                    <Button
                        variant="outline"
                        className="h-8 w-8 rounded-full border-0 bg-white p-0 shadow-md"
                        onClick={() => changePage(currentPage + 1)}
                        disabled={currentPage === pageCount}
                    >
                        <span className="sr-only">Go to next page</span>
                        <ChevronRight />
                    </Button>
                    <Button
                        variant="outline"
                        className="h-8 w-8 rounded-full border-0 bg-white p-0 shadow-md lg:flex"
                        onClick={() => changePage(pageCount)}
                        disabled={currentPage === pageCount}
                    >
                        <span className="sr-only">Go to last page</span>
                        <ChevronsRight />
                    </Button>
                </div>
            </div>
        </div>
    );
}
