import type { Metadata } from "next";
import Link from "next/link";
import { getPaths } from "yt-dlp-transcript-common/lib/paths";
import { getSettings } from "yt-dlp-transcript-common/lib/settings";
import { readPublishStatus } from "yt-dlp-transcript-common/publish/publishState";
import { PublishLaneView } from "../components/PublishLaneView";
import { PublishSettingsForm } from "../components/settings/PublishSettingsForm";

export const dynamic = "force-dynamic";
export const metadata: Metadata = { title: "Publish lane" };

// THE PUBLISH LANE (release 18) — a static route beside `operations/[id]`
// (Next prefers it): the publish lane is not an operation of the catalog
// (lib/operations.ts), whose settings switch and lane keys are the ingest
// lanes', so it has its own page rather than a catalog entry.
//
// Everything on it is read through readPublishStatus — the same status the
// /sites Publish panel, `archilyzer publish status` and `GET /api/ops/publish`
// read.
export default async function PublishLanePage() {
  const status = await readPublishStatus(getPaths());
  const settings = getSettings().publish;
  return (
    <div className="flex max-w-4xl flex-col gap-6">
      <div>
        <h1 className="text-2xl font-semibold">Publishing</h1>
        <p className="text-sm text-muted-foreground">
          The lane keeps the published sites current: when the index is stale it updates it, then builds
          what changed and deploys where each target&rsquo;s policy says. Every stage runs on the{" "}
          <code>publish</code> queue, one at a time. The rows and their buttons are on{" "}
          <Link href="/sites" className="underline">
            /sites
          </Link>
          .
        </p>
      </div>
      <PublishLaneView
        lane={status.lane}
        plan={{ steps: status.plan.steps, skipped: status.plan.skipped }}
      />
      <PublishSettingsForm initial={settings} />
    </div>
  );
}