import React from 'react';
import { ABACUS_ACTIONS } from '@theorchard/accounting-apps-shared';
import { Col, Container, Label, Row } from '@theorchard/suite-components';
import { isEmpty } from 'lodash-es';
import EligibilityAlert from 'src/components/account-detail/eligibility-alert';
import TableBasic from 'src/components/shared/table-basic';
import { USER_FEATURES } from 'src/constants';
import { getCountryName } from 'src/utils/country';
import { isFeatureFlagEnabled } from 'src/utils/feature-flag';
import type {
    AccountDetailAccountTaxInfo,
    AccountDetailAccountTaxInfoHistory,
} from 'src/types/abacus-account';
import type { ActionState } from 'src/types/action-state';

export interface AccountTaxInfoDetailProps {
    accountTaxInfo: AccountDetailAccountTaxInfo;
    accountTaxInfoHistory: AccountDetailAccountTaxInfoHistory;
    actionStates: ActionState[];
}

export default function AccountTaxInfoDetail({
    accountTaxInfo,
    accountTaxInfoHistory,
    actionStates,
}: AccountTaxInfoDetailProps) {
    const { countryOfTaxResidence, isSbaSigned, isTaxTreatyClaimed } =
        accountTaxInfo;

    const tableHeaders = [
        'Country of tax residence history',
        'Start Date',
        'End Date',
    ];
    const countryOfTaxResidenceName = getCountryName(countryOfTaxResidence);
    const isFeatureShowTaxTreatyClaimedEnabled = isFeatureFlagEnabled(
        USER_FEATURES.ABACUS_TAP_SHOW_TAX_TREATY_CLAIMED
    );
    const formatRows = () => {
        if (isEmpty(accountTaxInfoHistory))
            return [
                {
                    id: 1,
                    cols: [<i>There are no prior entries</i>, '-', '-'],
                },
            ];

        return accountTaxInfoHistory.map(historyItem => ({
            id: historyItem?.accountTaxInfoHistoryId ?? '',
            cols: [
                getCountryName(historyItem?.countryOfTaxResidence),
                historyItem?.createdAt,
                historyItem?.lastModified,
            ],
        }));
    };

    return (
        <div className="AccountDetail-tax-info" data-testid="accountTaxInfo">
            <EligibilityAlert
                actionStates={actionStates}
                actionName={ABACUS_ACTIONS.TAX_ELIGIBILITY}
            />
            <Container>
                <Row>
                    <Col xs={3}>
                        <Label text="Country of Tax Residence" />
                        {countryOfTaxResidenceName}
                    </Col>
                    {countryOfTaxResidence === 'GBR' && (
                        <Col xs={3}>
                            <Label text="Self Billing Agreement VAT" />
                            {isSbaSigned ? 'Yes' : 'No'}
                        </Col>
                    )}
                    {isFeatureShowTaxTreatyClaimedEnabled && (
                        <Col xs={3}>
                            <Label text="Tax Treaty Claimed" />
                            {isTaxTreatyClaimed ? 'Yes' : 'No'}
                        </Col>
                    )}
                </Row>
                <hr />
                <div
                    className="AccountDetail-tax-info-history"
                    data-testid="accountTaxInfoHistory"
                >
                    <TableBasic headers={tableHeaders} rows={formatRows()} />
                </div>
            </Container>
        </div>
    );
}