import React, {
    useEffect,
    useState,
    type Dispatch,
    type SetStateAction,
} from 'react';
import { useApolloClient } from '@apollo/client';
import { Sidecar, useToast } from '@theorchard/suite-components';
import { useBulkCreateSigningEntitySapProfitCenters } from 'src/apollo/mutations/reference-sap-profit-center';
import {
    signingEntityMappedSuccess,
    FAILED_TO_MAPPED_SIGNING_ENTITIES,
} from 'src/apollo/type-constants/reference-sap-profit-center';
import { EditMappedSigningEntitiesFormFields } from 'src/components/reference-sap-profit-center-edit/edit-mapped-signing-entities-form-fields';
import { SidecarActivityProvider } from 'src/components/reference-sap-profit-center-edit/sidecar-activity-context';
import type { ReferenceSapProfitCenterEditForm } from 'src/types/reference-sap-profit-center';

export interface EditMappedSigningEntitiesPropTypes {
    isSidecarOpen: boolean;
    profitCenter: any;
    setIsSidecarOpen: Dispatch<SetStateAction<boolean>>;
}

export const EditMappedSigningEntities: React.FC<
    EditMappedSigningEntitiesPropTypes
> = ({ isSidecarOpen, profitCenter, setIsSidecarOpen }) => {
    const [error, setError] = useState<string | null>(null);
    const [formData, setFormData] = useState<ReferenceSapProfitCenterEditForm>({
        displayName: profitCenter?.displayName ?? '',
        referenceSapProfitCenterId:
            profitCenter?.referenceSapProfitCenterId ?? '',
        referenceSigningEntityIds: [],
    });
    const [isSavingFormData, setIsSavingFormData] = useState<boolean>(false);
    const [isDeletingEntity, setIsDeletingEntity] = useState<boolean>(false);
    const [deleteError, setDeleteError] = useState<string | null>(null);

    const client = useApolloClient();
    const addToast = useToast();

    const bulkCreateSigningEntities =
        useBulkCreateSigningEntitySapProfitCenters();

    const handleClose = () => {
        if (!isSavingFormData && !isDeletingEntity) {
            setIsSidecarOpen(false);
            setError(null);
            setDeleteError(null);
        }
    };

    useEffect(() => {
        if (isSidecarOpen) {
            setFormData({
                displayName: profitCenter.displayName!,
                referenceSapProfitCenterId:
                    profitCenter.referenceSapProfitCenterId!,
                referenceSigningEntityIds: [],
            });
            setError(null);
        }
    }, [isSidecarOpen]);

    const changeHandler = (
        fieldName: string,
        value: string | undefined | null | string[]
    ) => {
        setDeleteError(null);
        setError(null);
        setFormData((prev: any) => ({ ...prev, [fieldName]: value }));
    };

    const submitHandler = () => {
        setIsSavingFormData(true);
        bulkCreateSigningEntities({
            variables: {
                referenceSapProfitCenterId: formData.referenceSapProfitCenterId,
                referenceSigningEntityIds: formData.referenceSigningEntityIds,
            },
        })
            .then(() => {
                setIsSavingFormData(false);
                setFormData({
                    ...formData,
                    referenceSigningEntityIds: [],
                });
                addToast(signingEntityMappedSuccess(formData?.displayName));

                client.cache.evict({
                    id: 'ROOT_QUERY',
                    fieldName: 'abacusReferenceSapProfitCenterList',
                });

                client.cache.evict({
                    id: 'ROOT_QUERY',
                    fieldName: 'abacusSigningEntitiesBySapProfitCenter',
                });
            })
            .catch(() => {
                setIsSavingFormData(false);
                setError(`Error: ${FAILED_TO_MAPPED_SIGNING_ENTITIES}`);
            });
    };
    return (
        <Sidecar
            isOpen={isSidecarOpen}
            onConfirm={undefined}
            onRequestClose={handleClose}
            title={formData?.displayName ?? ''}
            testId="ProfitCenterFormSidecar"
        >
            <SidecarActivityProvider
                deleteError={deleteError}
                isDeletingEntity={isDeletingEntity}
                isSavingFormData={isSavingFormData}
                setIsDeletingEntity={setIsDeletingEntity}
                setDeleteError={setDeleteError}
            >
                <EditMappedSigningEntitiesFormFields
                    changeHandler={changeHandler}
                    error={error}
                    formData={formData}
                    submitHandler={submitHandler}
                />
            </SidecarActivityProvider>
        </Sidecar>
    );
};

export default EditMappedSigningEntities;