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

describe('RatingModal', () => {
  const deck = { id: 'deck-1', title: 'Cool Deck' }

  it('renders nothing when deck is null', () => {
    render(RatingModal, { props: { deck: null } })
    expect(screen.queryByRole('dialog')).not.toBeInTheDocument()
  })

  it('renders title and star buttons when deck is set', () => {
    render(RatingModal, { props: { deck } })
    expect(screen.getByRole('dialog')).toBeInTheDocument()
    expect(screen.getByText(/Rate: Cool Deck/)).toBeInTheDocument()
    expect(screen.getByRole('button', { name: '1 star' })).toBeInTheDocument()
    expect(screen.getByRole('button', { name: '5 stars' })).toBeInTheDocument()
  })

  it('Submit is disabled when no stars selected', () => {
    render(RatingModal, { props: { deck } })
    expect(screen.getByRole('button', { name: 'Submit' })).toBeDisabled()
  })

  it('selecting stars enables Submit and calls onSubmit with rating and comment', async () => {
    const onSubmit = vi.fn()
    const onClose = vi.fn()
    render(RatingModal, {
      props: { deck, onSubmit, onClose },
    })
    await fireEvent.click(screen.getByRole('button', { name: '3 stars' }))
    expect(screen.getByRole('button', { name: 'Submit' })).not.toBeDisabled()
    const textarea = screen.getByPlaceholderText('Add a comment…')
    await fireEvent.input(textarea, { target: { value: ' Great deck!' } })
    await fireEvent.click(screen.getByRole('button', { name: 'Submit' }))
    expect(onSubmit).toHaveBeenCalledWith({ rating: 3, comment: 'Great deck!' })
    expect(onClose).toHaveBeenCalledTimes(1)
  })

  it('Cancel calls onClose', async () => {
    const onClose = vi.fn()
    render(RatingModal, { props: { deck, onClose } })
    await fireEvent.click(screen.getByRole('button', { name: 'Cancel' }))
    expect(onClose).toHaveBeenCalledTimes(1)
  })

  it('Escape key calls onClose', async () => {
    const onClose = vi.fn()
    render(RatingModal, { props: { deck, onClose } })
    const dialog = screen.getByRole('dialog')
    await fireEvent.keyDown(dialog, { key: 'Escape' })
    expect(onClose).toHaveBeenCalledTimes(1)
  })

  it('uses initialRating and initialComment when deck is set', () => {
    render(RatingModal, {
      props: {
        deck,
        initialRating: 4,
        initialComment: 'Already had a comment',
      },
    })
    expect(screen.getByRole('button', { name: 'Submit' })).not.toBeDisabled()
    expect(screen.getByDisplayValue('Already had a comment')).toBeInTheDocument()
  })

  it('submits with null comment when comment is empty or whitespace', async () => {
    const onSubmit = vi.fn()
    const onClose = vi.fn()
    render(RatingModal, { props: { deck, onSubmit, onClose } })
    await fireEvent.click(screen.getByRole('button', { name: '2 stars' }))
    await fireEvent.click(screen.getByRole('button', { name: 'Submit' }))
    expect(onSubmit).toHaveBeenCalledWith({ rating: 2, comment: null })
    expect(onClose).toHaveBeenCalledTimes(1)
  })
})
