import React from 'react';
import {render, screen} from '@testing-library/react';

jest.mock('next-intl', () => ({
  useTranslations: () => (key: string) => key,
}));
jest.mock('next/link', () => ({
  __esModule: true,
  default: ({children, href}: {children: React.ReactNode; href: string}) => <a href={href}>{children}</a>,
}));

import UniversSection from '../UniversSection';

const listes = [
  {lieId: 11, lieNom: 'Sonneurs de couple', lieDpr: {dprId: 1, dprNom: 'Musique traditionnelle'}},
  {lieId: 12, lieNom: 'Bagadoù', lieDpr: {dprId: 1, dprNom: 'Musique traditionnelle'}},
  {lieId: 30, lieNom: 'Cercles celtiques', lieDpr: {dprId: 2, dprNom: 'Danse'}},
];

describe('UniversSection', () => {
  it('shouldGroupTheListsUnderTheirDomaine', () => {
    render(<UniversSection listes={listes} locale="fr" />);

    expect(screen.getByTestId('univers-section')).toHaveTextContent('univers_title');
    const domaines = screen.getAllByRole('heading', {level: 3}).map(h => h.textContent);
    expect(domaines).toEqual(['Musique traditionnelle', 'Danse']);
    expect(screen.getByRole('link', {name: 'Bagadoù'})).toHaveAttribute('href', '/fr/listes/12');
    expect(screen.getByRole('link', {name: 'Cercles celtiques'})).toHaveAttribute('href', '/fr/listes/30');
  });

  it('shouldRenderNothingWithoutLists', () => {
    const {container} = render(<UniversSection listes={[]} locale="fr" />);

    expect(container).toBeEmptyDOMElement();
  });

  it('shouldGroupListsWithoutDomaineUnderNoHeading', () => {
    render(<UniversSection listes={[{lieId: 40, lieNom: 'Luthiers'}]} locale="fr" />);

    expect(screen.queryByRole('heading', {level: 3})).not.toBeInTheDocument();
    expect(screen.getByRole('link', {name: 'Luthiers'})).toHaveAttribute('href', '/fr/listes/40');
  });
});
