import { test, expect } from "@playwright/test";
import { channelStage, generateReport, resetData } from "./helpers";

// ONE PANEL AT A TIME. This is the change, stated as a test.
//
// The old page rendered every stage panel expanded at lg+ and stacked ten of
// them below a full-height video browser, so the channel's actual lifecycle was
// the last thing you reached. Now `?stage=` selects exactly one, server-side,
// and no selection lands on an overview.
//
// The negative assertions are the load-bearing half: it is easy to make a stage
// visible and not notice that the other nine came with it.

const SLUG = "test-transcribe";

test("?stage=download renders the Download panel and NOT the Transcribe one", async ({
  page,
}) => {
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  await page.goto(channelStage(SLUG, "download"));

  await expect(page.getByRole("button", { name: "Download videos" })).toBeVisible();
  // The Transcribe panel's primary action is not merely hidden — it is absent.
  await expect(
    page.getByRole("button", { name: "Transcribe missing" }),
  ).toHaveCount(0);
  // Nor is any other panel along for the ride.
  await expect(page.getByRole("button", { name: "Verify" })).toHaveCount(0);
  // THE LIVE LABEL, not the pre-rename one. This assertion passed vacuously the
  // moment the stage card's aria-label changed from "backfill section" — an
  // absent-count check against a label nothing renders is always 0 — so it is
  // spelled with the label the card actually carries.
  await expect(page.getByLabel("speakers section")).toHaveCount(0);

  // The selected tab says so.
  await expect(page.getByLabel("Download stage tab")).toHaveAttribute(
    "aria-current",
    "page",
  );
});

test("?stage=transcribe swaps the panel over", async ({ page }) => {
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  await page.goto(channelStage(SLUG, "transcribe"));

  await expect(
    page.getByRole("button", { name: "Transcribe missing" }),
  ).toBeVisible();
  await expect(
    page.getByRole("button", { name: "Download videos" }),
  ).toHaveCount(0);
});

test("no ?stage= lands on the overview, which lists every stage without opening one", async ({
  page,
}) => {
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  await page.goto(`/channels/${SLUG}`);

  const overview = page.getByLabel("overview panel");
  await expect(overview).toBeVisible();
  // Every stage is legible from here…
  for (const title of [
    "Playlist",
    "Download",
    "Transcribe",
    "Digest",
    // Named after the operations it holds, not after the queue key. With the
    // default test settings no speaker operation is enabled, so the derived
    // generic name is what an honest label falls back to.
    "Derived data",
    "Cleanup",
    "Diagnostics",
  ]) {
    await expect(overview.getByLabel(`${title} overview row`)).toBeVisible();
  }
  // …and none of them is open.
  await expect(page.getByRole("button", { name: "Download videos" })).toHaveCount(0);
  await expect(page.getByRole("button", { name: "Transcribe missing" })).toHaveCount(0);
  await expect(page.getByLabel("Overview stage tab")).toHaveAttribute(
    "aria-current",
    "page",
  );
});

test("an unknown ?stage= falls back to the overview rather than 404ing", async ({
  page,
}) => {
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  const resp = await page.goto(`/channels/${SLUG}?stage=not-a-stage`);
  expect(resp?.status()).toBe(200);
  await expect(page.getByLabel("overview panel")).toBeVisible();
});

test("?stage=backfill still opens the speakers panel", async ({ page }) => {
  // A RENAMED stage is not an unknown one. The test above pins that an unknown
  // ?stage= lands on the overview at 200, which is right for a stage that no
  // longer applies — and would be wrong here: a bookmarked ?stage=backfill would
  // open the overview with nothing saying the panel it named is still there. The
  // alias in page.tsx is what makes the old link keep working.
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  const resp = await page.goto(`/channels/${SLUG}?stage=backfill`);
  expect(resp?.status()).toBe(200);
  await expect(page.getByLabel("speakers section")).toBeVisible();
  await expect(page.getByLabel("overview panel")).toHaveCount(0);
});

test("the Videos tab is a separate route, and the stage panels are not on it", async ({
  page,
}) => {
  await resetData("one-transcribe-channel-with-audio");
  await generateReport(page, SLUG);
  await page.goto(`/channels/${SLUG}`);

  await page.getByLabel("Videos tab").click();
  await expect(page).toHaveURL(new RegExp(`/channels/${SLUG}/videos$`));
  await expect(page.getByLabel("videos", { exact: true })).toBeVisible();
  await expect(page.getByLabel("channel line")).toHaveCount(0);
  await expect(page.getByLabel("overview panel")).toHaveCount(0);

  // …and back.
  await page.getByLabel("Overview tab").click();
  await expect(page.getByLabel("channel line")).toBeVisible();
});