import { describe, it, expect, vi } from 'vitest'
import { render, screen } from '@testing-library/react'
import { EmptyState } from '../EmptyState'
import { Button } from '@/components/ui/button'

describe('EmptyState', () => {
  it('should render with title and description', () => {
    render(
      <EmptyState
        title="No data found"
        description="There is no data to display"
      />
    )

    expect(screen.getByText('No data found')).toBeInTheDocument()
    expect(screen.getByText('There is no data to display')).toBeInTheDocument()
  })

  it('should render action button when provided', () => {
    const handleClick = vi.fn()
    render(
      <EmptyState
        title="No data"
        description="Add some data"
        action={{
          label: 'Add Item',
          onClick: handleClick,
        }}
      />
    )

    const button = screen.getByText('Add Item')
    expect(button).toBeInTheDocument()

    button.click()
    expect(handleClick).toHaveBeenCalledTimes(1)
  })

  it('should render secondary action when provided', () => {
    const handlePrimary = vi.fn()
    const handleSecondary = vi.fn()

    render(
      <EmptyState
        title="No data"
        description="Add some data"
        action={{
          label: 'Primary',
          onClick: handlePrimary,
        }}
        secondaryAction={{
          label: 'Secondary',
          onClick: handleSecondary,
        }}
      />
    )

    expect(screen.getByText('Primary')).toBeInTheDocument()
    expect(screen.getByText('Secondary')).toBeInTheDocument()
  })

  it('should render custom icon', () => {
    const CustomIcon = () => <div data-testid="custom-icon">Icon</div>

    render(
      <EmptyState
        title="No data"
        description="Description"
        icon={<CustomIcon />}
      />
    )

    expect(screen.getByTestId('custom-icon')).toBeInTheDocument()
  })
})

