"use client";

import { useState } from "react";
import { StreamActionLog } from "yt-dlp-transcript-common/components/StreamActionLog";
import {
  DEFAULT_ARCHIVE_OPTIONS,
  type ArchiveBuildOptions,
} from "yt-dlp-transcript-common/lib/archiveOptions";
import { QueueControl } from "../../components/QueueControl";
import { cancelJobAction } from "../../jobs/actions";
import {
  archiveCombinedLiveChatAction,
  archiveCombinedTranscriptsAction,
  archiveLiveChatAction,
  archiveTranscriptsAction,
  normalizeLiveChatAction,
  normalizeTranscriptsAction,
} from "../lib/buildAction";
import { cancelPublishRunAction, updateIndexAction } from "../lib/publishActions";
import { ArchiveOptionsControl } from "./ArchiveOptionsControl";

type Props = {
  existingQueues: string[];
};

const DEFAULT_BUILD_QUEUE = "build";

export function BuildButtons({ existingQueues }: Props) {
  const [normalizeQueue, setNormalizeQueue] = useState(DEFAULT_BUILD_QUEUE);
  const [archiveQueue, setArchiveQueue] = useState(DEFAULT_BUILD_QUEUE);
  const [combinedQueue, setCombinedQueue] = useState(DEFAULT_BUILD_QUEUE);
  const [liveChatNormalizeQueue, setLiveChatNormalizeQueue] = useState(
    DEFAULT_BUILD_QUEUE,
  );
  const [liveChatArchiveQueue, setLiveChatArchiveQueue] = useState(
    DEFAULT_BUILD_QUEUE,
  );
  const [liveChatCombinedQueue, setLiveChatCombinedQueue] = useState(
    DEFAULT_BUILD_QUEUE,
  );
  const [archiveOptions, setArchiveOptions] = useState<ArchiveBuildOptions>(
    DEFAULT_ARCHIVE_OPTIONS,
  );
  const [combinedOptions, setCombinedOptions] = useState<ArchiveBuildOptions>(
    DEFAULT_ARCHIVE_OPTIONS,
  );
  const [liveChatArchiveOptions, setLiveChatArchiveOptions] =
    useState<ArchiveBuildOptions>(DEFAULT_ARCHIVE_OPTIONS);
  const [liveChatCombinedOptions, setLiveChatCombinedOptions] =
    useState<ArchiveBuildOptions>(DEFAULT_ARCHIVE_OPTIONS);

  return (
    <div className="flex flex-col gap-8">
      <section className="flex flex-col gap-3">
        <div>
          <h2 className="text-lg font-semibold">Build index</h2>
          <p className="text-sm text-muted-foreground">
            The index update every site, the hub and the homepage are built
            from: the search index over <code>transcripts/channels/</code>, the
            stats datasets and the chart templates, in one child process on
            the <code>publish</code> queue. Cheap when nothing changed (each
            part short-circuits).
          </p>
        </div>
        {/* No queue control: the index update is a publish stage, and the
            publish queue runs its stages one at a time. */}
        <StreamActionLog
          trigger={() => updateIndexAction()}
          cancelAction={cancelPublishRunAction}
          buttonLabel="Build index"
          runningLabel="Building index…"
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">Normalize transcripts</h2>
          <p className="text-sm text-muted-foreground">
            Walks every video and writes{" "}
            <code>transcript.cues.json</code> next to each raw{" "}
            <code>.vtt</code>/<code>.json</code>. Idempotent — skips entries
            whose cues file is already up to date.
          </p>
        </div>
        <StreamActionLog
          trigger={() => normalizeTranscriptsAction(normalizeQueue)}
          cancelAction={cancelJobAction}
          buttonLabel="Normalize transcripts"
          runningLabel="Normalizing transcripts…"
          extraControls={
            <QueueControl
              value={normalizeQueue}
              onChange={setNormalizeQueue}
              defaultQueueKey={DEFAULT_BUILD_QUEUE}
              existingQueues={existingQueues}
              actionLabel="Normalize transcripts"
            />
          }
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">Build transcript archives</h2>
          <p className="text-sm text-muted-foreground">
            Produces one <code>&lt;channel&gt;.{archiveOptions.format}</code> per channel
            under <code>transcripts/export/archives/</code>, containing each
            video&apos;s compact <code>transcript.cues.json</code> plus a{" "}
            <code>channel.json</code> manifest. Normalizes missing cues on
            demand.
          </p>
        </div>
        <StreamActionLog
          trigger={() => archiveTranscriptsAction(archiveOptions, archiveQueue)}
          cancelAction={cancelJobAction}
          buttonLabel="Build archives"
          runningLabel="Building archives…"
          extraControls={
            <div className="flex flex-wrap items-center gap-3">
              <ArchiveOptionsControl
                value={archiveOptions}
                onChange={setArchiveOptions}
                actionLabel="Build archives"
              />
              <QueueControl
                value={archiveQueue}
                onChange={setArchiveQueue}
                defaultQueueKey={DEFAULT_BUILD_QUEUE}
                existingQueues={existingQueues}
                actionLabel="Build archives"
              />
            </div>
          }
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">
            Build combined transcript archive
          </h2>
          <p className="text-sm text-muted-foreground">
            Produces a single{" "}
            <code>all-transcripts.{combinedOptions.format}</code> under{" "}
            <code>transcripts/export/archives/</code> containing every
            channel plus a top-level <code>manifest.json</code> index.
            Normalizes missing cues on demand.
          </p>
        </div>
        <StreamActionLog
          trigger={() =>
            archiveCombinedTranscriptsAction(combinedOptions, combinedQueue)
          }
          cancelAction={cancelJobAction}
          buttonLabel="Build combined archive"
          runningLabel="Building combined archive…"
          extraControls={
            <div className="flex flex-wrap items-center gap-3">
              <ArchiveOptionsControl
                value={combinedOptions}
                onChange={setCombinedOptions}
                actionLabel="Build combined archive"
              />
              <QueueControl
                value={combinedQueue}
                onChange={setCombinedQueue}
                defaultQueueKey={DEFAULT_BUILD_QUEUE}
                existingQueues={existingQueues}
                actionLabel="Build combined archive"
              />
            </div>
          }
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">Normalize live chat</h2>
          <p className="text-sm text-muted-foreground">
            Walks every video and writes{" "}
            <code>live_chat.cues.json</code> next to each raw{" "}
            <code>transcript.live_chat.json</code>. Idempotent — skips
            entries whose cues file is already up to date.
          </p>
        </div>
        <StreamActionLog
          trigger={() => normalizeLiveChatAction(liveChatNormalizeQueue)}
          cancelAction={cancelJobAction}
          buttonLabel="Normalize live chat"
          runningLabel="Normalizing live chat…"
          extraControls={
            <QueueControl
              value={liveChatNormalizeQueue}
              onChange={setLiveChatNormalizeQueue}
              defaultQueueKey={DEFAULT_BUILD_QUEUE}
              existingQueues={existingQueues}
              actionLabel="Normalize live chat"
            />
          }
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">Build live chat archives</h2>
          <p className="text-sm text-muted-foreground">
            Produces one <code>&lt;channel&gt;.live_chat.{liveChatArchiveOptions.format}</code> per
            channel under <code>transcripts/export/archives/</code>,
            containing each video&apos;s parsed{" "}
            <code>live_chat.cues.json</code> plus a{" "}
            <code>channel.json</code> manifest. Normalizes missing live
            chats on demand.
          </p>
        </div>
        <StreamActionLog
          trigger={() =>
            archiveLiveChatAction(liveChatArchiveOptions, liveChatArchiveQueue)
          }
          cancelAction={cancelJobAction}
          buttonLabel="Build live chat archives"
          runningLabel="Building live chat archives…"
          extraControls={
            <div className="flex flex-wrap items-center gap-3">
              <ArchiveOptionsControl
                value={liveChatArchiveOptions}
                onChange={setLiveChatArchiveOptions}
                actionLabel="Build live chat archives"
              />
              <QueueControl
                value={liveChatArchiveQueue}
                onChange={setLiveChatArchiveQueue}
                defaultQueueKey={DEFAULT_BUILD_QUEUE}
                existingQueues={existingQueues}
                actionLabel="Build live chat archives"
              />
            </div>
          }
        />
      </section>

      <section className="flex flex-col gap-3 border-t border-border pt-6">
        <div>
          <h2 className="text-lg font-semibold">
            Build combined live chat archive
          </h2>
          <p className="text-sm text-muted-foreground">
            Produces a single <code>all-live-chat.{liveChatCombinedOptions.format}</code> under{" "}
            <code>transcripts/export/archives/</code> containing every
            channel&apos;s parsed live chats plus a top-level{" "}
            <code>manifest.json</code> index. Normalizes missing live chats
            on demand.
          </p>
        </div>
        <StreamActionLog
          trigger={() =>
            archiveCombinedLiveChatAction(
              liveChatCombinedOptions,
              liveChatCombinedQueue,
            )
          }
          cancelAction={cancelJobAction}
          buttonLabel="Build combined live chat archive"
          runningLabel="Building combined live chat archive…"
          extraControls={
            <div className="flex flex-wrap items-center gap-3">
              <ArchiveOptionsControl
                value={liveChatCombinedOptions}
                onChange={setLiveChatCombinedOptions}
                actionLabel="Build combined live chat archive"
              />
              <QueueControl
                value={liveChatCombinedQueue}
                onChange={setLiveChatCombinedQueue}
                defaultQueueKey={DEFAULT_BUILD_QUEUE}
                existingQueues={existingQueues}
                actionLabel="Build combined live chat archive"
              />
            </div>
          }
        />
      </section>
    </div>
  );
}