import { modals } from "@mantine/modals";
import useServicesKitsTableColumns from "@/app/services/components/shared/ServicesKitTable/hooks/useServicesKitsTableColumns";
import { useServicesContext } from "@/app/services/contexts/ServicesContext";
import BaseTable from "@/components/ui/BaseTable/BaseTable";
import useIsMobile from "@/hooks/utils/useIsMobile";
import { ServicesKitSchema } from "@/lib/client";

const ServicesKitsTable = () => {
    const { servicesKitCrud, servicesKitList } = useServicesContext();
    const isMobile = useIsMobile();

    const onChange = (kit: ServicesKitSchema) => {
        modals.openContextModal({
            modal: "servicesKitEditorModal",
            title: "Редактирование набора услуг",
            withCloseButton: false,
            innerProps: {
                entity: kit,
                onChange: value => servicesKitCrud.onUpdate(kit.id, value),
                isEditing: true,
            },
        });
    };

    const columns = useServicesKitsTableColumns({
        onChange,
        onDelete: servicesKitCrud.onDelete,
    });

    return (
        <BaseTable
            records={servicesKitList.servicesKits}
            columns={columns}
            groups={undefined}
            withTableBorder
            verticalSpacing={"xs"}
            mx={isMobile ? "xs" : 0}
        />
    );
};

export default ServicesKitsTable;
