import { test, expect } from "@playwright/test";

test.describe("Sidebar navigation", () => {
  test.beforeEach(async ({ page }) => {
    await page.goto("/dashboard");
    await page.waitForSelector(".sidebar", { timeout: 15_000 });
  });

  test("sidebar links route to correct pages", async ({ page }) => {
    const navTests = [
      { label: "Providers", url: /\/providers/ },
      { label: "Developer", url: /\/developer\/agents/ },
      { label: "Organization", url: /\/organization\/pricing/ },
      { label: "Dashboard", url: /\/dashboard/ },
    ];

    for (const { label, url } of navTests) {
      await page.locator(".sidebar-link", { hasText: label }).click();
      await expect(page).toHaveURL(url, { timeout: 10_000 });
    }
  });

  test("browser back/forward navigation works", async ({ page }) => {
    // Navigate to Providers
    await page.locator(".sidebar-link", { hasText: "Providers" }).click();
    await expect(page).toHaveURL(/\/providers/);

    // Navigate to Developer
    await page.locator(".sidebar-link", { hasText: "Developer" }).click();
    await expect(page).toHaveURL(/\/developer/);

    // Go back
    await page.goBack();
    await expect(page).toHaveURL(/\/providers/);

    // Go forward
    await page.goForward();
    await expect(page).toHaveURL(/\/developer/);
  });

  test("logo link navigates to dashboard", async ({ page }) => {
    // Navigate away first
    await page.locator(".sidebar-link", { hasText: "Providers" }).click();
    await expect(page).toHaveURL(/\/providers/);

    // Click the logo/brand in sidebar header
    const logo = page.locator(".sidebar-brand, .sidebar-logo, .sidebar a").first();
    await logo.click();

    await expect(page).toHaveURL(/\/dashboard/);
  });
});