import React, { useState, useEffect, type JSX } from 'react';
import {
    ABACUS_ACTION_STATUSES,
    ABACUS_ACTIONS,
} from '@theorchard/accounting-apps-shared';
import { Alert } from '@theorchard/suite-components';
import { isEmpty, filter } from 'lodash-es';
import { ELIGIBILITY_STATUS_INFO } from 'src/constants';
import type { ActionState } from 'src/types/action-state';

export interface EligibilityAlertProps {
    actionStates: ActionState[];
    actionName: string;
}

export default function EligibilityAlert({
    actionStates,
    actionName,
}: EligibilityAlertProps) {
    const [alertText, setAlertText] = useState<JSX.Element | null>(null);

    const getEligibilityInfoType = () => {
        switch (actionName) {
            case ABACUS_ACTIONS.PAYMENT_ELIGIBILITY:
                return 'payment';
            case ABACUS_ACTIONS.TAX_ELIGIBILITY:
                return 'tax';
            default:
                return 'unknown type';
        }
    };

    const isAbacusActionStatusEligible = (actionStatus: string) => {
        switch (actionName) {
            case ABACUS_ACTIONS.PAYMENT_ELIGIBILITY:
                return actionStatus === ABACUS_ACTION_STATUSES.APPROVED;
            case ABACUS_ACTIONS.TAX_ELIGIBILITY:
                return actionStatus === ABACUS_ACTION_STATUSES.COMPLETE;
            default:
                return false;
        }
    };

    useEffect(() => {
        if (!isEmpty(actionStates)) {
            const requiredAction = filter(actionStates, { actionName });
            if (
                !isEmpty(requiredAction) &&
                !isAbacusActionStatusEligible(requiredAction[0].actionStatus)
            ) {
                const displayText = (
                    <div data-testid="eligibilityAlertTestid">
                        <div>
                            <strong>
                                Missing {getEligibilityInfoType()} info
                            </strong>
                        </div>
                        <div>
                            {
                                ELIGIBILITY_STATUS_INFO[
                                    requiredAction[0].actionStatus
                                ]
                            }
                        </div>
                        {requiredAction[0].actionStatus ===
                            ABACUS_ACTION_STATUSES.REJECTED && (
                            <div
                                className="eligibilityAlertDetail"
                                data-testid="eligibilityAlertDetailTestid"
                            >
                                {requiredAction[0].message}
                            </div>
                        )}
                    </div>
                );
                setAlertText(displayText);
            }
        }
    }, [actionStates]);

    return alertText ? <Alert variant="error" text={alertText} /> : <></>;
}