import { Input } from "@/components/mutual/shadcnui/input";
import { Label } from "@/components/mutual/shadcnui/label";
import { PaginationDetailsProps } from "@/validations/mutual/pagination/type";

const PaginationDetails: React.FC<PaginationDetailsProps> = ({
    pagination,
    setPagination,
    defaultPagination,
}) => {
    return (
        <div className="grid grid-cols-6 gap-2 items-center justify-evenly">
            <Label>Page Size</Label>
            <Input
                type="number"
                value={pagination.size}
                onChange={(e) => setPagination({ ...defaultPagination, size: Number(e.target.value) })}
            />
            <Label>Order Field</Label>
            <Input
                type="text"
                value={pagination.orderFields.join(",")}
                onChange={(e) => setPagination({ ...defaultPagination, orderFields: e.target.value.split(",") })}
            />
            <Label>Order Type</Label>
            <Input
                type="text"
                value={pagination.orderTypes.join(",")}
                onChange={(e) => setPagination({ ...pagination, orderType: e.target.value.split(",") })}
            />
        </div>
    )
}

export default PaginationDetails