import { FC } from "react";
import { IconCopy, IconMoodSad } from "@tabler/icons-react";
import { Button, Flex, Group, Stack, Text } from "@mantine/core";
import { modals } from "@mantine/modals";
import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
import BaseTable from "@/components/ui/BaseTable/BaseTable";
import { DealProductSchema, ProductServiceSchema } from "@/lib/client";
import useProductServicesTableColumns from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/hooks/useProductServicesTableColumns";
import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";

type Props = {
    dealProduct: DealProductSchema;
    onDuplicateServices?: () => void;
    onKitAdd?: () => void;
};

const ProductServicesTable: FC<Props> = ({
    dealProduct,
    onDuplicateServices,
    onKitAdd,
}) => {
    const { productServiceCrud, dealProductsList } =
        useFulfillmentBaseContext();

    const onChange = (item: ProductServiceSchema) => {
        const excludeServiceIds = dealProduct.productServices.map(
            productService => productService.service.id
        );
        const totalQuantity = dealProductsList.dealProducts.reduce(
            (sum, prod) => prod.quantity + sum,
            0
        );

        modals.openContextModal({
            modal: "productServiceEditorModal",
            innerProps: {
                entity: item,
                onChange: values =>
                    productServiceCrud.onUpdate(
                        item.dealId,
                        item.productId,
                        item.serviceId,
                        values
                    ),
                excludeServiceIds,
                quantity: totalQuantity,
                isEditing: true,
            },
            withCloseButton: false,
        });
    };

    const columns = useProductServicesTableColumns({
        data: dealProduct.productServices,
        quantity: dealProduct.quantity,
        onDelete: productServiceCrud.onDelete,
        onChange,
    });

    const onCreateClick = () => {
        const excludeServiceIds = dealProduct.productServices.map(
            productService => productService.service.id
        );

        modals.openContextModal({
            modal: "productServiceEditorModal",
            innerProps: {
                onCreate: values =>
                    productServiceCrud.onCreate({ ...dealProduct, ...values }),
                excludeServiceIds,
                quantity: dealProduct.quantity,
                isEditing: false,
            },
            withCloseButton: false,
        });
    };

    const isEmptyTable = dealProduct.productServices.length === 0;

    return (
        <Stack gap={0}>
            <BaseTable
                records={dealProduct.productServices}
                columns={columns}
                groups={undefined}
                idAccessor={"serviceId"}
                withTableBorder
                style={{
                    height: isEmptyTable ? "8rem" : "auto",
                }}
                emptyState={
                    <Group
                        gap={"xs"}
                        mt={isEmptyTable ? "xl" : 0}>
                        <Text>Нет услуг</Text>
                        <IconMoodSad />
                    </Group>
                }
            />
            <Flex
                justify={"flex-end"}
                gap={"xs"}
                pt={"xs"}>
                {onDuplicateServices && (
                    <ActionIconWithTip
                        tipLabel={"Продублировать услуги"}
                        onClick={onDuplicateServices}>
                        <IconCopy />
                    </ActionIconWithTip>
                )}
                {onKitAdd && (
                    <Button
                        onClick={onKitAdd}
                        variant={"default"}>
                        Добавить набор услуг
                    </Button>
                )}
                <Button
                    onClick={onCreateClick}
                    variant={"default"}>
                    Добавить услугу
                </Button>
            </Flex>
        </Stack>
    );
};
export default ProductServicesTable;
