import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import ContractTermPresentationalGroups, {
    ContractTermPresentationalGroupsPropTypes,
} from '../contract-term-detail-presentational-groups';

jest.mock('@theorchard/suite-icons', () => ({
    GlyphIcon: (props: any) => <span data-testid="mockGlyphIcon" {...props} />,
}));

const setup = (
    overrideProps?: Partial<ContractTermPresentationalGroupsPropTypes>
) => {
    const defaultProps: ContractTermPresentationalGroupsPropTypes = {
        contractTermFormattedDataList: [],
        className: '',
    };

    const props = { ...defaultProps, ...overrideProps };

    return render(<ContractTermPresentationalGroups {...props} />);
};

describe('<ContractTermPresentationalGroups />', () => {
    it('renders without crashing', () => {
        const { container } = setup();
        expect(container).toBeInTheDocument();
    });

    it('renders an empty section if no contractTermFormattedDataList is provided', () => {
        setup();
        const emptySection = screen.getByTestId(
            'PresentationalGroupEmptySection'
        );
        expect(emptySection).toBeInTheDocument();

        const header = screen.queryByTestId('PresentationalGroupSectionItem');
        expect(header).not.toBeInTheDocument();
    });

    describe('when contractTermFormattedDataList has data', () => {
        const mockData = [
            {
                termId: '2345',
                catalogLength: 2,
                labelIds: undefined,
                contractTermName: 'product terms',
                details: [
                    {
                        presentationalGroup: {
                            name: 'Fraudulent Streams',
                            id: '19',
                            conditions: [
                                {
                                    transactionType: ['FS'],
                                    service: ['store'],
                                    country: ['US'],
                                    labelShare: 10,
                                    priority: 1,
                                    id: 1,
                                },
                                {
                                    transactionType: ['FP'],
                                    service: ['B'],
                                    country: [
                                        'US',
                                        'GB',
                                        'AU',
                                        'NZ',
                                        'FR',
                                        'ES',
                                        'PL',
                                        'CA',
                                        'MX',
                                        'CN',
                                        'JP',
                                    ],
                                    labelShare: 15,
                                    priority: 2,
                                    id: 2,
                                },
                            ],
                            exceptions: [],
                            defaultLabelShare: 15,
                        },
                    },
                ],
                attachments: ['upc1', 'upc2'],
                termType: 'product',
            },
            {
                termId: '1234',
                catalogLength: undefined,
                labelIds: null,
                contractTermName: 'Term 2',
                details: [
                    {
                        presentationalGroup: {
                            name: 'Digital',
                            id: '20',
                            conditions: [
                                {
                                    transactionType: ['S'],
                                    service: ['All'],
                                    country: ['All'],
                                    labelShare: 5,
                                    priority: 1,
                                    id: 1,
                                },
                            ],
                            exceptions: [],
                            defaultLabelShare: 5,
                        },
                    },
                ],
                attachments: null,
                termType: 'label',
            },
        ];

        beforeEach(() => {
            setup({ contractTermFormattedDataList: mockData });
        });

        it('renders Section items for each detail in each term', () => {
            expect(screen.getByText(/Fraudulent Streams/i)).toBeInTheDocument();
            expect(screen.getByText(/Digital • 5%/i)).toBeInTheDocument();
        });

        it('renders correct table headers', async () => {
            expect(screen.getAllByText('#')[0]).toBeInTheDocument();
            expect(
                screen.getAllByText('Transaction Type')[0]
            ).toBeInTheDocument();
            expect(screen.getAllByText('Country')[0]).toBeInTheDocument();
            expect(screen.getAllByText('Service')[0]).toBeInTheDocument();
            expect(screen.getAllByText(`Label's Share`)[0]).toBeInTheDocument();
        });

        it('renders hidden count', async () => {
            const countries =
                screen.getAllByTestId('country-cell')[1].innerHTML;
            expect(countries).toContain(
                'US, GB, AU, NZ, FR, ES, PL, CA, MX, CN,'
            );
            expect(countries).not.toContain('JP');
            const hiddenCount = screen.getAllByTestId(
                'ContractTermsConditionsGridTableHiddenCount'
            )[0];
            expect(hiddenCount.innerHTML).toContain('+1');
        });

        it('shows more when hidden count clicked', async () => {
            const hiddenCountButton =
                screen.getAllByTestId('HiddenCount-button')[0];
            fireEvent.click(hiddenCountButton);
            const hiddenCount = screen.getAllByTestId(
                'ContractTermsConditionsGridTableHiddenCount'
            )[0];
            const countries =
                screen.getAllByTestId('country-cell')[1].innerHTML;
            expect(countries).toContain(
                'US, GB, AU, NZ, FR, ES, PL, CA, MX, CN, JP'
            );
            expect(hiddenCount.innerHTML).not.toContain('+1');
        });

        it('displays the conditions in a table', () => {
            const allIdCells = screen.getAllByTestId('id-cell');
            const allTransactionTypeCells = screen.getAllByTestId(
                'transactionType-cell'
            );
            const allServiceCells = screen.getAllByTestId('service-cell');
            const allCountryCells = screen.getAllByTestId('country-cell');
            const allLabelShareCells = screen.getAllByTestId('labelshare-cell');

            // Check first row in first table
            expect(allIdCells[0].innerHTML).toContain('1');
            expect(allTransactionTypeCells[0].innerHTML).toContain('FS');
            expect(allServiceCells[0].innerHTML).toContain('store');
            expect(allCountryCells[0].innerHTML).toContain('US');
            expect(allLabelShareCells[0].innerHTML).toContain('10%');

            // Check second row in first table
            expect(allIdCells[1].innerHTML).toContain('2');
            expect(allTransactionTypeCells[1].innerHTML).toContain('FP');
            expect(allServiceCells[1].innerHTML).toContain('B');
            expect(allCountryCells[1].innerHTML).toContain(
                'US, GB, AU, NZ, FR, ES, PL, CA, MX, CN,'
            );
            expect(allLabelShareCells[1].innerHTML).toContain('15%');

            // Check first row in second table
            expect(allIdCells[2].innerHTML).toContain('1');
            expect(allTransactionTypeCells[2].innerHTML).toContain('S');
            expect(allServiceCells[2].innerHTML).toContain('All');
            expect(allCountryCells[2].innerHTML).toContain('All');
            expect(allLabelShareCells[2].innerHTML).toContain('5%');
        });
    });
});