import { test, expect } from "@playwright/test";
import { authenticateViaApply, completeFullWizard, uniqueTestPhone, loginAfterWizard } from "../helpers/wizard";

async function loginToDashboard(page: import("@playwright/test").Page) {
  const phone = uniqueTestPhone();
  await completeFullWizard(page, phone);
  await loginAfterWizard(page, phone);
}

test.describe("Theme and Language Settings", () => {
  test("dark mode toggle persists on reload", async ({ page }) => {
    await loginToDashboard(page);

    // Open settings (aria-label is localized)
    const settingsButton = page.getByRole("button", { name: /Settings|Sozlamalar|Настройки/i });
    await settingsButton.click();

    // Click dark mode
    const darkButton = page.getByRole("button", { name: /Dark|Qorong'u|Тёмная/i, pressed: false });
    if (await darkButton.isVisible()) {
      await darkButton.click();
      await expect(page.locator("html")).toHaveClass(/dark/);

      // Reload and verify persistence
      await page.reload();
      await page.waitForLoadState("domcontentloaded");
      await expect(page.locator("html")).toHaveClass(/dark/);

      // Switch back to light
      const settingsBtn2 = page.getByRole("button", { name: /Settings|Sozlamalar|Настройки/i });
      await settingsBtn2.click();
      const lightButton = page.getByRole("button", { name: /Light|Yorug'|Светлая/i, pressed: false });
      if (await lightButton.isVisible()) {
        await lightButton.click();
        await expect(page.locator("html")).not.toHaveClass(/dark/);
      }
    }
  });

  test("language switch updates nav labels", async ({ page }) => {
    await loginToDashboard(page);

    const settingsButton = page.getByRole("button", { name: /Settings|Sozlamalar|Настройки/i });
    await settingsButton.click();

    // Switch to Russian
    const ruButton = page.locator("button").filter({ hasText: "Русский" }).first();
    if (await ruButton.isVisible()) {
      await ruButton.click();

      // Verify nav uses Russian labels
      await expect(page.locator("nav").first()).toContainText("Обзор");
    }
  });
});