fix(app): guard diffs against non-array values to prevent .map() crash

The SessionReview component crashes with TypeError: e.diffs.map is not
a function when props.diffs is not an array. This happens when SolidJS
reconcile or API responses produce non-array values (e.g. {} from
keyed reconcile on undefined store slots, or unexpected API responses).

Added Array.isArray guards at 6 layers:
- session-review.tsx: safe() wrapper around props.diffs usage
- session-side-panel.tsx: guard props.diffs() in diffFiles and kinds
- session.tsx: guard reviewDiffs memo return and loadVcs result
- event-reducer.ts: guard SSE session.diff event data
- sync.tsx: guard session diff API response

Root cause: the git-backed review modes feature (35350b1) changed
the default changes mode from 'session' to 'git' and introduced VCS
diff loading via API. Edge cases in VCS API responses or reconcile
on uninitialized store slots can produce non-array values that bypass
the ?? [] fallback (which only catches null/undefined, not {}).

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: 2 people

packages/app/src/context/global-sync/event-reducer.ts

@@ -169,7 +169,8 @@ export function applyDirectoryEvent(input: {
     }
     case "session.diff": {
       const props = event.properties as { sessionID: string; diff: FileDiff[] }
-      input.setStore("session_diff", props.sessionID, reconcile(props.diff, { key: "file" }))
+      const safe = Array.isArray(props.diff) ? props.diff : []
+      input.setStore("session_diff", props.sessionID, reconcile(safe, { key: "file" }))
       break
     }
     case "todo.updated": {

packages/app/src/context/sync.tsx

@@ -510,7 +510,8 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
           return runInflight(inflightDiff, key, () =>
             retry(() => client.session.diff({ sessionID })).then((diff) => {
               if (!tracked(directory, sessionID)) return
-              setStore("session_diff", sessionID, reconcile(diff.data ?? [], { key: "file" }))
+              const safe = Array.isArray(diff.data) ? diff.data : []
+              setStore("session_diff", sessionID, reconcile(safe, { key: "file" }))
             }),
           )
         },

packages/app/src/pages/session.tsx

@@ -619,7 +619,8 @@ export default function Page() {
       .diff({ mode })
       .then((result) => {
         if (vcsRun.get(mode) !== run) return
-        setVcs("diff", mode, result.data ?? [])
+        const safe = Array.isArray(result.data) ? result.data : []
+        setVcs("diff", mode, safe)
         setVcs("ready", mode, true)
       })
       .catch((error) => {
@@ -676,10 +677,15 @@ export default function Page() {
     if (store.changes === "git" || store.changes === "branch") return store.changes
   })
   const reviewDiffs = createMemo(() => {
-    if (store.changes === "git") return vcs.diff.git
-    if (store.changes === "branch") return vcs.diff.branch
-    if (store.changes === "session") return diffs()
-    return turnDiffs()
+    const pick =
+      store.changes === "git"
+        ? vcs.diff.git
+        : store.changes === "branch"
+          ? vcs.diff.branch
+          : store.changes === "session"
+            ? diffs()
+            : turnDiffs()
+    return Array.isArray(pick) ? pick : []
   })
   const reviewCount = createMemo(() => {
     if (store.changes === "git") return vcs.diff.git.length

packages/app/src/pages/session/session-side-panel.tsx

@@ -58,7 +58,11 @@ export function SessionSidePanel(props: {
   })
   const treeWidth = createMemo(() => (fileOpen() ? `${layout.fileTree.width()}px` : "0px"))
 
-  const diffFiles = createMemo(() => props.diffs().map((d) => d.file))
+  const diffFiles = createMemo(() => {
+    const raw = props.diffs()
+    const list = Array.isArray(raw) ? raw : []
+    return list.map((d) => d.file)
+  })
   const kinds = createMemo(() => {
     const merge = (a: "add" | "del" | "mix" | undefined, b: "add" | "del" | "mix") => {
       if (!a) return b
@@ -68,8 +72,10 @@ export function SessionSidePanel(props: {
 
     const normalize = (p: string) => p.replaceAll("\\\\", "/").replace(/\/+$/, "")
 
+    const raw = props.diffs()
+    const list = Array.isArray(raw) ? raw : []
     const out = new Map<string, "add" | "del" | "mix">()
-    for (const diff of props.diffs()) {
+    for (const diff of list) {
       const file = normalize(diff.file)
       const kind = diff.status === "added" ? "add" : diff.status === "deleted" ? "del" : "mix"
 

packages/ui/bunfig.toml

@@ -0,0 +1,6 @@
+jsx = "react-jsx"
+jsxImportSource = "solid-js"
+conditions = ["browser"]
+
+[test]
+preload = ["./happydom.ts"]

packages/ui/happydom.ts

@@ -0,0 +1,3 @@
+import { GlobalRegistrator } from "@happy-dom/global-registrator"
+
+GlobalRegistrator.register()

packages/ui/src/components/session-review.test.tsx

@@ -0,0 +1,32 @@
+import { describe, expect, test } from "bun:test"
+
+/**
+ * The `safe()` guard in SessionReview prevents:
+ *   TypeError: e.diffs.map is not a function
+ * when props.diffs is not an array (e.g. from reconcile edge cases or unexpected API data).
+ *
+ * Guard: `Array.isArray(props.diffs) ? props.diffs : []`
+ */
+describe("session-review diffs guard", () => {
+  const guard = (v: unknown) => (Array.isArray(v) ? v : [])
+
+  test("returns [] for non-array inputs", () => {
+    expect(guard(undefined)).toEqual([])
+    expect(guard(null)).toEqual([])
+    expect(guard({})).toEqual([])
+    expect(guard("string")).toEqual([])
+    expect(guard(42)).toEqual([])
+  })
+
+  test("passes through valid arrays", () => {
+    const diffs = [{ file: "a.ts", before: "", after: "x", additions: 1, deletions: 0, status: "added" }]
+    expect(guard(diffs)).toBe(diffs)
+    expect(guard([])).toEqual([])
+  })
+
+  test(".map() works on guarded value", () => {
+    expect(() => guard(undefined).map((d: any) => d.file)).not.toThrow()
+    expect(() => guard({}).map((d: any) => d.file)).not.toThrow()
+    expect(guard(undefined).map((d: any) => d.file)).toEqual([])
+  })
+})

packages/ui/src/components/session-review.tsx

@@ -154,9 +154,10 @@ export const SessionReview = (props: SessionReviewProps) => {
   const commenting = () => store.commenting
   const opened = () => store.opened
 
+  const safe = () => (Array.isArray(props.diffs) ? props.diffs : [])
   const open = () => props.open ?? store.open
-  const files = createMemo(() => props.diffs.map((diff) => diff.file))
-  const diffs = createMemo(() => new Map(props.diffs.map((diff) => [diff.file, diff] as const)))
+  const files = createMemo(() => safe().map((diff) => diff.file))
+  const diffs = createMemo(() => new Map(safe().map((diff) => [diff.file, diff] as const)))
   const grouped = createMemo(() => {
     const next = new Map<string, SessionReviewComment[]>()
     for (const comment of props.comments ?? []) {
@@ -359,7 +360,7 @@ export const SessionReview = (props: SessionReviewProps) => {
           <Show when={hasDiffs()} fallback={props.empty}>
             <div class="pb-6">
               <Accordion multiple value={open()} onChange={handleChange}>
-                <For each={props.diffs}>
+                <For each={safe()}>
                   {(diff) => {
                     let wrapper: HTMLDivElement | undefined
                     const file = diff.file