import { render, screen, within } from '@testing-library/react'
import { describe, expect, it, vi, beforeEach } from 'vitest'
import { CardList } from './card-list'

vi.mock('@/lib/api-client', () => {
  class ApiClientErrorMock extends Error {
    status: number
    constructor(status: number, name: string, message: string) {
      super(message)
      this.name = name
      this.status = status
    }
  }
  return {
    ApiClientError: ApiClientErrorMock,
    cardsApi: {
      list: vi.fn(),
    },
  }
})

import { cardsApi, ApiClientError } from '@/lib/api-client'

const CARDS = [
  { id: '1', question: 'Cest quoi un commit ?', response: 'Un snapshot du projet', theme: 'git', tags: [], createdAt: new Date().toISOString(), updatedAt: new Date().toISOString() },
  { id: '2', question: 'Cest quoi une closure ?', response: 'Une fonction + son scope', theme: 'javascript', tags: [], createdAt: new Date().toISOString(), updatedAt: new Date().toISOString() },
]

beforeEach(() => {
  vi.mocked(cardsApi.list).mockReset()
})

it('affiche le nom de chaque carte', async () => {
  vi.mocked(cardsApi.list).mockResolvedValue(CARDS)
  render(<CardList />)
  const question = await screen.findByText('Cest quoi un commit ?')
  expect(question).toBeInTheDocument()
  expect(screen.getByText('Cest quoi une closure ?')).toBeInTheDocument()
})

it('affiche un lien vers le détail de chaque carte', async () => {
  vi.mocked(cardsApi.list).mockResolvedValue(CARDS)
  render(<CardList />)
  const link = await screen.findByRole('link', { name: /Cest quoi un commit \?/ })
  expect(link).toHaveAttribute('href', '/cards/1')
})

it("affiche le thème de chaque carte", async () => {
  vi.mocked(cardsApi.list).mockResolvedValue(CARDS)
  render(<CardList />)
  const item = (await screen.findByText('Cest quoi un commit ?')).closest('li')
  expect(within(item as HTMLElement).getByText('git')).toBeInTheDocument()
})

it('affiche un message si aucune carte', async () => {
  vi.mocked(cardsApi.list).mockResolvedValue([])
  render(<CardList />)
  expect(await screen.findByRole('status')).toHaveTextContent('Aucune carte')
})

it('affiche un message derreur si le chargement échoue', async () => {
  vi.mocked(cardsApi.list).mockRejectedValue(new ApiClientError(500, 'InternalServerError', 'Boom'))
  render(<CardList />)
  expect(await screen.findByRole('alert')).toHaveTextContent('Boom')
})