import React from 'react';
import { NetworkStatus } from '@apollo/client';
import { screen } from '@testing-library/react';
import { Identity } from '@theorchard/suite-frontend';
import { createIdentity, renderInAppContext } from '@theorchard/suite-testing';
import { payoneerProgramsList } from 'src/__fixtures__/graphql/payment-entity-payoneer-programs';
import * as payoneerProgramQuery from 'src/apollo/queries/payment-entity-payoneer-program';
import PayoneerProgramsList, {
    PAYONEER_PROGRAMS_LIST_HEADERS,
} from 'src/components/reference/payoneer-programs-list';
import { DEFAULT_NO_RESULTS_MSG } from 'src/constants';
import type { GetPaymentEntityPayoneerProgramsListQuery } from 'src/apollo/queries/payment-entity-payoneer-program/__generated__/get-payment-entity-payoneer-programs-list';

describe('<PayoneerProgramsList>', () => {
    let requestSpy: any;
    jest.useFakeTimers();
    afterEach(jest.restoreAllMocks);

    beforeEach(() => {
        requestSpy = jest
            .spyOn(payoneerProgramQuery, 'usePayoneerProgramsList')
            .mockReturnValue({
                data: payoneerProgramsList as GetPaymentEntityPayoneerProgramsListQuery,
                fetchMore: jest.fn(),
                loading: false,
                error: undefined,
                networkStatus: NetworkStatus.ready,
            });
    });

    const render = (mockIdentity?: Partial<Identity>) =>
        renderInAppContext(<PayoneerProgramsList />, {
            identity: createIdentity(mockIdentity),
        });

    it('requests a list of payoneer programs on render', () => {
        render();
        expect(requestSpy).toHaveBeenCalled();
    });

    it('show message when there are no payoneer programs', () => {
        jest.spyOn(
            payoneerProgramQuery,
            'usePayoneerProgramsList'
        ).mockReturnValue({
            data: {
                abacusPaymentEntityPayoneerProgramsList: {
                    items: [],
                    totalCount: 0,
                },
            },
            fetchMore: jest.fn(),
            loading: false,
            error: undefined,
            networkStatus: NetworkStatus.ready,
        });
        render();
        expect(screen.getByText(DEFAULT_NO_RESULTS_MSG)).toBeDefined();
    });

    it('renders a table with headers', () => {
        render();
        PAYONEER_PROGRAMS_LIST_HEADERS.forEach((header: any) =>
            expect(screen.getByText(header.title)).toBeDefined()
        );
    });

    it('renders a list of payoneer programs', () => {
        render();
        const bodyText: any = [];
        document
            .querySelectorAll('div.GridTable-cell-text')
            .forEach((body: any) => bodyText.push(body.textContent));
        expect(bodyText).toEqual([
            'AWAL-UK',
            'AWAL Core',
            'EUR',
            'AWAL Core - EUR',
            '101176710',
            'EUR',
            'AWAL-UK',
            'AWAL Core',
            'GBP',
            'AWAL Core - GBP',
            '111176831',
            'GBP',
            'AWAL-UK',
            'AWAL +, AWAL Recording',
            'AUD, CAD, DKK',
            'AWAL UK USD MC',
            '111176832',
            'USD',
            'KNR-UK',
            '-',
            '-',
            '-',
            '-',
            '-',
        ]);
    });
});