// Top-level brand row + Analyze All action (the pivot's primary global verb).

"use client";

import Link from "next/link";
import type { FixtureData } from "../../lib/fixtures/aristotle";
import { useAnalysis } from "../../lib/workspace/analysisStore";

interface TopBarProps {
  data: FixtureData;
}

export function TopBar({ data }: TopBarProps) {
  const { analyze, inFlight } = useAnalysis();
  const running = inFlight.size > 0;

  return (
    <header className="topbar">
      <div className="topbar-left">
        <Link href="/" className="brand" title="Back to all projects" style={{ textDecoration: "none", color: "inherit" }}>
          <span className="brand-name">Socrata</span>
        </Link>
        <div className="breadcrumbs">
          <span className="bc-sep">/</span>
          <span className="bc-item bc-active">{data.project.name}</span>
        </div>
      </div>
      <div className="topbar-right">
        <button
          type="button"
          className="topbar-analyze-all"
          onClick={() => void analyze("all")}
          disabled={running}
          title="Run all analyses against the current document"
        >
          {inFlight.has("all") ? "Analyzing all…" : running ? "Analyzing…" : "Analyze All"}
        </button>
        <div className="topbar-divider" />
        <Link href="/seed" className="topbar-new" title="Start a new idea">
          + new idea
        </Link>
        <div className="topbar-divider" />
        <div className="avatar">MC</div>
      </div>
    </header>
  );
}