import React from 'react';
import { fireEvent, screen } from '@testing-library/react';
import { renderInAppContext } from '@theorchard/suite-testing';
import * as getBulkTemplate from 'src/data/queries/getBulkTemplate';
import * as features from 'src/utils/features';
import Step1Upload from '..';

describe('<Step1Upload />', () => {
    beforeEach(() => {
        jest.spyOn(getBulkTemplate, 'useGetBulkTemplateQuery').mockReturnValue(
            jest.fn().mockResolvedValue('test.com')
        );

        jest.spyOn(
            features,
            'useCcmSpotifyBulkTemplatePopulation'
        ).mockReturnValue(true);
    });

    afterEach(() => {
        jest.resetAllMocks();
    });

    describe('metadata upload', () => {
        test('matches snapshot', () => {
            const component = renderInAppContext(
                <Step1Upload
                    templateDownloadLink={'https://www.example.com'}
                    classicalTemplateDownloadLink={
                        'https://www.classical-example.com'
                    }
                />
            );
            expect(component).toMatchSnapshot();
        });
    });

    test('sidecar opens when "click here" text is clicked', () => {
        renderInAppContext(
            <Step1Upload
                templateDownloadLink={'https://www.example.com'}
                classicalTemplateDownloadLink={
                    'https://www.classical-example.com'
                }
            />
        );

        const clickHereLink = screen.getByText('Click here.');
        fireEvent.click(clickHereLink);

        expect(
            screen.getByText(
                $t('bulkDigitalAudio.spotifyPopulatorSidecar.title')
            )
        ).toBeVisible();
    });
});