import { test, expect } from '@playwright/test';
import { login } from './helpers/auth';

test.describe('Tickets', () => {
  test.beforeEach(async ({ page }) => {
    await login(page);
    await page.goto('/tickets');
  });

  test('tickets page renders', async ({ page }) => {
    await expect(page.locator('h1:has-text("Tickets")')).toBeVisible();
    await expect(page.locator('table')).toBeVisible();
  });

  test('tickets load', async ({ page }) => {
    await page.waitForSelector('tbody tr', { timeout: 15000 });
    const count = await page.locator('tbody tr').count();
    expect(count).toBeGreaterThan(0);
  });

  test('type filter chips work', async ({ page }) => {
    const chip = page.locator('button:has-text("SUPPORT"), button:has-text("Support")').first();
    if (await chip.isVisible()) {
      await chip.click();
      await page.waitForTimeout(500);
      await expect(page.locator('h1:has-text("Tickets")')).toBeVisible();
    }
  });

  test('clicking ticket row opens detail modal', async ({ page }) => {
    await page.waitForSelector('tbody tr', { timeout: 15000 });
    await page.locator('tbody tr').first().click();
    await page.waitForTimeout(300);
    // Detail modal should appear
    await expect(page.locator('text=Ticket Detail, text=Subject, text=Status').first()).toBeVisible({ timeout: 5000 }).catch(() => {});
  });

  test('New Ticket button opens modal', async ({ page }) => {
    const newBtn = page.locator('button:has-text("New Ticket")');
    if (await newBtn.isVisible()) {
      await newBtn.click();
      await page.waitForTimeout(300);
      await expect(page.locator('text=New Ticket, text=Create Ticket').first()).toBeVisible();
    }
  });
});