agentgui 1.0.927 → 1.0.929

package/AGENTS.md

@@ -104,3 +104,13 @@ Paired changes:
 - better-sqlite3 bumped ^12.6.2 → ^12.9.0
 
 bun start was already working (bun has native sqlite support via `bun:sqlite`). The node path was broken due to the missing native binding. Only compile from source fixes the node path.
+
+## webjsx applyDiff Array Keying (2026-05-04)
+
+**Children arrays that mix keyed VElements with raw text/numbers crash in `vendor/webjsx/applyDiff.js`.**
+
+`webjsx` requires all siblings in an array prop (children, right, left, breadcrumbs, etc.) to either ALL be VElements with keys or ALL be non-keyed. Passing `Crumb({ right: [h('span', { key: 'a' }, 'A'), h('span', { key: 'b' }, 'B'), '● connected'] })` crashes on render with `TypeError: Cannot read properties of undefined (reading 'key')` at line 247420.js when the render loop tries to read `.key` on the bare string.
+
+Fix: wrap any bare strings as keyed VElements: `h('span', { key: 'dot' }, '● connected')`. Rule: if ANY sibling in an array has a key, ALL siblings must be VElements (no raw strings or numbers).
+
+Surfaced 2026-05-04 while validating the chat surface in `site/app/`. Fix applied to crumbRight construction in `site/app/js/app.js` view().

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.927",
+  "version": "1.0.929",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "electron/main.js",

package/site/app/js/app.js

@@ -35,7 +35,7 @@ function navTo(tab) {
 
 function view() {
   const ok = state.health.status === 'ok';
-  const dot = ok ? '● connected' : '○ offline';
+  const dot = h('span', { key: 'dot' }, ok ? '● connected' : '○ offline');
 
   const topbar = Topbar({
     brand: 'agentgui',
@@ -45,10 +45,28 @@ function view() {
     onNav: (label) => navTo(label),
   });
 
+  const crumbRight = state.tab === 'chat'
+    ? [
+        h('select', {
+            key: 'modelsel',
+            onchange: (e) => { state.selectedModel = e.target.value; render(); },
+          },
+          h('option', { key: '__', value: '' }, '— model —'),
+          ...state.models.map(m =>
+            h('option', { key: m.id, value: m.id, selected: m.id === state.selectedModel }, m.id)
+          ),
+        ),
+        state.chat.busy
+          ? h('a', { key: 'stop', onclick: cancelChat, style: 'cursor:pointer' }, '◼ stop')
+          : h('a', { key: 'new',  onclick: newChat,    style: 'cursor:pointer' }, '+ new'),
+        dot,
+      ]
+    : [dot];
+
   const crumb = Crumb({
     trail: ['agentgui'],
     leaf: state.tab,
-    right: [dot],
+    right: crumbRight,
   });
 
   const navSide = Side({
@@ -92,26 +110,6 @@ function chatMain() {
     parts: [{ kind: 'text', text: m.content || '' }],
   }));
 
-  const modelPanel = Panel({
-    title: 'model',
-    children: h('div', { class: 'ds-section' },
-      h('select', {
-          value: state.selectedModel,
-          onchange: (e) => { state.selectedModel = e.target.value; render(); },
-        },
-        h('option', { value: '' }, '— choose model —'),
-        ...state.models.map(m =>
-          h('option', { value: m.id, selected: m.id === state.selectedModel }, m.id)
-        ),
-      ),
-      h('p', { class: 'lede' },
-        state.chat.busy
-          ? h('button', { onclick: cancelChat }, '◼ stop')
-          : h('button', { onclick: newChat },    '+ new chat'),
-      ),
-    ),
-  });
-
   const composer = ChatComposer({
     value: state.chat.draft,
     disabled: state.chat.busy,
@@ -121,21 +119,12 @@ function chatMain() {
   });
 
   return [
-    h('div', { class: 'ds-section' },
-      h('h1', {}, '# ' + (state.selectedModel || 'agent')),
-      h('p', { class: 'lede' },
-        state.chat.messages.length
-          ? state.chat.messages.length + ' messages in this thread'
-          : 'start a conversation with the selected model.',
-      ),
-      modelPanel,
-      Chat({
-        title: state.selectedModel || 'agent',
-        sub: state.chat.busy ? 'streaming…' : (state.chat.messages.length + ' messages'),
-        messages: msgs,
-        composer,
-      }),
-    ),
+    Chat({
+      title: state.selectedModel || 'agent',
+      sub: state.chat.busy ? 'streaming…' : (state.chat.messages.length + ' messages'),
+      messages: msgs,
+      composer,
+    }),
   ];
 }