import type { Metadata } from "next";
import { AI_DOC_URL } from "yt-dlp-transcript-common/lib/project";
import { currentSite } from "../../lib/site";
import { instanceMode } from "../../lib/mode";
import AskHub from "../../ask/AskHub";
import { isCitedSite } from "yt-dlp-transcript-common/lib/siteSchema";
import { NotOnCitedSite } from "../../components/reports/parts";

export const metadata: Metadata = { title: "Ask AI" };

// Static shell for the bring-your-own-key chat. All the work happens client-side
// in <AskChat/> — retrieval over the published shards + a direct call to the
// visitor's chosen provider. The export stays fully static.
//
// In single-site mode the corpus data source (SingleSiteDataProvider) lives in
// the shared workspace layout — alongside the persistent search bar — so this
// route renders just the chat and inherits the same session the results page
// uses. Hub mode is passed through the layout untouched, so <AskHub/> keeps its
// own MultiSiteDataProvider wiring.
export default function AskPage() {
  const site = currentSite();
  const isHub = instanceMode() === "hub";
  const scope = isHub ? "the federation" : "the transcripts";
  // A cited site has no corpus to ask about.
  if (!isHub && isCitedSite(site)) return <NotOnCitedSite title="Ask AI" />;

  return (
    <div className="mx-auto flex max-w-3xl flex-col gap-6">
      <header className="flex flex-col gap-2 border-b border-border pb-5">
        <p className="font-mono text-xs uppercase tracking-[0.18em] text-brand">
          Ask AI · {site.headerTitle}
        </p>
        <h1 className="font-display text-3xl font-semibold leading-tight text-foreground">
          Ask a question about {scope}
        </h1>
        <p className="max-w-prose text-sm text-muted-foreground">
          Bring your own API key. The chat searches the transcripts in your
          browser, sends the relevant excerpts to your chosen AI, and answers with
          citations. Nothing is hosted here — your key and the requests stay
          between your browser and the provider. See{" "}
          <a href={AI_DOC_URL} className="text-brand hover:underline">
            Use with AI
          </a>{" "}
          for other ways to use {isHub ? "every archive on this hub" : "this archive"}.
        </p>
      </header>

      {/* Single-site: the chat pane (AskChat) is mounted by the workspace shell
          (WorkspaceView), so this route renders only its intro header — the shell
          slots it above the chat. Hub mode bypasses the shell, so AskHub renders
          here with its own MultiSiteDataProvider wiring. */}
      {isHub && <AskHub transcriptDownloads={site.transcriptDownloads !== false} />}
    </div>
  );
}