experiment: organise workspace into cognitive zones
This commit is contained in:
@@ -656,36 +656,27 @@ export default function ReasoningWorkspace({
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
{/* ── Investigation summary card — always full-width ─────────── */}
|
||||
<InvestigationSummaryPanel graph={graph} selectedQuestion={selectedQ} result={result} updateStatus={updateStatus} />
|
||||
{/* ═══════════════ ZONE 1 — Active work ═══════════════ */}
|
||||
<div className="space-y-6">
|
||||
|
||||
{/* Active workspace — primary focus, full-width column ─────── */}
|
||||
{hasSelectedQuestion && (
|
||||
<>
|
||||
<CurrentInvestigationCard selectedQuestion={selectedQ} graph={graph} />
|
||||
</>
|
||||
)}
|
||||
{/* Investigation status & context — desktop: two-column; mobile: stacked */}
|
||||
<div className="grid grid-cols-1 gap-6 md:grid-cols-3">
|
||||
<InvestigationSummaryPanel graph={graph} selectedQuestion={selectedQ} result={result} updateStatus={updateStatus} />
|
||||
<div className="md:col-span-2">
|
||||
{hasSelectedQuestion && (
|
||||
<>
|
||||
<CurrentInvestigationCard selectedQuestion={selectedQ} graph={graph} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Post-update acknowledgement — only after success, never during loading */}
|
||||
{updateStatus === "success" && !isUpdating && <UpdateAcknowledgement updateResult={result} />}
|
||||
{/* Post-update acknowledgement */}
|
||||
{updateStatus === "success" && !isUpdating && <UpdateAcknowledgement updateResult={result} />}
|
||||
|
||||
{/* ══════════════════════════════════════════════════════════
|
||||
FACILITATED INVESTIGATION WORKSPACE — PHASE 4 EXPLORATION
|
||||
══════════════════════════════════════════════════════════
|
||||
|
||||
Layout metaphor: a workshop desk, not a document.
|
||||
|
||||
Desktop: wide work surfaces organised by cognitive activity.
|
||||
Tablet: simplified two-zone layout.
|
||||
Mobile: naturally stacked.
|
||||
══════════════════════════════════════════════════════════ */}
|
||||
|
||||
{hasSelectedQuestion ? (
|
||||
|
||||
<>
|
||||
{/* ── Active workspace zone (Question + Response) ───────── */}
|
||||
{/* Active workspace (Question + Response) — full-width column */}
|
||||
{hasSelectedQuestion ? (
|
||||
<div className="space-y-6">
|
||||
|
||||
{isUpdating && (
|
||||
<LoadingOverlay
|
||||
isLoading={true}
|
||||
@@ -725,54 +716,45 @@ export default function ReasoningWorkspace({
|
||||
</div>
|
||||
</form>
|
||||
)}
|
||||
</div>
|
||||
) : status === "success" ? (
|
||||
<>
|
||||
{/* Terminal state */}
|
||||
{genuineCompletion && (
|
||||
<CompletionCard summary={resolveCurrentSummary(propUnderstanding || graph?.currentSummary || result?.updatedSituationGraph?.currentSummary)} />
|
||||
)}
|
||||
{!genuineCompletion && (
|
||||
<EvidenceLimitCard summary={resolveCurrentSummary(propUnderstanding || graph?.currentSummary || result?.updatedSituationGraph?.currentSummary)} />
|
||||
)}
|
||||
</>
|
||||
) : null}
|
||||
|
||||
{/* ═══════════════ ZONE 2 — Shared understanding ═══════════════ */}
|
||||
{hasSelectedQuestion && hasCurrentSummaryCondition && (
|
||||
<div className="grid grid-cols-1 gap-6 lg:grid-cols-3">
|
||||
<div className="lg:col-span-2">
|
||||
<CurrentUnderstandingCard currentSummary={graph?.currentSummary || result?.updatedSituationGraph?.currentSummary} plainLanguage={propUnderstanding || null} />
|
||||
</div>
|
||||
|
||||
{/* ── Supporting workspace (Understanding, Map, Situation) ─ */}
|
||||
<div className="grid grid-cols-1 gap-6 lg:grid-cols-5">
|
||||
|
||||
{/* Understanding — wider surface (2 cols) */}
|
||||
{hasCurrentSummaryCondition && (
|
||||
<div className="lg:col-span-2">
|
||||
<CurrentUnderstandingCard currentSummary={graph?.currentSummary || result?.updatedSituationGraph?.currentSummary} plainLanguage={propUnderstanding || null} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Investigation Map — workspace artefact (1.5 cols) */}
|
||||
{hasSelectedQuestion && (
|
||||
<div className="lg:col-span-1">
|
||||
<InvestigationMap turnCount={investigationHistory.length} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="lg:col-span-1">
|
||||
<InvestigationMap turnCount={investigationHistory.length} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</>
|
||||
|
||||
) : status === "success" ? (
|
||||
|
||||
<>
|
||||
{/* Terminal state */}
|
||||
{genuineCompletion && (
|
||||
<CompletionCard summary={resolveCurrentSummary(propUnderstanding || graph?.currentSummary || result?.updatedSituationGraph?.currentSummary)} />
|
||||
)}
|
||||
{!genuineCompletion && (
|
||||
<EvidenceLimitCard summary={resolveCurrentSummary(propUnderstanding || graph?.currentSummary || result?.updatedSituationGraph?.currentSummary)} />
|
||||
)}
|
||||
</>
|
||||
|
||||
) : null}
|
||||
|
||||
|
||||
{/* ── Reference row — Situation + History side-by-side on desktop ─ */}
|
||||
<div className="grid grid-cols-1 gap-6 md:grid-cols-2">
|
||||
<OriginalSituation scenario={scenario} centralStatement={graph?.centralStatement} />
|
||||
{/* ═══════════════ ZONE 3 — Reference and record ═══════════════ */}
|
||||
<div className="grid grid-cols-1 gap-6 md:grid-cols-3">
|
||||
<div className="md:col-span-1">
|
||||
<OriginalSituation scenario={scenario} centralStatement={graph?.centralStatement} />
|
||||
</div>
|
||||
{investigationHistory.length > 0 && (
|
||||
<InvestigationHistory turns={investigationHistory} />
|
||||
<div className="md:col-span-2">
|
||||
<InvestigationHistory turns={investigationHistory} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* ── Developer details (collapsed by default, always below) ── */}
|
||||
{/* Developer details — full-width beneath reference row */}
|
||||
{(status === "success" || status === "error") && graph && (
|
||||
<DeveloperDetails
|
||||
graph={graph}
|
||||
|
||||
Reference in New Issue
Block a user