import React from 'react';
import { screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { renderInAppContext } from '@theorchard/suite-testing';
import { contractDetails as contract } from 'src/__fixtures__/graphql/contract-details';
import * as contractMutations from 'src/apollo/mutations/contract';
import { updateContractMessage } from 'src/apollo/type-constants/contract';
import {
    ContractReactivateModal,
    ContractReactivateModalPropsTypes,
} from 'src/components/contract-detail/contract-reactivate-modal';

describe('<ContractReactivateModal />', () => {
    const render = (props: ContractReactivateModalPropsTypes) =>
        renderInAppContext(<ContractReactivateModal {...props} />);

    const reactivateContract = jest.fn().mockResolvedValue({
        data: { abacusContract: contract.abacusContract },
        loading: false,
    });
    beforeEach(() =>
        jest
            .spyOn(contractMutations, 'useReactivateContract')
            .mockReturnValue(reactivateContract)
    );
    afterEach(jest.restoreAllMocks);

    const props: ContractReactivateModalPropsTypes = {
        contractName: 'Test contract',
        isContractReactivateModalOpen: true,
        onRequestCloseReactivateModal: jest.fn(),
        onReactivateOpenContractRenewalSidecar: jest.fn(),
    };

    it('renders contract reactivate modal', () => {
        render(props);

        expect(screen.getByTestId('ContractReactivateModal')).toBeDefined();
    });

    it('renders modal content', () => {
        render(props);

        expect(
            screen.getByText(
                'You can reactivate this contract, which is either terminated or ' +
                    'set to be terminated. You will need to edit the renewal ' +
                    'rules in order to reactivate.'
            )
        ).toBeDefined();
    });

    it(`renders a success toast popup on reactivating contract successfully and open
       a contract renewal form`, async () => {
        render(props);

        const contractReactivateButton = screen.getByRole('button', {
            name: 'Reactivate',
        });
        await userEvent.setup().click(contractReactivateButton);

        const toast = await screen.findByTestId('Toast-0');
        expect(toast).toBeDefined();
        expect(toast).toHaveTextContent(updateContractMessage('Test contract'));
        expect(props.onReactivateOpenContractRenewalSidecar).toHaveBeenCalled();
    });

    it('closes modal when isContractReactivateModalOpen is false', () => {
        render({ ...props, isContractReactivateModalOpen: false });
        expect(screen.queryByTestId('ContractReactivate')).toBeNull();
    });
});