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

jest.mock('next-intl', () => ({
  useTranslations: () => (key: string) => key,
}));
jest.mock('@/components/Articles/ArticleCard', () => ({
  __esModule: true,
  default: ({article, locale}: {article: {title: string}; locale: string}) => (
    <div data-testid="article-card" data-locale={locale}>{article.title}</div>
  ),
}));

import ArticlesLiesSection from '../ArticlesLiesSection';

const articles = [
  {id: 1, title: 'Les sonneurs de couple', slug: 'sonneurs-de-couple', body: '', createdAt: '2026-09-01T10:00:00+02:00', updatedAt: null},
  {id: 2, title: 'Le fest-noz de rentrée', slug: 'fest-noz-de-rentree', body: '', createdAt: '2026-09-10T10:00:00+02:00', updatedAt: null},
];

describe('ArticlesLiesSection', () => {
  it('shouldListTheLinkedArticlesAsCards', () => {
    render(<ArticlesLiesSection articles={articles} locale="bzh" />);

    expect(screen.getByTestId('articles-lies-section')).toHaveTextContent('articles_lies_title');
    const cards = screen.getAllByTestId('article-card');
    expect(cards.map(c => c.textContent)).toEqual(['Les sonneurs de couple', 'Le fest-noz de rentrée']);
    expect(cards[0]).toHaveAttribute('data-locale', 'bzh');
  });

  it('shouldRenderNothingWithoutArticles', () => {
    const {container} = render(<ArticlesLiesSection articles={[]} locale="fr" />);

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