import React from 'react'
import { render, screen } from '@testing-library/react'
import '@testing-library/jest-dom'
import BoardGames from '../services/board-games/page'
import Coworking from '../services/coworking/page'
import Birthdays from '../services/birthdays/page'
import Companies from '../services/companies/page'

// Mock ReserveForm component
jest.mock('@/components/ui/Reserve', () => ({
  __esModule: true,
  default: () => <div data-testid="reserve-form">Reserve Form</div>
}))

// Mock FAQ component
jest.mock('@/components/ui/FAQ', () => ({
  __esModule: true,
  default: ({ questions }: { questions: Array<{ question: string }> }) => (
    <div data-testid="faq-section">
      {questions.map((q, i) => (
        <div key={i} data-testid="faq-question">{q.question}</div>
      ))}
    </div>
  )
}))

describe('Service Pages', () => {
  describe('Board Games Page', () => {
    it('renders the page title', async () => {
      render(await BoardGames())
      expect(screen.getByText('Резервация за настолни игри')).toBeInTheDocument()
    })

    it('renders the reservation form', async () => {
      render(await BoardGames())
      expect(screen.getByTestId('reserve-form')).toBeInTheDocument()
    })

    it('renders FAQ section with questions', async () => {
      render(await BoardGames())
      const questions = screen.getAllByTestId('faq-question')
      expect(questions).toHaveLength(7) // Board games page has 7 FAQ items
    })
  })

  describe('Coworking Page', () => {
    it('renders the page title', async () => {
      render(await Coworking())
      expect(screen.getByText(/коуъркинг/i)).toBeInTheDocument()
    })

    it('renders the reservation form', async () => {
      render(await Coworking())
      expect(screen.getByTestId('reserve-form')).toBeInTheDocument()
    })
  })

  describe('Birthdays Page', () => {
    it('renders the page title', async () => {
      render(await Birthdays())
      expect(screen.getByText(/рожден ден/i)).toBeInTheDocument()
    })

    it('renders the reservation form', async () => {
      render(await Birthdays())
      expect(screen.getByTestId('reserve-form')).toBeInTheDocument()
    })

    it('renders FAQ section', async () => {
      render(await Birthdays())
      expect(screen.getByTestId('faq-section')).toBeInTheDocument()
    })
  })

  describe('Companies Page', () => {
    it('renders the page title', async () => {
      render(await Companies())
      expect(screen.getByRole('heading', { name: /фирмени събития/i })).toBeInTheDocument()
    })

    it('renders the reservation form', async () => {
      render(await Companies())
      expect(screen.getByTestId('reserve-form')).toBeInTheDocument()
    })

    it('renders FAQ section', async () => {
      render(await Companies())
      expect(screen.getByTestId('faq-section')).toBeInTheDocument()
    })
  })
})