import React from 'react';
import { fireEvent, screen } from '@testing-library/react';
import { renderInAppContext } from '@theorchard/suite-testing';
import { worksheetPaymentContractAdvanceResponse } from 'src/__fixtures__/graphql/worksheet-payment-contract-advance-response';
import * as contractAdvanceMutations from 'src/apollo/mutations/contract-advance';
import FinanceAdmin, { FinanceAdminProps } from '../finance-admin';
import {
    CONFIRM_FUNDS_CHECKBOX_LABEL,
    CONFIRM_WARNING_ALERT_MSG,
    REVIEW_SALESFORCE_ID_CHECKBOX_LABEL,
} from 'src/components/advance-detail/constants';

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

    const props = {
        isDisabled: false,
        isFeatureAbacusCreateAndApprovePaymentsEnabled: true,
        fundsConfirmed:
            worksheetPaymentContractAdvanceResponse
                .worksheetPaymentContractAdvance.actionStates[3],
        salesforceIdConfirmed:
            worksheetPaymentContractAdvanceResponse
                .worksheetPaymentContractAdvance.actionStates[2],
        worksheetPaymentContractAdvanceId: '1',
    };

    const approveContractAdvanceSalesforceId = jest.fn().mockResolvedValue({});
    const confirmFundsForContractAdvance = jest.fn().mockResolvedValue({});

    afterEach(jest.restoreAllMocks);
    beforeEach(() => {
        jest.spyOn(
            contractAdvanceMutations,
            'useApproveWorksheetPaymentContractAdvanceSalesforceId'
        ).mockReturnValue({
            approveContractAdvanceSalesforceId,
            loading: false,
        });

        jest.spyOn(
            contractAdvanceMutations,
            'useConfirmFundsForWorksheetPaymentContractAdvance'
        ).mockReturnValue({ confirmFundsForContractAdvance, loading: false });
    });

    it('renders a FinanceAdmin', async () => {
        const { container } = render({
            ...props,
            fundsConfirmed: undefined,
            salesforceIdConfirmed: undefined,
        });

        expect(screen.getByText('For Finance Admin')).toBeDefined();
        expect(screen.getByText('Review Salesforce ID')).toBeDefined();
        expect(
            screen.getByText(REVIEW_SALESFORCE_ID_CHECKBOX_LABEL)
        ).toBeDefined();
        expect(screen.getByText('Confirm Funds')).toBeDefined();
        expect(screen.getByText(CONFIRM_WARNING_ALERT_MSG)).toBeDefined();
        expect(screen.getByText(CONFIRM_FUNDS_CHECKBOX_LABEL)).toBeDefined();

        const salesforceIdConfirmedCheckbox = container.querySelectorAll(
            "input[name='salesforceIdConfirmed']"
        )[0] as HTMLInputElement;
        expect(salesforceIdConfirmedCheckbox.checked).toBe(false);
        expect(salesforceIdConfirmedCheckbox).not.toHaveAttribute('disabled');

        const fundsConfirmedCheckbox = container.querySelectorAll(
            "input[name='fundsConfirmed']"
        )[0] as HTMLInputElement;
        expect(fundsConfirmedCheckbox.checked).toBe(false);
    });
    it('confirms Salesforce ID', async () => {
        const { container } = render({
            ...props,
            fundsConfirmed: undefined,
            salesforceIdConfirmed: undefined,
        });

        const salesforceIdConfirmedCheckbox = container.querySelectorAll(
            "input[name='salesforceIdConfirmed']"
        )[0] as HTMLInputElement;
        expect(salesforceIdConfirmedCheckbox.checked).toBe(false);

        fireEvent.click(salesforceIdConfirmedCheckbox);
        expect(
            screen.getByText('Are you sure you want to confirm Salesforce ID?')
        ).toBeDefined();
        expect(screen.getByText('This action cannot be undone!')).toBeDefined();
        expect(
            screen.getByText(
                'Upon confirming Salesforce ID, no other changes can be made to the payment approval.'
            )
        ).toBeDefined();
        expect(screen.getByText('No, cancel')).toBeDefined();
        const confirmBtn = screen.getByRole('button', {
            name: /Yes, confirm/i,
        });
        fireEvent.click(confirmBtn);
        expect(approveContractAdvanceSalesforceId).toHaveBeenCalled();
    });

    it('confirms Funds', async () => {
        const { container } = render({
            ...props,
            fundsConfirmed: undefined,
            salesforceIdConfirmed: undefined,
        });

        const fundsConfirmedCheckbox = container.querySelectorAll(
            "input[name='fundsConfirmed']"
        )[0] as HTMLInputElement;
        false;

        fireEvent.click(fundsConfirmedCheckbox);
        expect(
            screen.getByText('Are you sure you want to confirm Funds?')
        ).toBeDefined();
        expect(screen.getByText('No, cancel')).toBeDefined();
        const confirmBtn = screen.getByRole('button', {
            name: /Yes, confirm/i,
        });
        fireEvent.click(confirmBtn);
        expect(confirmFundsForContractAdvance).toHaveBeenCalled();
    });

    it('checkboxes checked', async () => {
        const { container } = render({
            ...props,
            salesforceIdConfirmed: {
                abacusStateId: '321',
                actionName: 'salesforce_id_confirmed',
                actionStatus: 'complete',
                lastModified: '2024-04-14T22:43:35.000000',
                lastModifiedByIdentity: {
                    name: 'Salesforce confirmed By Identity Name',
                },
                message: null,
            },
            fundsConfirmed: {
                abacusStateId: '4324',
                actionName: 'funds_confirmed',
                actionStatus: 'complete',
                lastModified: '2024-04-15T19:43:35.000000',
                lastModifiedByIdentity: {
                    name: 'Funds Confirmed By Identity Name',
                },
                message: null,
            },
        });

        const salesforceIdConfirmedCheckbox = container.querySelectorAll(
            "input[name='salesforceIdConfirmed']"
        )[0] as HTMLInputElement;
        expect(salesforceIdConfirmedCheckbox.checked).toBe(true);

        const fundsConfirmedCheckbox = container.querySelectorAll(
            "input[name='fundsConfirmed']"
        )[0] as HTMLInputElement;
        expect(fundsConfirmedCheckbox.checked).toBe(true);

        expect(screen.getByText('2024-04-14')).toBeDefined();
        expect(screen.getByText('2024-04-15')).toBeDefined();
        expect(
            screen.getByText('Salesforce confirmed By Identity Name')
        ).toBeDefined();
        expect(
            screen.getByText('Funds Confirmed By Identity Name')
        ).toBeDefined();
    });

    it('enables confirm Funds checkbox if FF is enabled', async () => {
        const { container } = render({
            ...props,
            fundsConfirmed: undefined,
        });

        const fundsConfirmedCheckbox = container.querySelectorAll(
            "input[name='fundsConfirmed']"
        )[0] as HTMLInputElement;
        false;

        expect(fundsConfirmedCheckbox).not.toHaveAttribute('disabled');
    });

    it('disables all checkboxes if FF is disabled', () => {
        render({
            ...props,
            isFeatureAbacusCreateAndApprovePaymentsEnabled: false,
            isFundsConfirmed: false,
            fundsConfirmed: undefined,
            salesforceIdConfirmed: undefined,
            isSalesforceIdConfirmed: false,
        });

        const checkboxes = screen.getAllByRole('checkbox');
        expect(checkboxes[0]).toHaveAttribute('disabled');
        expect(checkboxes[1]).toHaveAttribute('disabled');
    });
});