import {DealProductSchema} from "../../../client";
import {ContextModalProps} from "@mantine/modals";
import {Button, Flex, rem} from "@mantine/core";
import {useState} from "react";
import ObjectMultiSelect from "../../../components/ObjectMultiSelect/ObjectMultiSelect.tsx";
import {notifications} from "../../../shared/lib/notifications.ts";

type Props = {
    dealProducts: DealProductSchema[];
    dealProduct: DealProductSchema;
    onSelect: (
        sourceProduct: DealProductSchema,
        destinationProducts: DealProductSchema[]
    ) => void
}

const SelectDealProductsModal = ({
                                     context,
                                     id,
                                     innerProps
                                 }: ContextModalProps<Props>) => {
    const [dealProducts, setDealProducts] = useState<DealProductSchema[]>([]);
    const onSelectClick = () => {
        if (!dealProducts) {
            notifications.error({message: "Выберите товары на которые необходимо продублировать услуги"});
            return;
        }
        innerProps.onSelect(innerProps.dealProduct, dealProducts);
        context.closeContextModal(id);
    }
    return (
        <Flex direction={"column"} gap={rem(10)}>
            <Flex>
                <ObjectMultiSelect<DealProductSchema>
                    w={"100%"}
                    label={"Товары"}
                    placeholder={"Выберите товары на которые нужно продублировать услуги"}
                    onChange={setDealProducts}
                    value={dealProducts}
                    data={innerProps.dealProducts}
                    getLabelFn={item => item.product.name}
                    getValueFn={item => item.product.id.toString()}
                    filterBy={item => item !== innerProps.dealProduct}
                />
            </Flex>
            <Flex gap={rem(10)} justify={"flex-end"}>
                <Button
                    variant={"subtle"}
                    onClick={() => context.closeContextModal(id)}
                >
                    Отменить
                </Button>
                <Button
                    onClick={onSelectClick}
                    variant={"default"}
                >
                    Продублировать
                </Button>
            </Flex>
        </Flex>
    )
}

export default SelectDealProductsModal;