import React from 'react';
import { renderInAppContext } from '@theorchard/suite-testing';
import Overlay, { CLASSNAME, Props } from '../overlay';

describe('<Overlay>', () => {
    const data = {
        lastModified: '2022-03-01T13:25:46.000Z',
        originalFilename: 'Doctor-Who.csv',
        id: '8060aa56-5838-4791-b558-d12ca5c5e095.csv',
        identity: { id: 'some-id', firstName: 'Allan', lastName: 'Moon' },
        ingestionCompleted: true,
        errorFileUrl:
            'https://qa-nr/ingestion/8060aa56-5838-4791-b558-d12ca5c5e095/error.csv',
        instancesCreatedUpdated: 1,
        totalRows: 13,
        failedIsrcCount: 1,
    };
    const dataWithoutErrors = {
        lastModified: '2022-03-03T09:40:14.000Z',
        originalFilename: 'killjoys.csv',
        id: 'ddb77517-0012-4ebe-b5eb-bf03e461d3ab.csv',
        identity: { id: 'some-id', firstName: 'Allan', lastName: 'Moon' },
        ingestionCompleted: true,
        errorFileUrl: '',
        instancesCreatedUpdated: 1,
        totalRows: 13,
        failedIsrcCount: 1,
    };

    const renderWrapper = (props?: Partial<Props>) =>
        renderInAppContext(<Overlay data={data} {...props} />);

    const getButton = (props?: Partial<Props>) => {
        const result = renderWrapper(props);
        const button = result.container
            .getElementsByClassName(`${CLASSNAME}-button`)
            .item(0);

        return {
            button,
            result,
        };
    };

    test('renders button', () => {
        const { button } = getButton();

        expect(button).toBeVisible();
    });

    test('renders button if errors empty', () => {
        const { button } = getButton({ data: dataWithoutErrors });

        expect(button).toBeNull();
    });

    // TODO add tests for triggering overlay. In tests button does not toggles overlay.
});