import React, { useEffect, useState } from 'react';
import {
    Button,
    Col,
    Container,
    Form,
    Row,
} from '@theorchard/suite-components';
import cx from 'classnames';
import {
    AbacusContractLifecycleSchedulePeriodType,
    AbacusContractLifecycleScheduleRenewalType,
} from 'src/apollo/definitions/globalTypes';
import { CONTRACT_LIFECYCLE_MODAL_SCREENS } from 'src/apollo/type-constants/contract';
import { contractLifecycleScheduleFormValidation } from 'src/utils/form-validations/contract-form-validation';
import { SubsequentPeriodFormFields } from '../contract-lifecycle-shared/subsequent-period-form-fields';
import type {
    ContractLifecycle,
    ContractLifecycleSchedule,
} from 'src/types/abacus-contract-lifecycle';

export interface ContractLifecycleSubsequentPeriodPropTypes {
    contractLifecycle: any;
    contractLifecycleSchedules: any;
    saveHandler: () => void;
    setContractLifecycleSchedules: (
        params: ContractLifecycleSchedule[]
    ) => void;
    setServerError: (params: string | null) => void;
    setModalScreen: (params: string) => void;
    isVisible: boolean;
}

export const ContractLifecycleSubsequentPeriod: React.FC<
    ContractLifecycleSubsequentPeriodPropTypes
> = ({
    contractLifecycle,
    contractLifecycleSchedules,
    saveHandler,
    setContractLifecycleSchedules,
    setServerError,
    setModalScreen,
    isVisible,
}) => {
    const defaultFormValues: ContractLifecycleSchedule = {
        renewalType: null,
        renewalOffsetDetailInterval: null,
        renewalOffsetDetailType:
            AbacusContractLifecycleSchedulePeriodType.MONTH,
        scheduleEnd: null,
        terminationNoticeDetailInterval: null,
        terminationNoticeDetailType:
            AbacusContractLifecycleSchedulePeriodType.DAY,
    };
    const [currentSchedule, setCurrentSchedule] =
        useState<ContractLifecycleSchedule>(defaultFormValues);
    const [errors, setErrors] = useState<
        Partial<ContractLifecycle> & Partial<ContractLifecycleSchedule>
    >({});
    const [isSavingContract, setIsSavingContract] = useState(false);

    const handleBackButtonClick = () => {
        setServerError(null);
        setIsSavingContract(false);
        setModalScreen(CONTRACT_LIFECYCLE_MODAL_SCREENS.CURRENT_PERIOD);
    };

    const handleCreateButtonClick = () => {
        setIsSavingContract(true);
        const validationErrors = contractLifecycleScheduleFormValidation(
            currentSchedule,
            contractLifecycle.lifecycleTermStart
        );

        if (Object.keys(validationErrors).length > 0) {
            setErrors(validationErrors);
            return;
        }
        saveHandler();
    };

    const isCreateButtonDisabled = () => {
        if (isSavingContract) return true;
        switch (currentSchedule.renewalType) {
            case AbacusContractLifecycleScheduleRenewalType.CONTINUOUSLY_ACTIVE:
                return !currentSchedule.terminationNoticeDetailInterval;
            case AbacusContractLifecycleScheduleRenewalType.RENEW_PERIODICALLY:
                return (
                    !currentSchedule.terminationNoticeDetailInterval ||
                    !currentSchedule.renewalOffsetDetailInterval
                );
            default:
                return true;
        }
    };

    useEffect(() => {
        contractLifecycleSchedules[1] &&
            setCurrentSchedule(contractLifecycleSchedules[1]);
    }, [contractLifecycleSchedules]);

    return (
        <Container
            className={cx('ContractLifecycleFullScreenModal-Container', {
                visible: isVisible,
            })}
        >
            <Form>
                <SubsequentPeriodFormFields
                    currentSchedule={currentSchedule}
                    contractLifecycleSchedules={contractLifecycleSchedules}
                    defaultFormValues={defaultFormValues}
                    errors={errors}
                    setContractLifecycleSchedules={
                        setContractLifecycleSchedules
                    }
                    setErrors={setErrors}
                />
                <div className="ContractLifecycleFullScreenModal-Footer">
                    <Row>
                        <Col>
                            <Button
                                onClick={() => handleBackButtonClick()}
                                variant="quartenary"
                            >
                                Back
                            </Button>
                        </Col>
                        <Col>
                            <Button
                                data-testid="create-button"
                                disabled={isCreateButtonDisabled()}
                                onClick={handleCreateButtonClick}
                                variant="primary"
                            >
                                Create
                            </Button>
                        </Col>
                    </Row>
                </div>
            </Form>
        </Container>
    );
};