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

test.describe("settings and approvals shells", () => {
  test("demo path invoice processing → settings → approvals works on mocks", async ({ page }) => {
    await page.goto("/");

    await expect(page.getByTestId("app-wordmark")).toContainText("STAMPLI");
    await expect(page.getByTestId("page-title")).toHaveText("Invoice Processing");
    await expect(page.getByTestId("nav-invoice-processing")).toBeVisible();
    await expect(page.getByTestId("nav-settings")).toBeVisible();
    await expect(page.getByTestId("nav-approvals")).toBeVisible();

    await page.getByTestId("nav-settings").click();
    await expect(page.getByRole("heading", { name: "Settings" })).toBeVisible();
    await expect(page.getByTestId("settings-hub")).toBeVisible();

    await page.getByTestId("settings-link-vendors").click();
    await expect(page.getByRole("heading", { name: "Vendors" })).toBeVisible();
    await expect(
      page.getByTestId("settings-vendors-grid").locator(".MuiDataGrid-row").first(),
    ).toBeVisible();

    await page.getByTestId("settings-vendors-grid-new").click();
    await expect(page.getByRole("heading", { name: "New vendor" })).toBeVisible();
    await expect(page.getByTestId("settings-vendor-form")).toBeVisible();

    await page.getByTestId("nav-approvals").click();
    await expect(page.getByRole("heading", { name: "Approvals" })).toBeVisible();
    await expect(
      page.getByTestId("approvals-inbox-grid").locator(".MuiDataGrid-row").first(),
    ).toBeVisible();
  });

  test("each settings area lists mock data", async ({ page }) => {
    const areas = [
      {
        link: "settings-link-gl-accounts",
        heading: "GL accounts",
        grid: "settings-gl-accounts-grid",
      },
      {
        link: "settings-link-departments",
        heading: "Departments",
        grid: "settings-departments-grid",
      },
      { link: "settings-link-users", heading: "Users", grid: "settings-users-grid" },
      {
        link: "settings-link-approval-policies",
        heading: "Approval policies",
        grid: "settings-approval-policies-grid",
      },
    ] as const;

    for (const area of areas) {
      await page.goto("/settings");
      await page.getByTestId(area.link).click();
      await expect(page.getByRole("heading", { name: area.heading })).toBeVisible();
      await expect(page.getByTestId(area.grid).locator(".MuiDataGrid-row").first()).toBeVisible();
    }
  });
});