import { useState } from "react";

import styles from "./CreateDealButton.module.css";
import { Text, Transition } from "@mantine/core";
import CreateDealFrom from "../CreateDealForm/CreateDealFrom.tsx";
import { DealService } from "../../../client";
import { useQueryClient } from "@tanstack/react-query";
import { dateWithoutTimezone } from "../../../shared/lib/date.ts";
import { usePrefillDealContext } from "../../../pages/LeadsPage/contexts/PrefillDealContext.tsx";

const CreateDealButton = () => {
    const [isCreating, setIsCreating] = useState(false);
    const [isTransitionEnded, setIsTransitionEnded] = useState(true);
    const queryClient = useQueryClient();
    const { prefillDeal, setPrefillDeal } = usePrefillDealContext();

    return (
        <div
            className={styles["container"]}
            onClick={() => {
                if (isCreating) return;
                setIsCreating(prevState => !prevState);
                setIsTransitionEnded(false);
            }}>
            {!isCreating && isTransitionEnded && (
                <Text>Быстрое добавление</Text>
            )}
            <Transition
                mounted={isCreating}
                transition={"scale-y"}
                onExited={() => setIsTransitionEnded(true)}>
                {styles => (
                    <div style={styles}>
                        <CreateDealFrom
                            onCancel={() => {
                                setPrefillDeal(undefined);
                                setIsCreating(false);
                            }}
                            onSubmit={quickDeal => {
                                DealService.quickCreateDealQuickCreatePost({
                                    requestBody: {
                                        ...quickDeal,
                                        acceptanceDate: dateWithoutTimezone(
                                            quickDeal.acceptanceDate,
                                        ),
                                    },
                                }).then(async (result) => {
                                    if (prefillDeal) {
                                        DealService.prefillDeal({
                                            requestBody: {
                                                oldDealId: prefillDeal.id,
                                                newDealId: result.dealId,
                                            },
                                        });
                                    }
                                    await queryClient.invalidateQueries({
                                        queryKey: ["getDealSummaries"],
                                    });
                                    setIsCreating(false);
                                    setPrefillDeal(undefined);
                                });
                            }}
                        />
                    </div>
                )}
            </Transition>
        </div>
    );
};
export default CreateDealButton;
