import { Activity, Braces, Database, FileSearch, GitBranch, Home, PackageOpen, ShieldCheck } from "lucide-react";
import type { LucideIcon } from "lucide-react";
import { useState } from "react";
import { Shell } from "../components/layout/Shell";
import { ObjectDetailPage } from "../features/object-detail/ObjectDetailPage";
import { OverviewPage } from "../features/overview/OverviewPage";
import { RepositoriesPage } from "../features/repositories/RepositoriesPage";
import { createRepositoryBrowserState } from "../features/repositories/repositoryBrowserState";

type ViewId = "overview" | "repositories" | "publication-points" | "objects" | "validation" | "exports" | "runs" | "api";

const navigationItems = [
  { id: "overview", label: "Overview", icon: Home },
  { id: "repositories", label: "Repositories", icon: Database },
  { id: "publication-points", label: "Publication Points", icon: GitBranch },
  { id: "objects", label: "Objects", icon: Braces },
  { id: "validation", label: "Validation", icon: ShieldCheck },
  { id: "exports", label: "Exports", icon: PackageOpen },
  { id: "runs", label: "Runs", icon: Activity },
  { id: "api", label: "API", icon: FileSearch }
] satisfies Array<{ id: ViewId; label: string; icon: LucideIcon }>;

const comingSoonCopy: Record<Exclude<ViewId, "overview" | "repositories" | "objects">, { title: string; description: string; alternative: string }> = {
  "publication-points": {
    title: "Publication Points",
    description: "Dedicated publication point analytics are not implemented yet.",
    alternative: "Use Repositories to drill down from repository to publication point and object rows."
  },
  validation: {
    title: "Validation",
    description: "A dedicated validation investigation workspace is planned but not available in this MVP.",
    alternative: "Use Overview for reason summaries and Object Detail for per-object validation evidence."
  },
  exports: {
    title: "Exports",
    description: "A standalone export job browser is planned but not available yet.",
    alternative: "Use Object Detail to trigger object or publication point export workflows."
  },
  runs: {
    title: "Runs",
    description: "Historical run navigation is not implemented in the current Explorer UI.",
    alternative: "The current view always uses the latest indexed run from query service."
  },
  api: {
    title: "API",
    description: "The API reference page is planned but not implemented yet.",
    alternative: "Use the project README and query service endpoints while the UI reference page is pending."
  }
};

export function App() {
  const [activeView, setActiveView] = useState<ViewId>("overview");
  const [selectedObjectInstanceId, setSelectedObjectInstanceId] = useState<string | null>(null);
  const [repositoryBrowserState, setRepositoryBrowserState] = useState(createRepositoryBrowserState);

  const openObject = (objectInstanceId: string) => {
    setSelectedObjectInstanceId(objectInstanceId);
    setActiveView("objects");
  };

  const renderActiveView = () => {
    if (activeView === "objects") {
      return <ObjectDetailPage initialObjectInstanceId={selectedObjectInstanceId} />;
    }
    if (activeView === "repositories") {
      return (
        <RepositoriesPage
          browserState={repositoryBrowserState}
          onBrowserStateChange={setRepositoryBrowserState}
          onOpenObject={openObject}
        />
      );
    }
    if (activeView === "overview") {
      return <OverviewPage />;
    }
    return <ComingSoonPage {...comingSoonCopy[activeView]} />;
  };

  return (
    <Shell activeView={activeView} navigationItems={navigationItems} onNavigate={setActiveView}>
      {renderActiveView()}
    </Shell>
  );
}

function ComingSoonPage({ title, description, alternative }: { title: string; description: string; alternative: string }) {
  return (
    <section className="page-stack" aria-labelledby="coming-soon-heading">
      <div className="hero-dashboard compact-hero coming-soon-panel">
        <div>
          <p className="eyebrow">Planned workspace</p>
          <h2 id="coming-soon-heading">{title}</h2>
          <p>{description}</p>
        </div>
        <div className="hero-status muted-status">
          <strong>Coming soon</strong>
          <span>{alternative}</span>
        </div>
      </div>
    </section>
  );
}
