import { describe, expect, it, vi } from 'vitest'
import { fireEvent, render, screen } from '@testing-library/react'

import Banner, { type BannerProps } from './Banner'

describe('Banner component', () => {
  const types: BannerProps['type'][] = ['informational', 'issue']

  types.forEach((type) => {
    it(`renders ${type} banner correctly with class name ${type}`, () => {
      const { container } = render(
        <Banner
          primaryText='Test primary text'
          secondaryText='Test secondary text'
          type={type}
        />,
      )
      expect(container.firstChild).toHaveClass(type)
      expect(screen.getByText('Test primary text')).toBeInTheDocument()
      expect(screen.getByText('Test secondary text')).toBeInTheDocument()
    })
  })

  it('renders button when buttonProps are provided', () => {
    const handleClick = vi.fn<() => void>()
    render(
      <Banner
        primaryText='Test primary text'
        secondaryText='Test secondary text'
        type='informational'
        buttonProps={{
          children: 'Test button',
          onClick: handleClick,
        }}
      />,
    )

    const button = screen.getByRole('button')
    expect(button).toBeInTheDocument()
    fireEvent.click(button)
    expect(handleClick).toHaveBeenCalledTimes(1)
  })

  it('render close button when closeButtonCallout is provided', () => {
    const closeButtonCallout = vi.fn<() => void>()
    const handleClick = vi.fn<() => void>()
    render(
      <Banner
        primaryText='Test primary text'
        secondaryText='Test secondary text'
        type='informational'
        buttonProps={{
          children: 'Test button',
          onClick: handleClick,
        }}
        closeButtonCallout={closeButtonCallout}
      />,
    )

    const closeButton = screen.getAllByRole('button')[1]
    expect(closeButton).toBeInTheDocument()
    fireEvent.click(closeButton)
    expect(closeButtonCallout).toHaveBeenCalledTimes(1)
  })

  it('renders info icon when hideInfoIcon is not provided', () => {
    const { rerender } = render(
      <Banner
        primaryText='Test primary text'
        secondaryText='Test secondary text'
        type='informational'
      />,
    )

    expect(screen.getByTestId('icon-info')).toBeInTheDocument()

    rerender(
      <Banner
        primaryText='Test primary text'
        secondaryText='Test secondary text'
        type='informational'
        hideInfoIcon
      />,
    )

    expect(screen.queryByTestId('icon-info')).toBeNull()
  })
})