import React from 'react';
import { render } from '@testing-library/react';
import { createIdentity } from 'lib/test-utils/identity-factory';
import { MemoryRouter } from 'react-router-dom';
import IdentityContext from 'src/context';
import SitemapItems from '../../sitemap-items';
import SubHeader from '../subheader';

jest.mock('../../sitemap-items', () => ({
    __esModule: true,
    default: jest.fn(({ className, items }) => (
        <div
            data-testid="sitemap-items"
            data-classname={className}
            data-items={JSON.stringify(items)}
        />
    )),
}));

describe('<SubHeader>', () => {
    const identity = createIdentity({ id: 1 });

    const renderComponent = (props: React.ComponentProps<typeof SubHeader>) =>
        render(
            <IdentityContext.Provider
                value={{ identity, hasAuthentication: () => false }}
            >
                <MemoryRouter>
                    <SubHeader {...props} />
                </MemoryRouter>
            </IdentityContext.Provider>
        );

    test('passes items and className to SitemapItems', () => {
        const items = [{ url: 'hithere' }];
        renderComponent({ items });

        expect(SitemapItems).toHaveBeenCalledWith(
            expect.objectContaining({ className: 'SubHeader', items }),
            expect.anything()
        );
    });
});