/**
 * Focused plugin-authoring docs captures. This generator is skipped in CI.
 * It installs the packaged Bitbucket plugin into an isolated E2E backend so
 * every image exercises the public plugin contract and host-owned UI.
 *
 * From apps/web, set CAPTURE_DOCS_MEDIA=1, DOCS_CODE_HOST_PLUGIN_PACKAGE to
 * the packaged plugin, and DOCS_SCREENSHOTS_DIR to a staging directory; then
 * run this spec through `pnpm e2e:run --host --project chromium -- ...`.
 */
import fs from "node:fs";
import path from "node:path";
import type { Locator, Page } from "@playwright/test";
import { expect, test } from "../../fixtures/test-base";
import { KanbanPage } from "../../pages/kanban-page";
import { SessionPage } from "../../pages/session-page";
import {
  CODE_HOST_PULL_REQUEST as PULL_REQUEST,
  CODE_HOST_REVIEW_KEY as REVIEW_KEY,
} from "./plugin-code-host-docs-fixture";

const CAPTURE = process.env.CAPTURE_DOCS_MEDIA === "1";
const PLUGIN_ID = "kandev-plugin-bitbucket";
const PACKAGE_PATH = process.env.DOCS_CODE_HOST_PLUGIN_PACKAGE?.trim();
const FIXTURE_ID = "kandev-plugin-e2e";
const FIXTURE_PACKAGE = path.resolve(
  __dirname,
  "../../../../../apps/backend/.build/kandev-plugin-e2e-1.0.0.tar.gz",
);
const SCREENSHOTS_DIR = process.env.DOCS_SCREENSHOTS_DIR
  ? path.resolve(process.env.DOCS_SCREENSHOTS_DIR)
  : path.resolve(__dirname, "../../../../../docs/screenshots");

async function installPlugin(page: Page, id: string, packagePath: string): Promise<void> {
  await page.goto("/settings/plugins");
  await page.getByTestId("install-plugin-trigger").click();
  await page.getByTestId("install-plugin-tab-upload").click();
  await page.getByTestId("install-plugin-file-input").setInputFiles(packagePath);
  await page.getByTestId("install-plugin-upload-submit").click();
  const row = page.getByTestId(`plugin-row-${id}`);
  await expect(row).toBeVisible({ timeout: 15_000 });
  await expect(row.getByText("Active", { exact: true })).toBeVisible();
}

async function settle(page: Page): Promise<void> {
  await page.evaluate(async () => {
    await document.fonts.ready;
    const finite = document.getAnimations().filter((animation) => {
      const iterations = animation.effect?.getComputedTiming().iterations;
      return typeof iterations === "number" && Number.isFinite(iterations);
    });
    await Promise.all(finite.map((animation) => animation.finished.catch(() => undefined)));
  });
}

async function focusedShot(
  page: Page,
  name: string,
  locators: Locator[],
  padding = 16,
  bottomPadding = padding,
): Promise<void> {
  await settle(page);
  fs.mkdirSync(SCREENSHOTS_DIR, { recursive: true });
  const boxes = [];
  for (const locator of locators) {
    for (let index = 0; index < (await locator.count()); index += 1) {
      const item = locator.nth(index);
      if (await item.isVisible()) {
        const box = await item.boundingBox();
        if (box) boxes.push(box);
      }
    }
  }
  if (boxes.length === 0) throw new Error(`No visible capture target for ${name}`);
  const viewport = page.viewportSize();
  if (!viewport) throw new Error("Viewport unavailable");
  const left = Math.max(0, Math.min(...boxes.map((box) => box.x)) - padding);
  const top = Math.max(0, Math.min(...boxes.map((box) => box.y)) - padding);
  const right = Math.min(
    viewport.width,
    Math.max(...boxes.map((box) => box.x + box.width)) + padding,
  );
  const bottom = Math.min(
    viewport.height,
    Math.max(...boxes.map((box) => box.y + box.height)) + bottomPadding,
  );
  await page.screenshot({
    path: path.join(SCREENSHOTS_DIR, `plugin-code-host-${name}.png`),
    clip: { x: left, y: top, width: right - left, height: bottom - top },
  });
}

async function mockBitbucket(page: Page, taskId: string): Promise<void> {
  const repositories = {
    repositories: [
      {
        provider_id: "bitbucket",
        provider_host: "bitbucket.org",
        owner_or_project: "northstar-labs",
        provider_repository_id: "northstar-labs/relay",
        name: "relay",
        clone_url: "https://bitbucket.org/northstar-labs/relay.git",
        default_branch: "main",
      },
    ],
  };
  const queue = { pull_requests: [PULL_REQUEST] };
  await page.route(`**/api/plugins/${PLUGIN_ID}/actions/**`, async (route) => {
    const action = new URL(route.request().url()).pathname.split("/").at(-1) ?? "";
    const request = route.request().postDataJSON() as { body?: { view?: string } } | null;
    const responses: Record<string, unknown> = {
      "connection.get": { state: "connected", healthy: true, product: "cloud" },
      "repositories.list": repositories,
      "pullrequests.queue": queue,
      "pullrequests.search": queue,
      "pullrequests.associations": {
        associations: [
          {
            review_key: REVIEW_KEY,
            task_id: taskId,
            task_title: "Audit export retention controls",
          },
        ],
      },
      "watches.get": { watches: [] },
    };
    let response = responses[action];
    if (action === "pullrequests.get") {
      response = request?.body?.view === "task" ? queue : PULL_REQUEST;
    }
    if (response === undefined) return route.continue();
    await route.fulfill({
      status: 200,
      contentType: "application/json",
      body: JSON.stringify(response),
    });
  });
}

test.describe("Plugin code-host docs screenshots", () => {
  test.skip(!CAPTURE || !PACKAGE_PATH, "set CAPTURE_DOCS_MEDIA and DOCS_CODE_HOST_PLUGIN_PACKAGE");

  test.afterEach(async ({ apiClient }) => {
    await apiClient.rawRequest("DELETE", `/api/plugins/${PLUGIN_ID}`).catch(() => undefined);
    await apiClient.rawRequest("DELETE", `/api/plugins/${FIXTURE_ID}`).catch(() => undefined);
  });

  test("captures host-owned code-host surfaces", async ({ testPage, apiClient, seedData }) => {
    test.setTimeout(150_000);
    await testPage.setViewportSize({ width: 1440, height: 900 });
    const task = await apiClient.createTaskWithAgent(
      seedData.workspaceId,
      "Audit export retention controls",
      seedData.agentProfileId,
      {
        description: "/e2e:simple-message",
        workflow_id: seedData.workflowId,
        workflow_step_id: seedData.startStepId,
        repository_ids: [seedData.repositoryId],
      },
    );
    if (!task.session_id || !PACKAGE_PATH) throw new Error("Capture task or package unavailable");
    await mockBitbucket(testPage, task.id);
    await installPlugin(testPage, PLUGIN_ID, PACKAGE_PATH);

    await testPage.goto("/bitbucket");
    const workbench = testPage.getByTestId("bitbucket-workbench");
    await expect(workbench.getByText(PULL_REQUEST.title)).toBeVisible();
    await focusedShot(testPage, "dashboard", [
      workbench.getByTestId("bitbucket-scope-bar"),
      workbench.getByTestId("bitbucket-list-toolbar"),
      workbench.getByTestId("bitbucket-pr-queue"),
    ]);

    const kanban = new KanbanPage(testPage);
    await kanban.goto();
    await kanban.createTaskButton.first().click();
    await testPage.getByTestId("source-mode-remote").click();
    await testPage.getByTestId("remote-repo-chip-trigger").first().click();
    const repository = testPage
      .getByTestId("remote-repo-option")
      .filter({ hasText: "northstar-labs/relay" });
    await expect(repository).toBeVisible();
    await focusedShot(testPage, "repository-picker", [testPage.getByRole("dialog"), repository]);
    await testPage.getByRole("button", { name: "Cancel" }).click();

    await kanban.openTaskContextMenu(task.id);
    const link = testPage.getByTestId("task-context-link");
    await link.focus();
    await testPage.keyboard.press("ArrowRight");
    const bitbucketLink = testPage.getByTestId(
      "task-context-link-plugin-kandev-plugin-bitbucket:link-pull-request",
    );
    await expect(bitbucketLink).toBeVisible();
    await focusedShot(testPage, "link-menu", [testPage.locator('[role="menu"]:visible')]);
    await bitbucketLink.click();
    const linkDialog = testPage.getByRole("dialog", { name: "Link Bitbucket pull request" });
    await expect(linkDialog).toBeVisible();
    await focusedShot(testPage, "link-dialog", [linkDialog]);
    await testPage.keyboard.press("Escape");

    await testPage.goto("/");
    const taskRow = testPage
      .getByTestId("sidebar-task-item")
      .filter({ hasText: "Audit export retention controls" });
    const icon = taskRow.getByTestId(`registered-change-request-task-icon-${task.id}`);
    await icon.hover();
    const summary = testPage.locator('[data-testid="pr-task-status-summary"]:visible').first();
    await expect(summary).toBeVisible();
    await expect(icon).toHaveClass(/text-sky-400/);
    await focusedShot(testPage, "sidebar-status", [taskRow, summary]);

    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();
    const chip = testPage.getByTestId("integration-change-request-status-chip").first();
    await expect(chip).toBeVisible();
    await chip.hover();
    const statusPopover = testPage.getByTestId("integration-change-request-status-popover");
    await expect(statusPopover).toBeVisible();
    await focusedShot(testPage, "ci-popover", [chip, statusPopover]);
    await testPage.keyboard.press("Escape");

    const topbar = testPage.getByTestId("integration-change-request-status-trigger").first();
    await topbar.click();
    const review = testPage.getByTestId("change-request-detail");
    await expect(review).toBeVisible();
    await focusedShot(testPage, "review-panel", [review]);
  });

  test("captures dynamic composer reference search", async ({ testPage, apiClient, seedData }) => {
    test.setTimeout(120_000);
    await testPage.setViewportSize({ width: 1100, height: 760 });
    await installPlugin(testPage, FIXTURE_ID, FIXTURE_PACKAGE);
    const task = await apiClient.createTaskWithAgent(
      seedData.workspaceId,
      "Provider-neutral reference search",
      seedData.agentProfileId,
      {
        description: "/e2e:simple-message",
        workflow_id: seedData.workflowId,
        workflow_step_id: seedData.startStepId,
        repository_ids: [seedData.repositoryId],
      },
    );
    if (!task.session_id) throw new Error("Reference capture task has no session");
    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();
    await session.waitForChatIdle({ timeout: 30_000 });
    const editor = session.activeChat().locator(".tiptap.ProseMirror:visible").first();
    await editor.fill("");
    await editor.pressSequentially("#Provider-neutral");
    const option = testPage.getByRole("option", { name: /Pull request #42/ });
    await expect(option).toBeVisible();
    await focusedShot(testPage, "reference-search", [editor, option], 32, 4);
  });
});