import React from 'react'
import { render, screen, fireEvent } from '@testing-library/react'
import { QueryInput } from '../../components/QueryInput'

describe('QueryInput', () => {
  const mockOnSubmit = vi.fn()

  beforeEach(() => {
    mockOnSubmit.mockClear()
  })

  it('renders textarea with placeholder text', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    expect(textarea).toBeInTheDocument()
  })

  it('renders submit button', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const button = screen.getByRole('button', { name: /submit/i })
    expect(button).toBeInTheDocument()
  })

  it('button is disabled when textarea is empty', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const button = screen.getByRole('button', { name: /submit/i })
    expect(button).toBeDisabled()
  })

  it('button is disabled when textarea contains only whitespace', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    const button = screen.getByRole('button', { name: /submit/i })

    fireEvent.change(textarea, { target: { value: '   ' } })

    expect(button).toBeDisabled()
  })

  it('button is disabled when isLoading is true', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={true} />)
    const button = screen.getByRole('button', { name: /loading/i })
    expect(button).toBeDisabled()
  })

  it('textarea is disabled when isLoading is true', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={true} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    expect(textarea).toBeDisabled()
  })

  it('button is disabled when isLoading is true even with text', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={true} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    const button = screen.getByRole('button', { name: /loading/i })

    fireEvent.change(textarea, { target: { value: 'Some question' } })

    expect(button).toBeDisabled()
  })

  it('calls onSubmit with trimmed text when button is clicked', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    const button = screen.getByRole('button', { name: /submit/i })

    fireEvent.change(textarea, { target: { value: '  Test question  ' } })
    fireEvent.click(button)

    expect(mockOnSubmit).toHaveBeenCalledTimes(1)
    expect(mockOnSubmit).toHaveBeenCalledWith('Test question')
  })

  it('clears textarea after submit', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')
    const button = screen.getByRole('button', { name: /submit/i })

    fireEvent.change(textarea, { target: { value: 'Test question' } })
    fireEvent.click(button)

    expect(textarea).toHaveValue('')
  })

  it('calls onSubmit when pressing Enter without Shift', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')

    fireEvent.change(textarea, { target: { value: 'Test question' } })
    fireEvent.keyDown(textarea, { key: 'Enter', shiftKey: false })

    expect(mockOnSubmit).toHaveBeenCalledTimes(1)
    expect(mockOnSubmit).toHaveBeenCalledWith('Test question')
  })

  it('does not call onSubmit when pressing Enter with Shift', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')

    fireEvent.change(textarea, { target: { value: 'Test question' } })
    fireEvent.keyDown(textarea, { key: 'Enter', shiftKey: true })

    expect(mockOnSubmit).not.toHaveBeenCalled()
  })

  it('does not submit when textarea is empty and Enter is pressed', () => {
    render(<QueryInput onSubmit={mockOnSubmit} isLoading={false} />)
    const textarea = screen.getByPlaceholderText('Ask a question about your documents...')

    fireEvent.keyDown(textarea, { key: 'Enter', shiftKey: false })

    expect(mockOnSubmit).not.toHaveBeenCalled()
  })
})