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

test.describe("Bulk Actions and Tree Search", () => {
  test.beforeEach(async ({ page }) => {
    // Authenticate as Super Admin
    await page.addInitScript(() => {
      const authority = "http://localhost:5000/oidc";
      const client_id = "adminfront";
      const key = `oidc.user:${authority}:${client_id}`;
      window.localStorage.setItem(
        key,
        JSON.stringify({
          access_token: "fake",
          profile: { sub: "admin", role: "super_admin" },
          expires_at: 9999999999,
        }),
      );
    });

    // Mock APIs
    await page.route("**/api/v1/user/me", async (route) => {
      await route.fulfill({ json: { id: "admin", role: "super_admin" } });
    });

    await page.route("**/api/v1/admin/users?*", async (route) => {
      await route.fulfill({
        json: {
          items: [
            {
              id: "u-1",
              name: "User One",
              email: "u1@test.com",
              status: "active",
              role: "user",
              createdAt: new Date().toISOString(),
            },
            {
              id: "u-2",
              name: "User Two",
              email: "u2@test.com",
              status: "active",
              role: "user",
              createdAt: new Date().toISOString(),
            },
          ],
          total: 2,
        },
      });
    });

    await page.route("**/api/v1/admin/tenants/t-1", async (route) => {
      await route.fulfill({
        json: { id: "t-1", name: "Main Tenant", slug: "main" },
      });
    });

    await page.route(
      "**/api/v1/admin/tenants/t-1/organization",
      async (route) => {
        await route.fulfill({
          json: [
            { id: "g-1", name: "Engineering", slug: "eng", tenantId: "t-1" },
            { id: "g-2", name: "Sales", slug: "sales", tenantId: "t-1" },
          ],
        });
      },
    );
  });

  test("should show bulk action bar when users are selected", async ({
    page,
  }) => {
    await page.goto("/users");

    // Check individual row
    await page.locator('input[type="checkbox"]').nth(1).check();
    await expect(page.getByText("1명 선택됨")).toBeVisible();
    await expect(
      page.getByRole("button", { name: /활성화|Active/i }),
    ).toBeVisible();

    // Check select all
    await page.locator('input[type="checkbox"]').first().check();
    await expect(page.getByText("2명 선택됨")).toBeVisible();

    // Clear selection
    await page.getByRole("button", { name: "Plus" }).click(); // The close icon
    await expect(page.getByText("명 선택됨")).not.toBeVisible();
  });

  test("should filter and highlight nodes in organization tree", async ({
    page,
  }) => {
    await page.goto("/tenants/t-1");
    await page
      .getByRole("link", { name: /하위 테넌트 관리|Sub-tenant/i })
      .click();

    const searchInput = page.getByPlaceholder(/조직도 내 검색|Search in tree/i);
    await expect(searchInput).toBeVisible();

    await searchInput.fill("Eng");

    // Check if Engineering row is highlighted
    const engRow = page.locator('tr:has-text("Engineering")');
    await expect(engRow).toHaveClass(/bg-primary\/10/);
  });
});