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

test.describe('Alerts (Phase B)', () => {
  test.beforeEach(async ({ page }) => {
    await login(page, 'super_admin');
  });

  test('alert bell renders in topbar with no badge when no alerts', async ({ page }) => {
    await navigateTo(page, '/');
    const bell = page.getByTestId('alert-bell');
    await expect(bell).toBeVisible({ timeout: 15_000 });
  });

  test('alert bell popover opens', async ({ page }) => {
    await navigateTo(page, '/');
    const bell = page.getByTestId('alert-bell');
    await expect(bell).toBeVisible({ timeout: 15_000 });
    await bell.click();

    // Popover header is the unambiguous proof that the popover rendered.
    await expect(page.getByText('Active alerts').first()).toBeVisible({ timeout: 8_000 });
  });

  test('dashboard renders the alert rail', async ({ page }) => {
    await navigateTo(page, '/');
    await expect(page.getByText('Pipeline Funnel').first()).toBeVisible({ timeout: 15_000 });
    await expect(page.getByTestId('alert-rail')).toBeVisible({ timeout: 5_000 });
  });

  test('/alerts page loads with three tabs', async ({ page }) => {
    await navigateTo(page, '/alerts');
    expect(page.url()).toContain(`/${PORT_SLUG}/alerts`);
    await expect(page.getByTestId('tab-open')).toBeVisible({ timeout: 10_000 });
    await expect(page.getByTestId('tab-dismissed')).toBeVisible();
    await expect(page.getByTestId('tab-resolved')).toBeVisible();

    await page.getByTestId('tab-resolved').click();
    // No assertion on contents; just smoke that the tab swap doesn't error.
    await expect(page.getByTestId('tab-resolved')).toHaveAttribute('data-state', 'active');
  });

  test('sidebar Alerts link navigates to /alerts', async ({ page }) => {
    await navigateTo(page, '/');
    await page.getByRole('link', { name: 'Alerts', exact: true }).click();
    await expect(page).toHaveURL(new RegExp(`/${PORT_SLUG}/alerts`), { timeout: 10_000 });
  });
});