import { useState } from "react";

import styles from "./CreateDealButton.module.css";
import { Text, Transition } from "@mantine/core";
import CreateCardForm from "../CreateCardForm/CreateCardForm.tsx";
import { CardService, StatusSchema } from "../../../../client";
import { useQueryClient } from "@tanstack/react-query";
import { dateWithoutTimezone } from "../../../../shared/lib/date.ts";
import { usePrefillCardContext } from "../../../../pages/CardsPage/contexts/PrefillCardContext.tsx";
import isModuleInProject from "../../../../modules/utils/isModuleInProject.ts";
import { useProjectsContext } from "../../../../contexts/ProjectsContext.tsx";
import { ModuleNames } from "../../../../modules/modules.tsx";

type Props = {
    status: StatusSchema;
}

const CreateCardButton = ({ status }: Props) => {
    const [isCreating, setIsCreating] = useState(false);
    const [isTransitionEnded, setIsTransitionEnded] = useState(true);
    const queryClient = useQueryClient();
    const { prefillCard, setPrefillCard } = usePrefillCardContext();

    const { selectedProject } = useProjectsContext();
    const isPrefillingDealEnabled = isModuleInProject(ModuleNames.SERVICES_AND_PRODUCTS, selectedProject);

    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}>
                        <CreateCardForm
                            onCancel={() => {
                                setPrefillCard(undefined);
                                setIsCreating(false);
                            }}
                            onSubmit={quickDeal => {
                                CardService.quickCreateCardQuickCreatePost({
                                    requestBody: {
                                        ...quickDeal,
                                        acceptanceDate: dateWithoutTimezone(
                                            quickDeal.acceptanceDate,
                                        ),
                                        statusId: status.id,
                                    },
                                }).then(async (result) => {
                                    if (isPrefillingDealEnabled && prefillCard) {
                                        CardService.prefillCard({
                                            requestBody: {
                                                oldCardId: prefillCard.id,
                                                newCardId: result.cardId,
                                            },
                                        });
                                    }
                                    await queryClient.invalidateQueries({
                                        queryKey: ["getCardSummaries"],
                                    });
                                    setIsCreating(false);
                                    setPrefillCard(undefined);
                                });
                            }}
                        />
                    </div>
                )}
            </Transition>
        </div>
    );
};
export default CreateCardButton;