@assistkick/create 1.32.0 → 1.34.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@assistkick/create",
-  "version": "1.32.0",
+  "version": "1.34.0",
   "description": "Scaffold assistkick-product-system into any project",
   "type": "module",
   "bin": {

package/templates/assistkick-product-system/package.json

@@ -17,7 +17,9 @@
     "remotion:render": "pnpm --filter @assistkick/video render"
   },
   "pnpm": {
-    "onlyBuiltDependencies": ["esbuild", "node-pty", "isolated-vm"]
+    "onlyBuiltDependencies": [
+      "onnxruntime-node"
+    ]
   },
   "devDependencies": {
     "@libsql/client": "^0.17.0",

package/templates/assistkick-product-system/packages/backend/src/server.ts

@@ -269,7 +269,7 @@ const chatWss = new WebSocketServer({ noServer: true });
 const chatCliBridge = new ChatCliBridge({ projectRoot: paths.projectRoot, workspacesDir: paths.workspacesDir, dataDir: paths.runtimeDataDir, log });
 const permissionService = new PermissionService({ getDb, log });
 const titleGeneratorService = new TitleGeneratorService({ log });
-const chatHandler = new ChatWsHandler({ wss: chatWss, authService, chatCliBridge, permissionService, chatMessageRepository, chatSessionService, titleGeneratorService, mcpConfigService, log });
+const chatHandler = new ChatWsHandler({ wss: chatWss, authService, chatCliBridge, permissionService, chatMessageRepository, chatSessionService, titleGeneratorService, mcpConfigService, agentService, log });
 
 // Resume any CLI sessions left running by the previous server instance
 chatHandler.resumeSessions();

package/templates/assistkick-product-system/packages/backend/src/services/chat_cli_bridge.ts

@@ -22,6 +22,26 @@ import { tmpdir } from 'node:os';
 
 export type PermissionMode = 'skip' | 'allowed_tools';
 
+/** The well-known ID for the default chat agent (seeded in migrate.ts). */
+export const CHAT_AGENT_ID = 'chat-agent-default';
+
+/** Fallback grounding used when no chat agent is found in the database. */
+const DEFAULT_CHAT_GROUNDING = `We are working on project-id {{projectId}}
+
+## Project Workspace
+The project workspace is at: {{workspacePath}}
+All file edits (write, edit, delete, create) MUST target files inside the workspace directory above.
+You may read files from anywhere in the project root for context, but all changes go into the workspace.
+
+## Git Repository Structure
+The workspace ({{workspacePath}}) has its OWN independent git repo.
+When committing and pushing changes, always use the workspace git repo, not the top-level repo.
+
+## Skills
+Project skills (e.g. assistkick-interview, assistkick-developer, etc.) are available via the Skill tool.
+To invoke a skill, always use the Skill tool (e.g. Skill with skill: "assistkick-interview"). Do NOT manually read or execute skill files — the Skill tool handles loading and execution.
+Only edit code and project files — never modify skill definition files.`;
+
 export interface ChatCliBridgeDeps {
   projectRoot: string;
   workspacesDir: string;
@@ -40,6 +60,8 @@ export interface SpawnOptions {
   continuationContext?: string;
   /** Path to a temporary MCP config JSON file to pass via --mcp-config */
   mcpConfigPath?: string;
+  /** Agent grounding template with {{placeholder}} variables. When provided, replaces the hardcoded system prompt. */
+  agentGrounding?: string;
   onEvent: (event: Record<string, unknown>) => void;
 }
 
@@ -117,7 +139,7 @@ export class ChatCliBridge {
   };
 
   buildArgs = (options: SpawnOptions): { args: string[]; systemPrompt: string | null } => {
-    const { projectId, claudeSessionId, isNewSession, permissionMode, allowedTools, continuationContext } = options;
+    const { projectId, claudeSessionId, isNewSession, permissionMode, allowedTools, continuationContext, agentGrounding } = options;
     const args: string[] = [];
     let systemPrompt: string | null = null;
 
@@ -150,22 +172,17 @@ export class ChatCliBridge {
       if (continuationContext) {
         systemParts.push(continuationContext);
       }
-      const wsPath = this.getWorkspacePath(projectId);
-      systemParts.push(`We are working on project-id ${projectId}
-
-      ## Project Workspace
-      The project workspace is at: ${wsPath}
-      All file edits (write, edit, delete, create) MUST target files inside the workspace directory above.
-      You may read files from anywhere in the project root for context, but all changes go into the workspace.
 
-      ## Git Repository Structure
-      The workspace (${wsPath}) has its OWN independent git repo.
-      When committing and pushing changes, always use the workspace git repo, not the top-level repo.
-
-      ## Skills
-      Project skills (e.g. assistkick-interview, assistkick-developer, etc.) are available via the Skill tool.
-      To invoke a skill, always use the Skill tool (e.g. Skill with skill: "assistkick-interview"). Do NOT manually read or execute skill files — the Skill tool handles loading and execution.
-      Only edit code and project files — never modify skill definition files.`);
+      const wsPath = this.getWorkspacePath(projectId);
+      const vars: Record<string, string> = { projectId, workspacePath: wsPath };
+
+      if (agentGrounding) {
+        // Use agent grounding with resolved {{placeholder}} variables
+        systemParts.push(this.resolveTemplate(agentGrounding, vars));
+      } else {
+        // Fallback: hardcoded default (should not happen once chat agent is seeded)
+        systemParts.push(this.resolveTemplate(DEFAULT_CHAT_GROUNDING, vars));
+      }
 
       systemPrompt = systemParts.join('\n\n');
       args.push('--append-system-prompt', systemPrompt);
@@ -174,6 +191,14 @@ export class ChatCliBridge {
     return { args, systemPrompt };
   };
 
+  /** Replace {{placeholder}} variables in a template string. */
+  private resolveTemplate = (template: string, vars: Record<string, string>): string => {
+    return template.replace(/\{\{(\w+)\}\}/g, (_match, key) => {
+      if (key in vars) return vars[key];
+      return `{{${key}}}`;
+    });
+  };
+
   buildEnv = (): Record<string, string> => {
     const env = { ...process.env } as Record<string, string>;
     const home = env.HOME || '/root';

package/templates/assistkick-product-system/packages/backend/src/services/chat_ws_handler.ts

@@ -12,7 +12,7 @@
  *
  * Server → Client messages:
  *   { type: 'stream_start', claudeSessionId }
- *   { type: 'stream_event', event }    — forwarded parsed stream-json event
+ *   { type: 'stream_event', event, claudeSessionId }  — forwarded parsed stream-json event
  *   { type: 'stream_end', exitCode, claudeSessionId }
  *   { type: 'stream_cancelled', claudeSessionId }  — user-initiated stop
  *   { type: 'stream_error', error }
@@ -30,6 +30,8 @@ import type { ChatMessageRepository } from './chat_message_repository.js';
 import type { ChatSessionService } from './chat_session_service.js';
 import type { TitleGeneratorService } from './title_generator_service.js';
 import type { McpConfigService } from './mcp_config_service.js';
+import type { AgentService } from './agent_service.js';
+import { CHAT_AGENT_ID } from './chat_cli_bridge.js';
 import { writeFileSync, unlinkSync } from 'node:fs';
 import { tmpdir } from 'node:os';
 import { join } from 'node:path';
@@ -43,6 +45,7 @@ export interface ChatWsHandlerDeps {
   chatSessionService?: ChatSessionService;
   titleGeneratorService?: TitleGeneratorService;
   mcpConfigService?: McpConfigService;
+  agentService?: AgentService;
   log: (tag: string, ...args: unknown[]) => void;
 }
 
@@ -90,6 +93,7 @@ export interface StreamStartMessage {
 export interface StreamEventMessage {
   type: 'stream_event';
   event: Record<string, unknown>;
+  claudeSessionId: string;
 }
 
 export interface StreamEndMessage {
@@ -243,6 +247,7 @@ export class ChatWsHandler {
   private readonly chatSessionService: ChatSessionService | null;
   private readonly titleGeneratorService: TitleGeneratorService | null;
   private readonly mcpConfigService: McpConfigService | null;
+  private readonly agentService: AgentService | null;
   private readonly log: ChatWsHandlerDeps['log'];
   private readonly activeStreams = new Map<WebSocket, Set<string>>();
 
@@ -258,7 +263,7 @@ export class ChatWsHandler {
   /** Map WebSocket connections to their authenticated user ID. */
   private readonly wsUserIds = new Map<WebSocket, string>();
 
-  constructor({ wss, authService, chatCliBridge, permissionService, chatMessageRepository, chatSessionService, titleGeneratorService, mcpConfigService, log }: ChatWsHandlerDeps) {
+  constructor({ wss, authService, chatCliBridge, permissionService, chatMessageRepository, chatSessionService, titleGeneratorService, mcpConfigService, agentService, log }: ChatWsHandlerDeps) {
     this.wss = wss;
     this.authService = authService;
     this.chatCliBridge = chatCliBridge;
@@ -267,6 +272,7 @@ export class ChatWsHandler {
     this.chatSessionService = chatSessionService || null;
     this.titleGeneratorService = titleGeneratorService || null;
     this.mcpConfigService = mcpConfigService || null;
+    this.agentService = agentService || null;
     this.log = log;
 
     // Register the permission request handler to route requests to the right WebSocket
@@ -285,7 +291,7 @@ export class ChatWsHandler {
         // Forward to connected WS (if any)
         const currentWs = this.sessionToWs.get(claudeSessionId);
         if (currentWs) {
-          this.sendWsMessage(currentWs, { type: 'stream_event', event });
+          this.sendWsMessage(currentWs, { type: 'stream_event', event, claudeSessionId });
         }
         // Accumulate content in stream context
         this.accumulateEvent(claudeSessionId, event);
@@ -524,6 +530,19 @@ export class ChatWsHandler {
       }
     }
 
+    // Load chat agent grounding from database (if available)
+    let agentGrounding: string | undefined;
+    if (isNewSession && this.agentService) {
+      try {
+        const chatAgent = await this.agentService.getById(CHAT_AGENT_ID);
+        if (chatAgent) {
+          agentGrounding = chatAgent.grounding;
+        }
+      } catch (err: any) {
+        this.log('CHAT_WS', `Failed to load chat agent grounding: ${err.message}`);
+      }
+    }
+
     try {
       const { completion, systemPrompt } = this.chatCliBridge.spawn({
         projectId,
@@ -534,11 +553,12 @@ export class ChatWsHandler {
         allowedTools: msg.allowedTools,
         continuationContext,
         mcpConfigPath,
+        agentGrounding,
         onEvent: (event) => {
           // Forward to current WS (may have been re-attached after disconnect)
           const currentWs = this.sessionToWs.get(claudeSessionId);
           if (currentWs) {
-            this.sendWsMessage(currentWs, { type: 'stream_event', event });
+            this.sendWsMessage(currentWs, { type: 'stream_event', event, claudeSessionId });
           }
           this.accumulateEvent(claudeSessionId, event);
         },
@@ -939,7 +959,7 @@ export class ChatWsHandler {
         type: 'assistant',
         message: { content: JSON.parse(ctx.lastAssistantContent) },
       };
-      this.sendWsMessage(ws, { type: 'stream_event', event: catchUpEvent });
+      this.sendWsMessage(ws, { type: 'stream_event', event: catchUpEvent, claudeSessionId });
     }
 
     this.log('CHAT_WS', `Client re-attached to in-flight stream for session ${claudeSessionId}`);

package/templates/assistkick-product-system/packages/frontend/src/components/GraphLegend.tsx

@@ -1,5 +1,5 @@
-import React, { useState, useCallback } from 'react';
-import { NODE_COLORS, EDGE_COLORS, EDGE_LABELS, LEGEND_LABELS, NODE_SHAPES, nodeShapePath } from '../constants/graph';
+import React, { useState, useCallback, useEffect } from 'react';
+import { NODE_COLORS, EDGE_COLORS, EDGE_LABELS, LEGEND_LABELS, NODE_SHAPES, nodeShapePath, DEFAULT_HIDDEN_TYPES } from '../constants/graph';
 
 interface GraphLegendProps {
   visible: boolean;
@@ -8,12 +8,19 @@ interface GraphLegendProps {
 }
 
 export function GraphLegend({ visible, onTypeToggle, onSearchChange }: GraphLegendProps) {
-  const [hiddenTypes, setHiddenTypes] = useState<Set<string>>(new Set());
+  const [hiddenTypes, setHiddenTypes] = useState<Set<string>>(() => new Set(DEFAULT_HIDDEN_TYPES));
   const [edgesCollapsed, setEdgesCollapsed] = useState(() => {
     const stored = localStorage.getItem('legend-edges-collapsed');
     return stored === null ? true : stored === 'true';
   });
 
+  // Apply default hidden types on mount
+  useEffect(() => {
+    if (hiddenTypes.size > 0) {
+      onTypeToggle(hiddenTypes);
+    }
+  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+
   const handleTypeClick = useCallback((type: string) => {
     setHiddenTypes(prev => {
       const next = new Set(prev);

package/templates/assistkick-product-system/packages/frontend/src/constants/graph.ts

@@ -16,6 +16,7 @@ export const NODE_COLORS: Record<string, string> = {
   flow: '#66d9e8',
   assumption: '#adb5bd',
   open_question: '#ffe066',
+  note: '#a9e34b',
 };
 
 export const EDGE_LABELS: Record<string, string> = {
@@ -60,6 +61,7 @@ export const TYPE_LABELS: Record<string, string> = {
   flow: 'FLOW',
   assumption: 'ASMP',
   open_question: 'OQ',
+  note: 'NOTE',
 };
 
 export const LEGEND_LABELS: Record<string, string> = {
@@ -76,6 +78,7 @@ export const LEGEND_LABELS: Record<string, string> = {
   flow: 'Flow',
   assumption: 'Assumption',
   open_question: 'Open Question',
+  note: 'Note',
 };
 
 export const NODE_SHAPES: Record<string, string> = {
@@ -92,6 +95,7 @@ export const NODE_SHAPES: Record<string, string> = {
   flow: 'arrow',
   assumption: 'triangle-down',
   open_question: 'octagon',
+  note: 'circle',
 };
 
 export const nodeShapePath = (shape: string, r: number): string => {
@@ -174,9 +178,12 @@ export const nodeShapePath = (shape: string, r: number): string => {
 export const ALL_NODE_TYPES = [
   'feature', 'epic', 'component', 'data_entity', 'decision', 'tech_choice',
   'non_functional_requirement', 'design_token', 'design_pattern',
-  'user_role', 'flow', 'assumption', 'open_question',
+  'user_role', 'flow', 'assumption', 'open_question', 'note',
 ];
 
+/** Node types hidden by default in graph visualization. */
+export const DEFAULT_HIDDEN_TYPES = new Set(['note']);
+
 export const COLUMNS = [
   { id: 'backlog', label: 'Backlog' },
   { id: 'todo', label: 'Todo' },

package/templates/assistkick-product-system/packages/frontend/src/hooks/use_chat_stream.ts

@@ -25,7 +25,7 @@ import {useRef, useState, useCallback} from 'react';
 import type {PermissionDecision} from '../components/PermissionDialog';
 import {apiClient} from '../api/client';
 import {extractContextUsage} from '../lib/context_usage_helpers';
-import {markOrCreateStreamingAssistant} from '../lib/chat_message_helpers';
+import {markOrCreateStreamingAssistant, mergeAssistantContent} from '../lib/chat_message_helpers';
 import {useChatSessionStore} from '../stores/useChatSessionStore';
 
 // --- Server → Client message types ---
@@ -38,6 +38,7 @@ interface StreamStartMessage {
 interface StreamEventMessage {
     type: 'stream_event';
     event: Record<string, unknown>;
+    claudeSessionId: string;
 }
 
 interface StreamEndMessage {
@@ -349,6 +350,8 @@ const normalizeContentBlock = (block: Record<string, unknown>): ContentBlock | n
 export const useChatStream = (): UseChatStreamReturn => {
     const wsRef = useRef<WebSocket | null>(null);
     const streamEndCallbackRef = useRef<(() => void) | null>(null);
+    /** Tracks the claudeSessionId that this hook is actively streaming for. */
+    const activeClaudeSessionRef = useRef<string | null>(null);
     const [connected, setConnected] = useState(false);
     const [streaming, setStreaming] = useState(false);
     const [messages, setMessages] = useState<ChatMessage[]>([]);
@@ -392,6 +395,8 @@ export const useChatStream = (): UseChatStreamReturn => {
 
             switch (msg.type) {
                 case 'stream_start':
+                    // Only process if this event is for our active session
+                    if (activeClaudeSessionRef.current && msg.claudeSessionId !== activeClaudeSessionRef.current) break;
                     setStreaming(true);
                     setError(null);
                     // Create an empty assistant message that will accumulate content
@@ -402,11 +407,16 @@ export const useChatStream = (): UseChatStreamReturn => {
                     break;
 
                 case 'stream_event':
+                    // Only process events for our active session — prevents cross-session leaking
+                    if (activeClaudeSessionRef.current && msg.claudeSessionId !== activeClaudeSessionRef.current) break;
                     handleStreamEvent(msg.event);
                     break;
 
                 case 'stream_end':
+                    // Only process if this event is for our active session
+                    if (activeClaudeSessionRef.current && msg.claudeSessionId !== activeClaudeSessionRef.current) break;
                     setStreaming(false);
+                    activeClaudeSessionRef.current = null;
                     // Surface error details from non-zero exit codes
                     if (msg.error) {
                         setError(msg.error);
@@ -427,7 +437,10 @@ export const useChatStream = (): UseChatStreamReturn => {
                     break;
 
                 case 'stream_cancelled':
+                    // Only process if this event is for our active session
+                    if (activeClaudeSessionRef.current && msg.claudeSessionId !== activeClaudeSessionRef.current) break;
                     setStreaming(false);
+                    activeClaudeSessionRef.current = null;
                     // Discard the partial assistant response and the triggering user message.
                     // Prepopulate the cancelled user message text for the input field.
                     setMessages(prev => {
@@ -460,6 +473,8 @@ export const useChatStream = (): UseChatStreamReturn => {
 
                 case 'stream_resumed':
                     // Re-attached to an in-flight stream after page reload or session switch.
+                    // Update active session to the one we're re-attaching to.
+                    activeClaudeSessionRef.current = msg.claudeSessionId;
                     // Mark the last assistant message as streaming so new events update it.
                     // If no assistant message exists (e.g. messages not yet persisted to DB),
                     // create an empty streaming assistant message for catch-up content.
@@ -526,39 +541,9 @@ export const useChatStream = (): UseChatStreamReturn => {
 
             setMessages(prev => {
                 const updated = [...prev];
-                // Find the last streaming assistant message
                 for (let i = updated.length - 1; i >= 0; i--) {
                     if (updated[i].role === 'assistant' && updated[i].isStreaming) {
-                        // Each assistant event is cumulative within its turn, but a new
-                        // turn (after tool use) starts fresh. Detect turn boundaries by
-                        // comparing tool_use IDs: if existing content has tool_use blocks
-                        // not present in the new blocks, we've moved to a new turn.
-                        const existing = updated[i].content;
-
-                        const existingToolUseIds = new Set(
-                            existing
-                                .filter((b): b is ToolUseBlock => b.type === 'tool_use')
-                                .map(b => b.id),
-                        );
-                        const newToolUseIds = new Set(
-                            blocks
-                                .filter((b): b is ToolUseBlock => b.type === 'tool_use')
-                                .map(b => b.id),
-                        );
-
-                        const isNewTurn = existingToolUseIds.size > 0 &&
-                            ![...existingToolUseIds].some(id => newToolUseIds.has(id));
-
-                        if (isNewTurn) {
-                            // New turn: preserve all existing content, append new blocks
-                            updated[i] = {...updated[i], content: [...existing, ...blocks]};
-                        } else {
-                            // Same turn: replace with cumulative snapshot, preserving tool_result blocks
-                            const existingToolResults = existing.filter(
-                                (b): b is ToolResultBlock => b.type === 'tool_result',
-                            );
-                            updated[i] = {...updated[i], content: [...blocks, ...existingToolResults]};
-                        }
+                        updated[i] = {...updated[i], content: mergeAssistantContent(updated[i].content, blocks)};
                         break;
                     }
                 }
@@ -631,6 +616,9 @@ export const useChatStream = (): UseChatStreamReturn => {
             return;
         }
 
+        // Track which session we're streaming for so event filtering works
+        activeClaudeSessionRef.current = options.claudeSessionId;
+
         // Build user message content blocks: text + any attachment blocks
         const userContent: ContentBlock[] = [{type: 'text', text: message}];
         if (options.attachmentBlocks && options.attachmentBlocks.length > 0) {
@@ -689,6 +677,9 @@ export const useChatStream = (): UseChatStreamReturn => {
 
         if (texts.length === 0) return;
 
+        // Track which session we're streaming for so event filtering works
+        activeClaudeSessionRef.current = options.claudeSessionId;
+
         // Add each queued message as a separate user bubble
         setMessages(prev => [
             ...prev,

package/templates/assistkick-product-system/packages/frontend/src/lib/chat_message_helpers.test.ts

@@ -9,6 +9,7 @@ import {
   buildStreamOptions,
   prepareMergedQueueText,
   markOrCreateStreamingAssistant,
+  mergeAssistantContent,
 } from './chat_message_helpers.ts';
 import type { ChatMessage, ContentBlock } from '../hooks/use_chat_stream.ts';
 import type { QueuedMessage } from './message_queue.ts';
@@ -303,3 +304,107 @@ describe('markOrCreateStreamingAssistant', () => {
     assert.deepEqual(result[1].content, content);
   });
 });
+
+describe('mergeAssistantContent', () => {
+  it('replaces content with cumulative snapshot when new blocks have text', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'partial text' },
+    ];
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: 'full text response' },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    assert.equal(result.length, 1);
+    assert.equal((result[0] as any).text, 'full text response');
+  });
+
+  it('preserves text when partial event only has tool_use (Bug 1 fix)', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'Let me read the file.' },
+    ];
+    // Partial event during tool_use streaming — only contains the tool_use block
+    const newBlocks: ContentBlock[] = [
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: {} },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    // Text block should be preserved
+    assert.equal(result.length, 2);
+    assert.equal(result[0].type, 'text');
+    assert.equal((result[0] as any).text, 'Let me read the file.');
+    assert.equal(result[1].type, 'tool_use');
+  });
+
+  it('replaces text when cumulative event includes both text and tool_use', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'old partial' },
+    ];
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: 'Let me read the file.' },
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: { file_path: '/etc/hosts' } },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    assert.equal(result.length, 2);
+    assert.equal((result[0] as any).text, 'Let me read the file.');
+    assert.equal(result[1].type, 'tool_use');
+  });
+
+  it('preserves tool_result blocks from existing content in same turn', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'Reading file...' },
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: {} },
+      { type: 'tool_result', toolUseId: 'tu_1', content: 'file content', isError: false },
+    ];
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: 'Reading file...' },
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: { file_path: '/etc/hosts' } },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    assert.equal(result.length, 3);
+    assert.equal(result[2].type, 'tool_result');
+    assert.equal((result[2] as any).toolUseId, 'tu_1');
+  });
+
+  it('appends new blocks on new turn (different tool_use IDs)', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'First action' },
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: {} },
+      { type: 'tool_result', toolUseId: 'tu_1', content: 'ok', isError: false },
+    ];
+    // New turn — completely different tool_use ID
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: 'Now writing...' },
+      { type: 'tool_use', id: 'tu_2', name: 'Write', input: {} },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    // Should preserve all existing + append new
+    assert.equal(result.length, 5);
+    assert.equal(result[0].type, 'text');
+    assert.equal((result[0] as any).text, 'First action');
+    assert.equal(result[3].type, 'text');
+    assert.equal((result[3] as any).text, 'Now writing...');
+  });
+
+  it('handles empty existing content', () => {
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: 'Hello' },
+    ];
+    const result = mergeAssistantContent([], newBlocks);
+    assert.equal(result.length, 1);
+    assert.equal((result[0] as any).text, 'Hello');
+  });
+
+  it('preserves text when new blocks have empty text block', () => {
+    const existing: ContentBlock[] = [
+      { type: 'text', text: 'I will help you.' },
+    ];
+    // Event with empty text + tool_use
+    const newBlocks: ContentBlock[] = [
+      { type: 'text', text: '' },
+      { type: 'tool_use', id: 'tu_1', name: 'Read', input: {} },
+    ];
+    const result = mergeAssistantContent(existing, newBlocks);
+    // Should carry forward the existing non-empty text
+    assert.equal(result[0].type, 'text');
+    assert.equal((result[0] as any).text, 'I will help you.');
+  });
+});

package/templates/assistkick-product-system/packages/frontend/src/lib/chat_message_helpers.ts

@@ -5,7 +5,7 @@
  * Includes stream options building, message filtering, and text extraction.
  */
 
-import type { ChatMessage, ContentBlock, TextBlock, ToolResultBlock } from '../hooks/use_chat_stream';
+import type { ChatMessage, ContentBlock, TextBlock, ToolUseBlock, ToolResultBlock } from '../hooks/use_chat_stream';
 import type { QueuedMessage } from './message_queue';
 
 /**
@@ -97,6 +97,53 @@ export const prepareMergedQueueText = (messages: QueuedMessage[]): string => {
  * Used by the stream_resumed handler when re-attaching to an in-flight stream.
  * Returns a new array (does not mutate the input).
  */
+/**
+ * Merge new content blocks from a streaming assistant event into existing content.
+ * Handles same-turn cumulative replacement and new-turn appending.
+ *
+ * Key behavior: when partial events during tool_use streaming omit prior text blocks,
+ * existing text blocks are preserved so they don't disappear from the UI.
+ */
+export const mergeAssistantContent = (
+  existing: ContentBlock[],
+  newBlocks: ContentBlock[],
+): ContentBlock[] => {
+  const existingToolUseIds = new Set(
+    existing
+      .filter((b): b is ToolUseBlock => b.type === 'tool_use')
+      .map(b => b.id),
+  );
+  const newToolUseIds = new Set(
+    newBlocks
+      .filter((b): b is ToolUseBlock => b.type === 'tool_use')
+      .map(b => b.id),
+  );
+
+  const isNewTurn = existingToolUseIds.size > 0 &&
+    ![...existingToolUseIds].some(id => newToolUseIds.has(id));
+
+  if (isNewTurn) {
+    // New turn: preserve all existing content, append new blocks
+    return [...existing, ...newBlocks];
+  }
+
+  // Same turn: replace with cumulative snapshot, preserving tool_result blocks.
+  // Also preserve existing text blocks when partial events omit them
+  // (partial events during tool_use streaming may only contain the tool_use block).
+  const existingToolResults = existing.filter(
+    (b): b is ToolResultBlock => b.type === 'tool_result',
+  );
+  const hasNewText = newBlocks.some(
+    b => b.type === 'text' && (b as TextBlock).text.length > 0,
+  );
+  if (hasNewText) {
+    return [...newBlocks, ...existingToolResults];
+  }
+  // No text in new event — carry forward existing text blocks
+  const existingText = existing.filter(b => b.type === 'text');
+  return [...existingText, ...newBlocks, ...existingToolResults];
+};
+
 export const markOrCreateStreamingAssistant = (
   messages: ChatMessage[],
   nextId: string,