Socrates/apps/web/components/editor/EditorShell.tsx

// The pivoted workspace shell.
//
// Layout: TopBar → [LeftSidebar | MainWorkspace] → StatusBar.
//   LeftSidebar lists all sections (Outline + Structure + Findings).
//   MainWorkspace is a flex of panes: a pinned text editor + zero-or-more
//   section panes (Model, Taxonomy, Glossary, Requirements, Findings) that
//   the user opens from the sidebar.

"use client";

import { useMemo, Suspense } from "react";
import { useSearchParams } from "next/navigation";
import { TopBar } from "./TopBar";
import { LeftSidebar } from "./LeftSidebar";
import { StatusBar } from "./StatusBar";
import { MainWorkspace } from "./MainWorkspace";
import type { FixtureData } from "../../lib/fixtures/aristotle";
import { fromFixture } from "../../lib/sysml/fromFixture";
import { applyBreaks, BREAKS, type BreakName } from "../../lib/sysml/breaks";
import { ModelStoreProvider } from "../../lib/sync/ModelStore";
import { OpenPanesProvider } from "../../lib/workspace/openPanesStore";
import { AnalysisStoreProvider } from "../../lib/workspace/analysisStore";
import { EditorPaneContextProvider } from "./sections/paneContext";
import type { Density } from "../../lib/workspace/types";

interface EditorShellProps {
  data: FixtureData;
  /** Server-loaded initial model + version. When omitted, falls back to
   *  deriving from `data` (legacy fixture path; useful for tests). */
  initialModel?: import("../../lib/sysml/model").SysMLModel;
  initialVersion?: number;
  projectId?: string;
  density?: Density;
}

export function EditorShell(props: EditorShellProps) {
  return (
    <Suspense fallback={null}>
      <EditorShellInner {...props} />
    </Suspense>
  );
}

function EditorShellInner({ data, initialModel, initialVersion, projectId, density = "comfortable" }: EditorShellProps) {
  const searchParams = useSearchParams();

  const breaks = useMemo<BreakName[]>(() => {
    const raw = searchParams?.get("break") ?? "";
    if (!raw) return [];
    return raw.split(",").map(s => s.trim()).filter((s): s is BreakName => s in BREAKS);
  }, [searchParams]);

  const startingModel = useMemo(() => {
    const base = initialModel ?? fromFixture(data);
    return breaks.length > 0 ? applyBreaks(base, breaks) : base;
  }, [initialModel, data, breaks]);

  const id = projectId ?? "aristotle";

  return (
    <ModelStoreProvider initialModel={startingModel} initialVersion={initialVersion ?? 1} projectId={id}>
      <OpenPanesProvider projectId={id}>
        <AnalysisStoreProvider projectId={id}>
          <EditorPaneContextProvider projectId={id}>
            <div className={`shell shell-density-${density}`}>
              <TopBar data={data} />
              <div className="shell-body shell-body-pivot">
                <LeftSidebar />
                <MainWorkspace data={data} projectId={id} />
              </div>
              <StatusBar data={data} />
            </div>
          </EditorPaneContextProvider>
        </AnalysisStoreProvider>
      </OpenPanesProvider>
    </ModelStoreProvider>
  );
}