import { describe, test, expect, vi } from 'vitest'
import { render, screen, fireEvent } from '@testing-library/react'
import { ChatActionsContainer } from './chat-actions-container'
import { ChatRatingAction } from './chat-rating-action'

describe('ChatActionsContainer', () => {
  test('renders children', () => {
    render(
      <ChatActionsContainer>
        <span>child content</span>
      </ChatActionsContainer>,
    )
    expect(screen.getByText('child content')).toBeTruthy()
  })
})

describe('ChatRatingAction', () => {
  test('renders thumb up and thumb down buttons', () => {
    render(<ChatRatingAction />)
    expect(screen.getByLabelText('Thumbs up')).toBeTruthy()
    expect(screen.getByLabelText('Thumbs down')).toBeTruthy()
  })

  test('calls onRatingChange with up when thumbs up clicked', () => {
    const onRatingChange = vi.fn()
    render(<ChatRatingAction onRatingChange={onRatingChange} />)
    fireEvent.click(screen.getByLabelText('Thumbs up'))
    expect(onRatingChange).toHaveBeenCalledWith('up')
  })

  test('calls onRatingChange with null when active thumb up clicked', () => {
    const onRatingChange = vi.fn()
    render(<ChatRatingAction onRatingChange={onRatingChange} rating='up' />)
    fireEvent.click(screen.getByLabelText('Thumbs up'))
    expect(onRatingChange).toHaveBeenCalledWith(null)
  })

  test('calls onRatingChange with down when thumbs down clicked', () => {
    const onRatingChange = vi.fn()
    render(<ChatRatingAction onRatingChange={onRatingChange} />)
    fireEvent.click(screen.getByLabelText('Thumbs down'))
    expect(onRatingChange).toHaveBeenCalledWith('down')
  })

  test('highlights active rating up', () => {
    const { container } = render(<ChatRatingAction rating='up' />)
    expect(container.querySelector('[data-testid="ThumbUpIcon"]')).toBeTruthy()
  })

  test('highlights active rating down', () => {
    const { container } = render(<ChatRatingAction rating='down' />)
    expect(
      container.querySelector('[data-testid="ThumbDownIcon"]'),
    ).toBeTruthy()
  })

  test('renders with custom labels', () => {
    render(
      <ChatRatingAction labels={{ thumbUp: 'Like', thumbDown: 'Dislike' }} />,
    )
    expect(screen.getByLabelText('Like')).toBeTruthy()
    expect(screen.getByLabelText('Dislike')).toBeTruthy()
  })
})