"use client";

// The hub home: the archives (official instances, the visitor's added ones,
// the add form) above one unified search across all of them. The cards and
// add-flow live in ArchiveShelf; this
// component wires the registry into the multi-origin data source so the shared
// TranscriptSearch renders one merged, origin-qualified view.

import { PlayerProvider } from "yt-dlp-transcript-common/components/PlayerProvider";
import TranscriptModal from "yt-dlp-transcript-common/components/TranscriptModal";
import PostModal from "yt-dlp-transcript-common/components/PostModal";
import TranscriptSearch from "yt-dlp-transcript-common/components/TranscriptSearch";
import { MultiSiteDataProvider } from "yt-dlp-transcript-common/components/SearchDataContext";
import ArchiveShelf from "./ArchiveShelf";
import HubStats from "./HubStats";
import HubOfflineManager from "./HubOfflineManager";
import HubScope from "./HubScope";
import { useFederatedSites } from "./useHubSites";

// `transcriptDownloads` comes from the server parent's currentSite() (a client
// component cannot read site.json): false hides the modal's per-video export
// controls.
export default function HubHome({
  transcriptDownloads = true,
}: {
  transcriptDownloads?: boolean;
}) {
  // Every archive in the shelf's order, each with its colour (carried through
  // to the merged search for provenance: result stripes, chip dots) and its
  // scope — every one unless this browser switched it off with its chip; an
  // archive switched off is not fetched at all.
  const { federated, toggle } = useFederatedSites();

  return (
    <PlayerProvider features={{ transcriptDownloads }}>
      <div className="flex flex-col gap-6">
        <ArchiveShelf />
        {/* progressive: the search runs as soon as one archive is in, and
            re-runs as each further archive arrives. */}
        <MultiSiteDataProvider sites={federated} progressive>
          <div className="flex flex-col gap-3">
            <HubStats />
            <HubScope onToggle={toggle} />
          </div>
          <TranscriptSearch />
          <HubOfflineManager />
        </MultiSiteDataProvider>
      </div>
      <TranscriptModal />
      {/* Sibling viewer for the social-post corpus (see PostModal.tsx). */}
      <PostModal />
    </PlayerProvider>
  );
}