import { test, expect } from '@playwright/test'

test.describe('Events list page', () => {
  test('events list loads', async ({ page }) => {
    await page.goto('/events')
    await expect(page.locator('h1', { hasText: 'Events' })).toBeVisible()
  })

  test('filter bar has type filters', async ({ page }) => {
    await page.goto('/events')
    const filterBar = page.locator('.filter-bar')
    await expect(filterBar).toBeVisible()

    for (const label of ['All', 'Workshops', 'Community', 'Social', 'Showcase']) {
      await expect(filterBar.locator('button', { hasText: label })).toBeVisible()
    }
  })

  test('past events toggle exists and can be checked', async ({ page }) => {
    await page.goto('/events')
    const checkbox = page.locator('input[type="checkbox"]')
    await expect(checkbox).toBeVisible()
    await expect(page.locator('text=Show past events')).toBeVisible()

    await checkbox.check()
    await expect(checkbox).toBeChecked()

    // Page should still render without errors after toggling
    await expect(page.locator('h1', { hasText: 'Events' })).toBeVisible()
  })

  test('clicking a filter button activates it', async ({ page }) => {
    await page.goto('/events')
    const workshopsBtn = page.locator('.filter-bar button', { hasText: 'Workshops' })
    await workshopsBtn.click()
    await expect(workshopsBtn).toHaveClass(/active/)
  })

  test('event links navigate to detail page', async ({ page }) => {
    await page.goto('/events')

    // Check the past events toggle so we see all events
    await page.locator('input[type="checkbox"]').check()

    const eventLinks = page.locator('.event-row a')
    const count = await eventLinks.count()

    if (count === 0) {
      // No events in the database — just verify the empty state renders
      await expect(page.locator('.empty', { hasText: 'No events found' })).toBeVisible()
      return
    }

    // Click the first event link and verify navigation
    const firstLink = eventLinks.first()
    const href = await firstLink.getAttribute('href')
    await firstLink.click()
    await page.waitForURL(/\/events\//)

    expect(page.url()).toContain('/events/')
    // Detail page should have an h1 with the event title
    await expect(page.locator('h1')).toBeVisible()
  })
})