import React from 'react';
import { renderInAppContext } from '@theorchard/suite-testing';
import { getMergedProduct, getProductMetadata } from 'lib/mockProductData';
import ProductModalBody, { CLASS_NAME, Props } from '../productModalBody';

describe('<ProductModalBody>', () => {
    const productData = {
        productId: 33,
        productName: 'some name',
    };
    const defaultProps: Props = {
        product: getProductMetadata(productData),
        mergedProduct: getMergedProduct(productData),
        isMergedProductFullyLoaded: true,
        reviewQueueId: 1,
    };

    const renderComponent = (partialProps: Partial<Props> = {}) => {
        const props: Props = { ...defaultProps, ...partialProps };

        return renderInAppContext(<ProductModalBody {...props} />);
    };

    test('renders with no errors', () => {
        const { getByTestId } = renderComponent();

        expect(getByTestId(CLASS_NAME)).toBeVisible();
        expect(getByTestId('ContributorsBlock')).toBeVisible();
    });

    describe('LocalizationsBlock', () => {
        afterEach(() => {
            jest.clearAllMocks();
        });

        test('renders LocalizationsBlock', () => {
            const { getByTestId } = renderComponent({
                mergedProduct: getMergedProduct({
                    ...productData,
                    productLocalizations: [
                        {
                            productName: 'Localized Product Name',
                            deliveredVersion: 'Localized Version',
                            iTunesLanguage: {
                                id: 2,
                                name: 'Spanish',
                            },
                        },
                    ],
                }),
            });

            expect(getByTestId('LocalizationsBlock')).toBeVisible();
        });
    });
});
