Pivot to text-first column-stack workspace + merge-with-review across AI artifacts
Workspace - Pivot from "set of open panes" to a Finder-style miller column stack: TopBar / LeftSidebar / [section → entity → entity ...] / pinned text editor. openPanesStore is now an ordered Column[] with pushFrom / closeFrom / setStack; only one top-level section is rooted at a time. - New entity column panes: Term, Block, Association, Constraint, Requirement, Finding. Click-through navigation truncates deeper columns automatically. - LeftSidebar surfaces a pending-count chip per section (single-glance navigation cue) and spins its analyze ↻ via SVG Spinner whenever the LLM is working — including server-initiated runs caught by the runs poll, not just user-triggered ones. Analyze pipeline + persistence - Unified `concepts` pass (taxonomy + glossary in one LLM call) replaces the two-pass setup. Server still accepts ?section=taxonomy|glossary and normalizes them for back-compat. - model / requirements / detection (assumptions, risks, inconsistencies) + cross-layer validation rules (X1–X4: stale term link, unlinked formalism, undefined linked term, prose-only term). - Persistence: NarrativeDocument, ModelSnapshot, ChangelogEntry, TaxonomyTerm, RequirementEntry, Finding, AnalysisRun. Re-runs MERGE instead of replace: gentle update on existing items, suggested on new, deprecated on missing — same idiom for every artifact kind. User pins preserve "kept" decisions across re-analyses. - Migrations: pivot_text_first, add_requirement_linked_term, term_review_state, review_state_for_reqs_and_findings, add_term_definition_pinned. Concept ↔ ontology integration - linkedTermId on Block / Association / Constraint / Requirement. PromoteToolbar lets the user formalize a concept inline: + Block / + Association / + Constraint / + Requirement, all routed through applyOps so undo/redo and SSE work for free. - decideElement op for in-canvas keep/discard on review-pending model elements. User-authored definitions - TermColumn definition is click-to-edit. Save (Cmd-Enter / blur), Cancel (Esc), Reset to AI suggestion when pinned. - definitionPinned flag on TaxonomyTerm: future Analyze runs leave the user's text alone. setTermDefinition repo function + POST /api/projects/[id]/terms/[termId]/definition endpoint. - mergeTaxonomySuggestion + applyGlossaryDefinitions both pin-aware. UX/UI - StatusChip: single component for all state idioms (suggested, deprecated, accepted, dismissed, resolved, severity, validation code, confidence, warn). Replaces 5+ ad-hoc badge classes. - PaneControls (PaneViewTabs + PaneFilterChip): separates view-mode toggles from filter chips so toggling Pending no longer flips you off the current view. - PaneEmpty: unified empty-state with title + hint + action. - PaneDrawer: collapsible groups for Pending / Discarded review; cards group as Kept (top) → Pending (bottom drawer) → Discarded (Findings only, hidden when empty). Restore action recovers dismissed/resolved findings. - ConceptCard unifies Tree and A–Z views in Concepts; only Tree parents carry the chevron (no empty placeholder offset). - Type + spacing tokens (--text-xs..xl, --space-1..6, --lh-tight/ui/ prose, --radius-*) replace every ad-hoc value. - Buttons standardized to body sans 500 (was a mishmash of mono / display). - Card shells unified across Concepts / Requirements / Findings. Cleanup - Removed: LeftRail, FindingsPanel, IssuesPanel, SocratesDock, ProposalCard, SlashMenu, SlashExtension, slashSuggestion, CanvasHeader, TaxonomyPane, GlossaryPane, TermDetail (popover; now TermColumn). - Section ids in openPanesStore: dropped taxonomy/glossary, added concepts. localStorage migration runs on hydrate. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,38 +1,36 @@
|
||||
// The dual-canvas workspace shell.
|
||||
// M5: state lives in ModelStoreProvider; both canvases consume the canonical
|
||||
// SysMLModel and emit ModelOps back through useApply().
|
||||
// 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, useState, Suspense } from "react";
|
||||
import { useMemo, Suspense } from "react";
|
||||
import { useSearchParams } from "next/navigation";
|
||||
import { TopBar } from "./TopBar";
|
||||
import { LeftRail } from "./LeftRail";
|
||||
import { CanvasHeader } from "./CanvasHeader";
|
||||
import { LeftSidebar } from "./LeftSidebar";
|
||||
import { StatusBar } from "./StatusBar";
|
||||
import { IssuesPanel } from "./IssuesPanel";
|
||||
import { FindingsPanel } from "./FindingsPanel";
|
||||
import { TextCanvas } from "../text-canvas/TextCanvas";
|
||||
import { DiagramCanvas, type DiagramVariant } from "../diagram-canvas/DiagramCanvas";
|
||||
import { SocratesDock, type Density, type SocratesPresence } from "../socrates/SocratesDock";
|
||||
import type { MarkupStyle } from "../text-canvas/Chip";
|
||||
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, useModelStore } from "../../lib/sync/ModelStore";
|
||||
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 (M5.9). When omitted, falls back to
|
||||
/** 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;
|
||||
/** When set, apply() POSTs to /api/projects/[projectId]/apply. */
|
||||
projectId?: string;
|
||||
density?: Density;
|
||||
markupStyle?: MarkupStyle;
|
||||
diagramStyle?: DiagramVariant;
|
||||
presence?: SocratesPresence;
|
||||
}
|
||||
|
||||
export function EditorShell(props: EditorShellProps) {
|
||||
@@ -43,16 +41,7 @@ export function EditorShell(props: EditorShellProps) {
|
||||
);
|
||||
}
|
||||
|
||||
function EditorShellInner({
|
||||
data,
|
||||
initialModel,
|
||||
initialVersion,
|
||||
projectId,
|
||||
density = "comfortable",
|
||||
markupStyle = "color",
|
||||
diagramStyle = "softened",
|
||||
presence = "default",
|
||||
}: EditorShellProps) {
|
||||
function EditorShellInner({ data, initialModel, initialVersion, projectId, density = "comfortable" }: EditorShellProps) {
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
const breaks = useMemo<BreakName[]>(() => {
|
||||
@@ -61,112 +50,29 @@ function EditorShellInner({
|
||||
return raw.split(",").map(s => s.trim()).filter((s): s is BreakName => s in BREAKS);
|
||||
}, [searchParams]);
|
||||
|
||||
// Prefer server-loaded model; fall back to fixture derivation for legacy
|
||||
// callers without DB persistence wiring.
|
||||
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={projectId}
|
||||
>
|
||||
<ShellBody
|
||||
data={data}
|
||||
projectId={projectId}
|
||||
density={density}
|
||||
markupStyle={markupStyle}
|
||||
diagramStyle={diagramStyle}
|
||||
presence={presence}
|
||||
breaks={breaks}
|
||||
/>
|
||||
<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>
|
||||
);
|
||||
}
|
||||
|
||||
interface ShellBodyProps {
|
||||
data: FixtureData;
|
||||
projectId?: string;
|
||||
density: Density;
|
||||
markupStyle: MarkupStyle;
|
||||
diagramStyle: DiagramVariant;
|
||||
presence: SocratesPresence;
|
||||
breaks: BreakName[];
|
||||
}
|
||||
|
||||
function ShellBody({ data, projectId, density, markupStyle, diagramStyle, presence, breaks }: ShellBodyProps) {
|
||||
const [focusBlockId, setFocusBlockId] = useState<string | null>(null);
|
||||
const { model, version, issues, issuesByElement } = useModelStore();
|
||||
|
||||
const stats = `SysML · ${model.blocks.length} blocks · ${model.associations.length} associations · ${model.constraints.length} constraints`;
|
||||
const subtitle = breaks.length > 0 ? `${stats} · breaks active: ${breaks.join(", ")}` : stats;
|
||||
|
||||
return (
|
||||
<div className={`shell shell-density-${density} shell-presence-${presence}`}>
|
||||
<TopBar data={data} />
|
||||
|
||||
<div className="shell-body">
|
||||
<SocratesDock projectId={projectId ?? "aristotle"} presence={presence} density={density} />
|
||||
<LeftRail
|
||||
data={data}
|
||||
focusBlockId={focusBlockId}
|
||||
setFocusBlockId={setFocusBlockId}
|
||||
issuesByElement={issuesByElement}
|
||||
/>
|
||||
|
||||
<main className="canvases">
|
||||
<section className="canvas canvas-text">
|
||||
<CanvasHeader title="Narrative" subtitle="Markup-augmented prose · synced to model" />
|
||||
<div className="canvas-scroll">
|
||||
<TextCanvas
|
||||
data={data}
|
||||
density={density}
|
||||
markupStyle={markupStyle}
|
||||
focusBlockId={focusBlockId}
|
||||
setFocusBlockId={setFocusBlockId}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div className="canvas-divider" />
|
||||
|
||||
<section className="canvas canvas-diagram">
|
||||
<CanvasHeader
|
||||
title="Model"
|
||||
subtitle={subtitle}
|
||||
right={
|
||||
<div className="canvas-actions">
|
||||
<span className="canvas-mode-pill">Fit</span>
|
||||
<span className="canvas-mode-pill canvas-mode-active">100%</span>
|
||||
<span className="canvas-mode-pill">Layout</span>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
<div className="canvas-scroll canvas-scroll-diagram">
|
||||
<DiagramCanvas
|
||||
data={data}
|
||||
density={density}
|
||||
variant={diagramStyle}
|
||||
focusBlockId={focusBlockId}
|
||||
onSelect={setFocusBlockId}
|
||||
issuesByElement={issuesByElement}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<StatusBar data={data} />
|
||||
|
||||
<IssuesPanel issues={issues} onSelectAnchor={id => setFocusBlockId(id)} />
|
||||
<FindingsPanel
|
||||
projectId={projectId ?? "aristotle"}
|
||||
modelVersion={version}
|
||||
onSelectAnchor={id => setFocusBlockId(id)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user