agentgui 1.0.102 → 1.0.103

package/.prd

@@ -0,0 +1,336 @@
+# PRD: Real-time Streaming Architecture & HTML Response Rendering
+
+## Vision
+Transform agentgui from a "save-on-complete" model to a "stream-as-it-happens" model where:
+1. Real-time stream chunks are persisted to DB immediately as they arrive
+2. Client views always pull from persisted chunks (not ephemeral process output)
+3. Conversation state survives page refresh and multi-tab viewing
+4. Agent thoughts/responses rendered as beautiful semantic HTML (not JSON)
+5. System remains the same whether viewing live stream or historical conversation
+
+## Critical Problems Being Solved
+
+### Problem 1: Conversation State Loss on Refresh
+**Current**: Viewing live execution → refresh page → conversation disappears
+**Why**: Stream chunks exist only in memory during execution, saved as single JSON when done
+**Solution**: Persist each chunk to DB immediately as it arrives from stream
+
+### Problem 2: Dual View Inconsistency
+**Current**: Same conversation looks different when live vs after completion
+**Why**: Live view shows individual streaming blocks, complete view shows condensed JSON
+**Solution**: Single source of truth = DB chunks. No special handling for "done" state
+
+### Problem 3: No Multi-Tab Support
+**Current**: Can't view same conversation in two browser tabs simultaneously
+**Why**: No persistent state, live process is ephemeral
+**Solution**: DB persistence means any tab can view same chunks at any time
+
+### Problem 4: HTML Output Not Distinguished from Files
+**Current**: System prompt says "output HTML" but unclear if it means response HTML or file writes
+**Why**: Ambiguous instruction in system prompt
+**Solution**: Make explicit: Agent HTML responses ≠ file operations. Only HTML rendering for display
+
+### Problem 5: Process Completion Creates Artifacts
+**Current**: When execution finishes, entire thing re-saved as JSON blob
+**Why**: Current architecture treats completion as "finalize and persist"
+**Solution**: No special completion action. Streaming simply stops. DB already has everything.
+
+## Architecture Changes Required
+
+### 1. Stream Chunk Persistence (Core Change)
+**Current Flow**:
+```
+Claude → Stream Event → In-Memory Buffer → On Complete: Save JSON → DB
+```
+
+**New Flow**:
+```
+Claude → Stream Event → Process → Save Chunk → DB → WebSocket to Clients
+```
+
+**Implementation**:
+- Each `streaming_progress` event creates DB chunk immediately
+- Each chunk has: `id`, `sessionId`, `conversationId`, `sequence`, `type`, `data`, `created_at`
+- No buffering, no aggregation, no re-saving on completion
+- Chunks table schema must support variable size chunks (BLOB or TEXT)
+
+### 2. Client Rendering from DB Only
+**Current**: Client renders from WebSocket stream events
+**New**: Client renders from DB chunks via polling/WebSocket
+**Benefit**: Same render path whether data is fresh or historical
+
+**Implementation**:
+- Add endpoint: `GET /api/conversations/:id/chunks?since=<timestamp>`
+- Returns chunks in order (sequence number)
+- Client polls every 100ms for new chunks
+- WebSocket optimization: only notify "new chunk available", don't send chunk data
+- Client always fetches from DB to keep rendering consistent
+
+### 3. HTML Response Rendering (System Prompt Change)
+**Current System Prompt**:
+```
+"Always write your responses in ripple-ui enhanced HTML"
+```
+
+**Problem**: Unclear if this is for file output or response rendering
+**Solution**: Make explicit instruction:
+```
+For user-facing responses and thoughts: Always use semantic HTML with ripple-ui components
+Do not treat this as file creation. HTML is for rendering in the UI, not saving to disk.
+Block types (text, code, thinking, etc) in your message should render as beautiful semantic HTML
+File operations (Read, Write, Edit) are separate - create actual files on disk when needed
+Distinguish clearly: HTML response rendering ≠ file write operations
+```
+
+### 4. Conversation URL State (Client Change)
+**Current**: Conversations loaded from session, URL doesn't track state
+**New**: URL contains conversation ID and session ID for deep linking
+
+**Implementation**:
+- Route: `/gm/?conversation=<conversationId>&session=<sessionId>`
+- Page refresh loads same conversation from URL
+- Each conversation maintains scroll position in localStorage
+- Deep linking enables multi-tab viewing
+
+### 5. Remove Post-Execution JSON Consolidation (Deletion)
+**Current**: When execution completes, entire response saved as consolidated JSON
+**New**: No action on completion. Stream already persisted.
+
+**Implementation**:
+- Delete code in `server.js` that creates final JSON blob on streaming_complete
+- Keep the `streaming_complete` event for UI notifications ("Finished!")
+- All message data comes from persisted chunks, not from completion blob
+
+## Dependencies & Blocking
+
+### Wave 1: Foundation (No Dependencies) - COMPLETE
+- [x] Add `chunks` table to database schema - VERIFIED
+  - Created chunks table with proper schema in database.js initSchema()
+  - All columns defined: id, sessionId, conversationId, sequence, type, data, created_at
+  - Foreign keys configured for sessionId and conversationId
+- [x] Create indexes - VERIFIED
+  - idx_chunks_session (sessionId, sequence) - non-unique
+  - idx_chunks_conversation (conversationId, sequence) - non-unique
+  - idx_chunks_unique (sessionId, sequence) - unique constraint
+- [x] Add chunk persistence methods to database.js - VERIFIED
+  - createChunk(sessionId, conversationId, sequence, type, data)
+  - getChunk(id)
+  - getSessionChunks(sessionId)
+  - getConversationChunks(conversationId)
+  - getChunksSince(sessionId, timestamp)
+  - deleteSessionChunks(sessionId)
+  - getMaxSequence(sessionId)
+- [x] Test schema creation with real database - VERIFIED
+  - Schema initializes without errors
+  - All indexes created correctly
+  - Foreign key constraints active
+  - Data persistence working
+  - Existing databases compatible (no breaking changes)
+
+### Wave 2: Backend Stream Persistence (Blocked By: Wave 1)
+- [ ] Modify `processMessageWithStreaming()` to persist chunks immediately
+- [ ] Update `onEvent` callback to save to DB before broadcasting
+- [ ] Add endpoint `GET /api/conversations/:id/chunks?since=timestamp`
+- [ ] Remove post-execution JSON consolidation code
+- [ ] Test chunk persistence with real streaming
+
+### Wave 3: Client Chunk Fetching (Blocked By: Wave 2)
+- [ ] Add `fetchChunks()` API method to client
+- [ ] Implement polling logic (100ms interval, backoff on error)
+- [ ] Integrate with existing WebSocket for notifications
+- [ ] Update message rendering to pull from chunks instead of events
+
+### Wave 4: URL State Management (Blocked By: Wave 3)
+- [ ] Add router state to track conversationId + sessionId
+- [ ] Update URL on conversation selection
+- [ ] Restore conversation from URL on page load
+- [ ] Persist scroll position per conversation
+
+### Wave 5: HTML Response System Prompt (Blocked By: Wave 4)
+- [ ] Update SYSTEM_PROMPT in server.js
+- [ ] Add explicit guidance on HTML rendering vs file operations
+- [ ] Document block type expectations
+- [ ] Add examples in prompt
+
+### Wave 6: Verification & Testing (Blocked By: Wave 5)
+- [ ] Test conversation persistence across refresh
+- [ ] Test multi-tab viewing same conversation
+- [ ] Verify streaming chunks match rendered output
+- [ ] Test URL deep linking
+- [ ] Verify no data loss during streaming
+- [ ] Test error recovery (partial streams)
+
+## Data Model
+
+### New: chunks table
+```sql
+CREATE TABLE chunks (
+  id TEXT PRIMARY KEY,
+  sessionId TEXT NOT NULL,
+  conversationId TEXT NOT NULL,
+  sequence INTEGER NOT NULL,
+  type TEXT NOT NULL, -- "text", "code", "thinking", "tool_use", "tool_result", "bash", "system", "image"
+  data BLOB NOT NULL, -- full block data as JSON
+  created_at INTEGER NOT NULL,
+  FOREIGN KEY (sessionId) REFERENCES sessions(id),
+  FOREIGN KEY (conversationId) REFERENCES conversations(id)
+);
+
+CREATE INDEX idx_chunks_session ON chunks(sessionId, sequence);
+CREATE INDEX idx_chunks_conversation ON chunks(conversationId, sequence);
+CREATE UNIQUE INDEX idx_chunks_unique ON chunks(sessionId, sequence);
+```
+
+### Modified: messages table (optional cleanup)
+- Keep as-is for message text
+- Add `chunks_id` field to reference chunk sequence (future)
+- Messages created from chunks summary, not vice versa
+
+## API Changes
+
+### New Endpoints
+```
+GET /api/conversations/:id/chunks?since=<timestamp>
+Response: [{id, sessionId, conversationId, sequence, type, data, created_at}...]
+
+GET /api/sessions/:id/chunks?since=<timestamp>
+Response: Same as above, filtered by session
+```
+
+### Modified Endpoints
+```
+POST /api/conversations/:id/messages
+- Still creates message (for conversation history)
+- But also triggers chunk persistence for streaming blocks
+- No change to request/response format
+```
+
+### Removed/Deprecated
+```
+The "save on completion" behavior in streaming_complete event
+- Keep the event for UI ("execution finished")
+- Just don't save aggregated JSON
+- Chunks already in DB from streaming
+```
+
+## System Prompt Changes
+
+### Current
+```
+Always write your responses in ripple-ui enhanced HTML. Avoid overriding
+light/dark mode CSS variables. Use all the benefits of HTML to express
+technical details with proper semantic markup, tables, code blocks, headings,
+and lists. Write clean, well-structured HTML that respects the existing
+design system.
+```
+
+### New (Clearer)
+```
+RESPONSE RENDERING:
+Your thoughts and responses are rendered as semantic HTML in the UI using
+ripple-ui components. Always structure responses with proper HTML:
+- Use headings for sections (<h2>, <h3>)
+- Use lists for sequences (<ul>, <ol>)
+- Use tables for structured data
+- Use code blocks with language tags
+- Use semantic elements: <strong>, <em>, <code>, <pre>
+- Never override CSS variables (use class names instead)
+- Respect the design system
+
+DISTINGUISH: HTML Response vs File Operations
+- HTML above is for UI rendering, not file creation
+- When you need to create files on disk: use Write, Edit, or Bash tools
+- Message blocks (text, code, thinking, tool_use) render as HTML automatically
+- File operations create actual files in the working directory
+- Do not try to "output files" as HTML in your response
+- File operations are explicit via tools, not implicit via response text
+
+BLOCK TYPES:
+Your assistant message will be parsed into blocks:
+- text: Plain text with markdown support
+- code: Code with language detection
+- thinking: Internal reasoning (expandable)
+- tool_use: Showing which tools you're calling
+- tool_result: Tool output
+- bash: Shell commands
+- system: System information
+- image: Image display
+Each block renders with semantic HTML and proper styling.
+```
+
+## Success Criteria
+
+### Data Persistence
+- [ ] Each streaming chunk persists to DB within 100ms of arrival
+- [ ] No data loss during interrupted streams
+- [ ] Chunks survive server restart
+- [ ] Multiple streams don't corrupt chunk sequence
+
+### Client Behavior
+- [ ] Page refresh shows same conversation state
+- [ ] Same conversation visible in two tabs simultaneously
+- [ ] Scroll position preserved per conversation
+- [ ] URL deep linking works (share link to specific conversation)
+
+### Rendering Consistency
+- [ ] Live stream looks identical to historical view
+- [ ] No "loading from JSON" artifacts
+- [ ] HTML rendering of blocks is semantic and beautiful
+- [ ] Dark mode works for all response blocks
+
+### Performance
+- [ ] Chunk polling adds <50ms latency to visibility
+- [ ] DB queries for chunks return in <100ms (with index)
+- [ ] No memory leaks from chunk history
+- [ ] WebSocket still efficient (only notifications, not data)
+
+### System Prompt Clarity
+- [ ] Agent clearly distinguishes HTML response rendering from file operations
+- [ ] Block types documented and understood
+- [ ] No confusion between "output HTML" and "write HTML file"
+
+## Implementation Notes
+
+### Chunk Persistence Strategy
+- Use database transaction: Insert chunk → Broadcast event → Return
+- If insert fails, retry up to 3 times with exponential backoff
+- If all retries fail, log error but don't crash (supervisor catches)
+- Broadcast only happens after successful DB insert
+
+### Client Polling Implementation
+- Use `AbortController` for request cancellation
+- Exponential backoff on errors: 100ms → 200ms → 400ms → reset after success
+- Single active poll at a time (debounce overlapping requests)
+- Stop polling when stream ends (flag in UI)
+- Resume polling on reconnect
+
+### URL State Strategy
+- Use `pushState()` not hash (cleaner URLs, better for sharing)
+- Encode: `?conversation=<id>&session=<id>`
+- Validate IDs on load (prevent XSS)
+- Graceful fallback if invalid (show conversation list)
+
+### Backward Compatibility
+- Old conversations with JSON blob still work (handled by rendering layer)
+- New conversations use chunks table
+- No migration needed (can run dual path for period of time)
+- Eventually clean up JSON blob from old messages
+
+## Unknowns to Validate
+
+- [ ] Chunk size distribution (average, max, min)
+- [ ] Polling latency impact on perceived freshness
+- [ ] Database performance with high-frequency chunk inserts
+- [ ] Memory usage with large conversation histories
+- [ ] Browser storage limits for scroll position tracking
+- [ ] Concurrent chunk arrivals in same session (race conditions)
+
+## Open Questions
+
+1. Should chunk sequence be per-session or global? → Per-session (cleaner transactions)
+2. Should chunks include metadata about which tool produced them? → Yes (for tracing)
+3. Should we compress chunks in DB or store raw? → Raw (compression adds latency)
+4. How long to keep polling before deciding stream ended? → 5 seconds without activity
+5. Should old JSON blob messages be migrated to chunks? → Lazy migration on view
+
+## No Pending Work Items (Ready for Execution)

package/database.js

@@ -105,6 +105,22 @@ function initSchema() {
 
     CREATE INDEX IF NOT EXISTS idx_stream_updates_session ON stream_updates(sessionId);
     CREATE INDEX IF NOT EXISTS idx_stream_updates_created ON stream_updates(created_at);
+
+    CREATE TABLE IF NOT EXISTS chunks (
+      id TEXT PRIMARY KEY,
+      sessionId TEXT NOT NULL,
+      conversationId TEXT NOT NULL,
+      sequence INTEGER NOT NULL,
+      type TEXT NOT NULL,
+      data BLOB NOT NULL,
+      created_at INTEGER NOT NULL,
+      FOREIGN KEY (sessionId) REFERENCES sessions(id),
+      FOREIGN KEY (conversationId) REFERENCES conversations(id)
+    );
+
+    CREATE INDEX IF NOT EXISTS idx_chunks_session ON chunks(sessionId, sequence);
+    CREATE INDEX IF NOT EXISTS idx_chunks_conversation ON chunks(conversationId, sequence);
+    CREATE UNIQUE INDEX IF NOT EXISTS idx_chunks_unique ON chunks(sessionId, sequence);
   `);
 }
 
@@ -883,6 +899,111 @@ export const queries = {
     }
 
     return imported;
+  },
+
+  createChunk(sessionId, conversationId, sequence, type, data) {
+    const id = generateId('chunk');
+    const now = Date.now();
+    const dataBlob = typeof data === 'string' ? data : JSON.stringify(data);
+
+    const stmt = db.prepare(
+      `INSERT INTO chunks (id, sessionId, conversationId, sequence, type, data, created_at)
+       VALUES (?, ?, ?, ?, ?, ?, ?)`
+    );
+    stmt.run(id, sessionId, conversationId, sequence, type, dataBlob, now);
+
+    return {
+      id,
+      sessionId,
+      conversationId,
+      sequence,
+      type,
+      data,
+      created_at: now
+    };
+  },
+
+  getChunk(id) {
+    const stmt = db.prepare(
+      `SELECT id, sessionId, conversationId, sequence, type, data, created_at FROM chunks WHERE id = ?`
+    );
+    const row = stmt.get(id);
+    if (!row) return null;
+
+    try {
+      return {
+        ...row,
+        data: typeof row.data === 'string' ? JSON.parse(row.data) : row.data
+      };
+    } catch (e) {
+      return row;
+    }
+  },
+
+  getSessionChunks(sessionId) {
+    const stmt = db.prepare(
+      `SELECT id, sessionId, conversationId, sequence, type, data, created_at
+       FROM chunks WHERE sessionId = ? ORDER BY sequence ASC`
+    );
+    const rows = stmt.all(sessionId);
+    return rows.map(row => {
+      try {
+        return {
+          ...row,
+          data: typeof row.data === 'string' ? JSON.parse(row.data) : row.data
+        };
+      } catch (e) {
+        return row;
+      }
+    });
+  },
+
+  getConversationChunks(conversationId) {
+    const stmt = db.prepare(
+      `SELECT id, sessionId, conversationId, sequence, type, data, created_at
+       FROM chunks WHERE conversationId = ? ORDER BY created_at ASC`
+    );
+    const rows = stmt.all(conversationId);
+    return rows.map(row => {
+      try {
+        return {
+          ...row,
+          data: typeof row.data === 'string' ? JSON.parse(row.data) : row.data
+        };
+      } catch (e) {
+        return row;
+      }
+    });
+  },
+
+  getChunksSince(sessionId, timestamp) {
+    const stmt = db.prepare(
+      `SELECT id, sessionId, conversationId, sequence, type, data, created_at
+       FROM chunks WHERE sessionId = ? AND created_at > ? ORDER BY sequence ASC`
+    );
+    const rows = stmt.all(sessionId, timestamp);
+    return rows.map(row => {
+      try {
+        return {
+          ...row,
+          data: typeof row.data === 'string' ? JSON.parse(row.data) : row.data
+        };
+      } catch (e) {
+        return row;
+      }
+    });
+  },
+
+  deleteSessionChunks(sessionId) {
+    const stmt = db.prepare('DELETE FROM chunks WHERE sessionId = ?');
+    const result = stmt.run(sessionId);
+    return result.changes || 0;
+  },
+
+  getMaxSequence(sessionId) {
+    const stmt = db.prepare('SELECT MAX(sequence) as max FROM chunks WHERE sessionId = ?');
+    const result = stmt.get(sessionId);
+    return result?.max ?? -1;
   }
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.102",
+  "version": "1.0.103",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "server.js",

package/server.js

@@ -292,6 +292,38 @@ const server = http.createServer(async (req, res) => {
       return;
     }
 
+    const conversationChunksMatch = pathOnly.match(/^\/api\/conversations\/([^/]+)\/chunks$/);
+    if (conversationChunksMatch && req.method === 'GET') {
+      const conversationId = conversationChunksMatch[1];
+      const conv = queries.getConversation(conversationId);
+      if (!conv) { res.writeHead(404, { 'Content-Type': 'application/json' }); res.end(JSON.stringify({ error: 'Conversation not found' })); return; }
+
+      const url = new URL(req.url, 'http://localhost');
+      const since = parseInt(url.searchParams.get('since') || '0');
+
+      const allChunks = queries.getConversationChunks(conversationId);
+      debugLog(`[chunks] Conv ${conversationId}: ${allChunks.length} total chunks`);
+      const chunks = since > 0 ? allChunks.filter(c => c.created_at > since) : allChunks;
+      res.writeHead(200, { 'Content-Type': 'application/json' });
+      res.end(JSON.stringify({ ok: true, chunks }));
+      return;
+    }
+
+    const sessionChunksMatch = pathOnly.match(/^\/api\/sessions\/([^/]+)\/chunks$/);
+    if (sessionChunksMatch && req.method === 'GET') {
+      const sessionId = sessionChunksMatch[1];
+      const sess = queries.getSession(sessionId);
+      if (!sess) { res.writeHead(404, { 'Content-Type': 'application/json' }); res.end(JSON.stringify({ error: 'Session not found' })); return; }
+
+      const url = new URL(req.url, 'http://localhost');
+      const since = parseInt(url.searchParams.get('since') || '0');
+
+      const chunks = queries.getChunksSince(sessionId, since);
+      res.writeHead(200, { 'Content-Type': 'application/json' });
+      res.end(JSON.stringify({ ok: true, chunks }));
+      return;
+    }
+
     if (pathOnly.match(/^\/api\/conversations\/([^/]+)\/sessions\/latest$/) && req.method === 'GET') {
       const convId = pathOnly.match(/^\/api\/conversations\/([^/]+)\/sessions\/latest$/)[1];
       const latestSession = queries.getLatestSession(convId);
@@ -459,6 +491,31 @@ function serveFile(filePath, res) {
   });
 }
 
+function persistChunkWithRetry(sessionId, conversationId, sequence, blockType, blockData, maxRetries = 3) {
+  let lastError = null;
+  const backoffs = [100, 200, 400];
+
+  for (let attempt = 0; attempt < maxRetries; attempt++) {
+    try {
+      const chunk = queries.createChunk(sessionId, conversationId, sequence, blockType, blockData);
+      return chunk;
+    } catch (err) {
+      lastError = err;
+      debugLog(`[chunk] Persist attempt ${attempt + 1}/${maxRetries} failed: ${err.message}`);
+      if (attempt < maxRetries - 1) {
+        const delayMs = backoffs[attempt] || 400;
+        const endTime = Date.now() + delayMs;
+        while (Date.now() < endTime) {
+          // Synchronous sleep for backoff
+        }
+      }
+    }
+  }
+
+  debugLog(`[chunk] Failed to persist after ${maxRetries} retries: ${lastError?.message}`);
+  return null;
+}
+
 async function processMessageWithStreaming(conversationId, messageId, sessionId, content, agentId, skipPermissions = false) {
   const startTime = Date.now();
   activeExecutions.set(conversationId, true);
@@ -473,29 +530,40 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
 
     let allBlocks = [];
     let eventCount = 0;
+    let currentSequence = queries.getMaxSequence(sessionId) ?? -1;
 
     const onEvent = (parsed) => {
       eventCount++;
+      debugLog(`[stream] Event ${eventCount}: type=${parsed.type}`);
 
       if (parsed.type === 'system') {
+        const systemBlock = {
+          type: 'system',
+          subtype: parsed.subtype,
+          model: parsed.model,
+          cwd: parsed.cwd,
+          tools: parsed.tools,
+          session_id: parsed.session_id
+        };
+
+        currentSequence++;
+        persistChunkWithRetry(sessionId, conversationId, currentSequence, 'system', systemBlock);
+
         broadcastSync({
           type: 'streaming_progress',
           sessionId,
           conversationId,
-          block: {
-            type: 'system',
-            subtype: parsed.subtype,
-            model: parsed.model,
-            cwd: parsed.cwd,
-            tools: parsed.tools,
-            session_id: parsed.session_id
-          },
+          block: systemBlock,
           blockIndex: allBlocks.length,
           timestamp: Date.now()
         });
       } else if (parsed.type === 'assistant' && parsed.message?.content) {
         for (const block of parsed.message.content) {
           allBlocks.push(block);
+
+          currentSequence++;
+          persistChunkWithRetry(sessionId, conversationId, currentSequence, block.type || 'assistant', block);
+
           broadcastSync({
             type: 'streaming_progress',
             sessionId,
@@ -508,39 +576,50 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
       } else if (parsed.type === 'user' && parsed.message?.content) {
         for (const block of parsed.message.content) {
           if (block.type === 'tool_result') {
+            const toolResultBlock = {
+              type: 'tool_result',
+              tool_use_id: block.tool_use_id,
+              content: typeof block.content === 'string' ? block.content : JSON.stringify(block.content),
+              is_error: block.is_error || false
+            };
+
+            currentSequence++;
+            persistChunkWithRetry(sessionId, conversationId, currentSequence, 'tool_result', toolResultBlock);
+
             broadcastSync({
               type: 'streaming_progress',
               sessionId,
               conversationId,
-              block: {
-                type: 'tool_result',
-                tool_use_id: block.tool_use_id,
-                content: typeof block.content === 'string' ? block.content : JSON.stringify(block.content),
-                is_error: block.is_error || false
-              },
+              block: toolResultBlock,
               blockIndex: allBlocks.length,
               timestamp: Date.now()
             });
           }
         }
       } else if (parsed.type === 'result') {
+        const resultBlock = {
+          type: 'result',
+          subtype: parsed.subtype,
+          duration_ms: parsed.duration_ms,
+          total_cost_usd: parsed.total_cost_usd,
+          num_turns: parsed.num_turns,
+          is_error: parsed.is_error || false,
+          result: parsed.result
+        };
+
+        currentSequence++;
+        persistChunkWithRetry(sessionId, conversationId, currentSequence, 'result', resultBlock);
+
         broadcastSync({
           type: 'streaming_progress',
           sessionId,
           conversationId,
-          block: {
-            type: 'result',
-            subtype: parsed.subtype,
-            duration_ms: parsed.duration_ms,
-            total_cost_usd: parsed.total_cost_usd,
-            num_turns: parsed.num_turns,
-            is_error: parsed.is_error || false,
-            result: parsed.result
-          },
+          block: resultBlock,
           blockIndex: allBlocks.length,
           isResult: true,
           timestamp: Date.now()
         });
+
         if (parsed.result && allBlocks.length === 0) {
           allBlocks.push({ type: 'text', text: String(parsed.result) });
         }
@@ -566,42 +645,13 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
       debugLog(`[stream] Stored claudeSessionId=${claudeSessionId}`);
     }
 
-    let messageContent = null;
-    if (allBlocks.length > 0) {
-      messageContent = JSON.stringify({
-        type: 'claude_execution',
-        blocks: allBlocks,
-        timestamp: Date.now()
-      });
-    } else {
-      let textParts = [];
-      for (const output of outputs) {
-        if (output.type === 'result' && output.result) {
-          textParts.push(String(output.result));
-        } else if (typeof output === 'string') {
-          textParts.push(output);
-        }
-      }
-      messageContent = textParts.join('\n').trim();
-    }
-
-    if (messageContent) {
-      const assistantMessage = queries.createMessage(conversationId, 'assistant', messageContent);
-      broadcastSync({
-        type: 'streaming_complete',
-        sessionId,
-        conversationId,
-        messageId: assistantMessage.id,
-        eventCount,
-        timestamp: Date.now()
-      });
-      broadcastSync({
-        type: 'message_created',
-        conversationId,
-        message: assistantMessage,
-        timestamp: Date.now()
-      });
-    }
+    broadcastSync({
+      type: 'streaming_complete',
+      sessionId,
+      conversationId,
+      eventCount,
+      timestamp: Date.now()
+    });
 
     debugLog(`[stream] Completed: ${outputs.length} outputs, ${eventCount} events`);
   } catch (error) {