test(ui): explore passive branch result indication

components/scenario-form.jsx

@@ -4,6 +4,7 @@ import React, { useEffect } from "react";
 import { useState, useRef, useMemo } from "react";
 import DiagnosticsView from "@/components/diagnostics-view";
 import ReasoningWorkspace, { LoadingOverlay, ContinueLaterBanner } from "@/components/reasoning-workspace";
+import ExperimentalBranchSwitcher, { PulseStyle } from "@/components/experimental/branch-switcher";
 import { mockFetch, AVAILABLE_SCENARIOS } from "@/lib/mocks/confidence-engine/mock-client";
 
 /* Compile-time env resolution — NEXT_PUBLIC_ vars are injected by Next.js at build */
@@ -221,6 +222,28 @@ export default function ScenarioForm() {
   const [hideFacilitatorOnLanding, setHideFacilitatorOnLanding] = useState(false);
   const textareaRef = useRef(null);
 
+  /* ── RTO.25A — passive late-result branch switcher (experimental) ── */
+
+  const BRANCHES = [
+    { id: "branch-a", label: "Competitor development" },
+    { id: "branch-b", label: "Customer demand" },
+  ];
+
+  const [activeBranchId, setActiveBranchId] = useState("branch-b");
+  const [branchNewResults, setBranchNewResults] = useState({});
+
+  // Simulate a late semantic result arriving on Branch A ~2s after a graph loads
+  useEffect(() => {
+    if (status !== "success" && status !== "error") return;
+    // Only simulate once per graph load
+    if (branchNewResults["branch-a"]) return;
+
+    const timer = setTimeout(() => {
+      setBranchNewResults((prev) => ({ ...prev, "branch-a": true }));
+    }, 2000);
+    return () => clearTimeout(timer);
+  }, [status, branchNewResults]);
+
   /* Restore persisted session on mount (Phase 3) ─────────── */
   useEffect(() => {
     if (typeof window === "undefined") return;
@@ -507,35 +530,58 @@ export default function ScenarioForm() {
 
       {/* ── Main result workspace ─────────────────────── */}
       {((status === "success" || status === "error") && status !== "loading") && (
-        <ReasoningWorkspace
-          scenario={scenario}
-          status={status}
-          updateStatus={updateStatus}
-          currentUnderstanding={currentUnderstanding}
-          result={{
-            ...(result || {}),
-            situationGraph: updateResult?.updatedSituationGraph ?? result?.situationGraph,
-            selectedQuestion: updateResult?.selectedQuestion ?? result?.selectedQuestion,
-            newlySurfacedNodeIds: result?.newlySurfacedNodeIds || [],
-            diagnostics: result?.diagnostics || null,
-            updateError,
-          }}
-          answer={answer}
-          setAnswer={setAnswer}
-          onAnswerSubmit={handleUpdate}
-          lastSubmittedAnswer={lastSubmittedAnswer}
-          onRestart={() => {
-            clearSession();
-            setStatus("idle");
-            setResult(null);
-            setAnswer("");
-            setUpdateStatus("idle");
-            setUpdateResult(null);
-            setLastSubmittedAnswer("");
-            setCurrentUnderstanding(null);
-            setUpdateError(null);
-          }}
-        />
+        <>
+          <PulseStyle />
+          <div className="grid grid-cols-1 gap-6 lg:grid-cols-4">
+            {/* Workspace (3/4) */}
+            <div className="lg:col-span-3">
+              <ReasoningWorkspace
+                scenario={scenario}
+                status={status}
+                updateStatus={updateStatus}
+                currentUnderstanding={currentUnderstanding}
+                result={{
+                  ...(result || {}),
+                  situationGraph: updateResult?.updatedSituationGraph ?? result?.situationGraph,
+                  selectedQuestion: updateResult?.selectedQuestion ?? result?.selectedQuestion,
+                  newlySurfacedNodeIds: result?.newlySurfacedNodeIds || [],
+                  diagnostics: result?.diagnostics || null,
+                  updateError,
+                }}
+                answer={answer}
+                setAnswer={setAnswer}
+                onAnswerSubmit={handleUpdate}
+                lastSubmittedAnswer={lastSubmittedAnswer}
+                onRestart={() => {
+                  clearSession();
+                  setStatus("idle");
+                  setResult(null);
+                  setAnswer("");
+                  setUpdateStatus("idle");
+                  setUpdateResult(null);
+                  setLastSubmittedAnswer("");
+                  setCurrentUnderstanding(null);
+                  setUpdateError(null);
+                }}
+              />
+            </div>
+
+            {/* Branch switcher (1/4 sidebar) */}
+            <div className="lg:col-span-1">
+              <ExperimentalBranchSwitcher
+                branches={BRANCHES}
+                activeBranchId={activeBranchId}
+                branchNewResults={branchNewResults}
+                onBranchSelect={(id) => {
+                  /* User intentionally navigates — nothing more */
+                  if (id !== activeBranchId) {
+                    setActiveBranchId(id);
+                  }
+                }}
+              />
+            </div>
+          </div>
+        </>
       )}
 
       {/* ── Continue later banner when session was restored ── */}