import React from 'react';
import { fireEvent, screen } from '@testing-library/react';
import { renderInAppContext } from '@theorchard/suite-testing';
import { AbacusContractMechDeductionTerritory } from 'src/apollo/definitions/globalTypes';
import { contractMechanicalDeductionExistMsg } from 'src/apollo/type-constants/contract';
import {
    ContractMechanicalDeductionTerritory,
    ContractMechanicalDeductionTerritoryPropTypes,
} from 'src/components/contract-mechanical-deduction-create/contract-mechanical-deduction-territory';

describe('<ContractMechanicalDeductionTerritory />', () => {
    const defaultProps: ContractMechanicalDeductionTerritoryPropTypes = {
        existingMechDeductionTerritories: [],
        contractMechanicalDeduction: {
            adminFee: '',
            adminType: null,
            isAdminFeeSelected: false,
            mechanicalType: [],
            territory: AbacusContractMechDeductionTerritory.USA,
        },
        setContractMechanicalDeduction: jest.fn(),
    };
    const render = (
        props: ContractMechanicalDeductionTerritoryPropTypes = defaultProps
    ) =>
        renderInAppContext(<ContractMechanicalDeductionTerritory {...props} />);

    it('renders Territories segmented buttons', () => {
        render();

        expect(screen.getByText('US')).toBeInTheDocument();
        expect(screen.getByText('Canada')).toBeInTheDocument();
        expect(screen.getByText('Rest of the World')).toBeInTheDocument();
    });

    it('shows the active territory button', () => {
        render();

        expect(screen.getByTestId('USA-territory')).toHaveClass('active');
        expect(screen.getByTestId('CAN-territory')).not.toHaveClass('active');
        expect(screen.getByTestId('ROW-territory')).not.toHaveClass('active');
    });

    it('disables the US territory if mech deduction is already available for it', () => {
        const props: ContractMechanicalDeductionTerritoryPropTypes = {
            existingMechDeductionTerritories: [
                AbacusContractMechDeductionTerritory.USA,
            ],
            contractMechanicalDeduction: {
                adminFee: '',
                adminType: null,
                isAdminFeeSelected: false,
                mechanicalType: [],
                territory: AbacusContractMechDeductionTerritory.CAN,
            },
            setContractMechanicalDeduction: jest.fn(),
        };
        render(props);

        expect(screen.getByTestId('USA-territory')).toBeDisabled();
        expect(screen.getByTestId('USA-territory')).not.toHaveClass('active');

        expect(screen.getByTestId('CAN-territory')).not.toBeDisabled();
        expect(screen.getByTestId('CAN-territory')).toHaveClass('active');

        expect(screen.getByTestId('ROW-territory')).not.toBeDisabled();
        expect(screen.getByTestId('ROW-territory')).not.toHaveClass('active');
    });

    it('shows tooltip for the US territory if mech deduction already available for it', async () => {
        const props: ContractMechanicalDeductionTerritoryPropTypes = {
            existingMechDeductionTerritories: [
                AbacusContractMechDeductionTerritory.USA,
            ],
            contractMechanicalDeduction: {
                adminFee: '',
                adminType: null,
                isAdminFeeSelected: false,
                mechanicalType: [],
                territory: AbacusContractMechDeductionTerritory.CAN,
            },
            setContractMechanicalDeduction: jest.fn(),
        };
        render(props);
        const tooltip = screen.getByTestId('Tooltip');
        expect(tooltip).toBeInTheDocument();

        fireEvent.mouseOver(tooltip);
        await screen.findByText(contractMechanicalDeductionExistMsg('US'));
    });
});
