@assistkick/create 1.33.0 → 1.35.0

package/package.json

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

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/ChatMessageBubble.tsx

@@ -9,7 +9,7 @@
  * text blocks, tool use cards, and tool result blocks.
  */
 
-import { useState, useCallback } from 'react';
+import { memo, useState, useCallback } from 'react';
 import type { ChatMessage, TextBlock, ImageBlock, FileBlock } from '../hooks/use_chat_stream';
 import { ChatMessageContent } from './ChatMessageContent';
 import { HighlightedText } from './HighlightedText';
@@ -41,12 +41,12 @@ const getFileTypeLabel = (mimeType: string): string => {
   return 'FILE';
 };
 
-export function ChatMessageBubble({ message, searchQuery = '', activeMatchIndex = -1, matchIndexOffset = 0 }: ChatMessageBubbleProps) {
+export const ChatMessageBubble = memo(function ChatMessageBubble({ message, searchQuery = '', activeMatchIndex = -1, matchIndexOffset = 0 }: ChatMessageBubbleProps) {
   if (message.role === 'user') {
     return <UserBubble message={message} searchQuery={searchQuery} activeMatchIndex={activeMatchIndex} matchIndexOffset={matchIndexOffset} />;
   }
   return <AssistantBubble message={message} searchQuery={searchQuery} activeMatchIndex={activeMatchIndex} matchIndexOffset={matchIndexOffset} />;
-}
+});
 
 function UserBubble({ message, searchQuery, activeMatchIndex, matchIndexOffset }: { message: ChatMessage; searchQuery: string; activeMatchIndex: number; matchIndexOffset: number }) {
   const textBlock = message.content.find((b) => b.type === 'text') as TextBlock | undefined;

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

@@ -7,6 +7,7 @@
  * - ToolResultBlock → collapsed ToolResultCard (shows tool output)
  */
 
+import { memo } from 'react';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import type { ContentBlock, ToolResultBlock, ToolUseBlock } from '../hooks/use_chat_stream';
@@ -67,7 +68,7 @@ const chatMarkdownClass = [
 ].join(' ');
 
 
-export const ChatMessageContent = ({ content, isStreaming, searchQuery = '', activeMatchIndex = -1, matchIndexOffset = 0 }: ChatMessageContentProps) => {
+export const ChatMessageContent = memo(({ content, isStreaming, searchQuery = '', activeMatchIndex = -1, matchIndexOffset = 0 }: ChatMessageContentProps) => {
   const resultMap = buildResultMap(content);
 
   // Pre-compute per-block match offsets so each text block knows its global offset
@@ -139,4 +140,4 @@ export const ChatMessageContent = ({ content, isStreaming, searchQuery = '', act
       })}
     </div>
   );
-};
+});

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

@@ -75,6 +75,7 @@ export function ChatView({ visible }: ChatViewProps) {
     loadMessages,
     attachSession,
     messages,
+    streamingMessage,
     streaming,
     connected,
     error,
@@ -136,12 +137,18 @@ export function ChatView({ visible }: ChatViewProps) {
   const messagesContainerRef = useRef<HTMLDivElement>(null);
   const sessionRestoredRef = useRef(false);
 
+  // Combined messages for search and sidebar (historical + streaming)
+  const allMessages = useMemo(
+    () => streamingMessage ? [...messages, streamingMessage] : messages,
+    [messages, streamingMessage],
+  );
+
   // --- Search: compute total matches and per-message offsets ---
   const { totalMatches, messageOffsets } = useMemo(() => {
     if (!searchQuery) return { totalMatches: 0, messageOffsets: [] as number[] };
     let total = 0;
     const offsets: number[] = [];
-    for (const msg of messages) {
+    for (const msg of allMessages) {
       offsets.push(total);
       for (const block of msg.content) {
         if (block.type === 'text') {
@@ -150,7 +157,7 @@ export function ChatView({ visible }: ChatViewProps) {
       }
     }
     return { totalMatches: total, messageOffsets: offsets };
-  }, [messages, searchQuery]);
+  }, [allMessages, searchQuery]);
 
   // Reset active match when query changes
   useEffect(() => {
@@ -320,7 +327,7 @@ export function ChatView({ visible }: ChatViewProps) {
   // Auto-scroll to bottom when new messages arrive
   useEffect(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
-  }, [messages, queue]);
+  }, [messages, streamingMessage, queue]);
 
   // Keep a ref to sessions so the onStreamEnd callback can look up session details
   // without stale closure issues.
@@ -366,7 +373,7 @@ export function ChatView({ visible }: ChatViewProps) {
       // Save current session's input, messages, context usage, and system prompt
       if (activeSessionId) {
         inputCacheRef.current.set(activeSessionId, inputValue);
-        messagesCacheRef.current.set(activeSessionId, messages);
+        messagesCacheRef.current.set(activeSessionId, streamingMessage ? [...messages, streamingMessage] : messages);
         if (contextUsage) contextUsageCacheRef.current.set(activeSessionId, contextUsage);
         if (systemPrompt) systemPromptCacheRef.current.set(activeSessionId, systemPrompt);
       }
@@ -424,7 +431,7 @@ export function ChatView({ visible }: ChatViewProps) {
         });
       }
     },
-    [activeSessionId, inputValue, messages, contextUsage, systemPrompt, clearMessages, restoreMessages, clearAttachments, loadMessages, attachSession, initContextUsage, initSystemPrompt, setQueueActiveSession],
+    [activeSessionId, inputValue, messages, streamingMessage, contextUsage, systemPrompt, clearMessages, restoreMessages, clearAttachments, loadMessages, attachSession, initContextUsage, initSystemPrompt, setQueueActiveSession],
   );
 
   // Handle selecting a newly created session
@@ -433,7 +440,7 @@ export function ChatView({ visible }: ChatViewProps) {
       // Save current session's state before switching
       if (activeSessionId) {
         inputCacheRef.current.set(activeSessionId, inputValue);
-        messagesCacheRef.current.set(activeSessionId, messages);
+        messagesCacheRef.current.set(activeSessionId, streamingMessage ? [...messages, streamingMessage] : messages);
         if (contextUsage) contextUsageCacheRef.current.set(activeSessionId, contextUsage);
         if (systemPrompt) systemPromptCacheRef.current.set(activeSessionId, systemPrompt);
       }
@@ -445,7 +452,7 @@ export function ChatView({ visible }: ChatViewProps) {
       setIsNewSession(true);
       setInputValue('');
     },
-    [activeSessionId, inputValue, messages, contextUsage, systemPrompt, clearMessages, clearAttachments, initSystemPrompt, setQueueActiveSession],
+    [activeSessionId, inputValue, messages, streamingMessage, contextUsage, systemPrompt, clearMessages, clearAttachments, initSystemPrompt, setQueueActiveSession],
   );
 
   // File handling for attachments
@@ -691,6 +698,7 @@ export function ChatView({ visible }: ChatViewProps) {
                   <SystemPromptAccordion prompt={displayedSystemPrompt} />
                 )}
 
+                {/* Historical messages — stable array, memoized components skip re-renders */}
                 {messages.map((msg, idx) => (
                   <ChatMessageBubble
                     key={msg.id}
@@ -701,6 +709,17 @@ export function ChatView({ visible }: ChatViewProps) {
                   />
                 ))}
 
+                {/* Streaming message — isolated, only this re-renders per token */}
+                {streamingMessage && (
+                  <ChatMessageBubble
+                    key={streamingMessage.id}
+                    message={streamingMessage}
+                    searchQuery={searchQuery}
+                    activeMatchIndex={activeMatchIndex}
+                    matchIndexOffset={messageOffsets[messages.length] ?? 0}
+                  />
+                )}
+
                 {/* Queued messages */}
                 {queue.map((qm) => (
                   <QueuedMessageBubble
@@ -716,7 +735,7 @@ export function ChatView({ visible }: ChatViewProps) {
             </div>
 
             {/* Todo sidebar — shown when tasks exist */}
-            <ChatTodoSidebar messages={messages} />
+            <ChatTodoSidebar messages={allMessages} />
           </div>
 
           {/* Error banner */}

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

@@ -7,7 +7,7 @@
  * content-secondary text, monospace font at 13px.
  */
 
-import { useState } from 'react';
+import { memo, useState } from 'react';
 import { ChevronDown, ChevronRight } from 'lucide-react';
 import { summarizeToolUse, toolIcon } from '../lib/tool_use_summary';
 import { ToolDiffView } from './ToolDiffView';
@@ -64,7 +64,7 @@ const hasIntegratedView = (name: string): boolean =>
 const hasGenericView = (name: string): boolean =>
   !['Edit', 'Write', 'Read', 'Bash', 'Agent'].includes(name);
 
-export const ToolUseCard = ({ name, input, isStreaming, result }: ToolUseCardProps) => {
+export const ToolUseCard = memo(({ name, input, isStreaming, result }: ToolUseCardProps) => {
   const [expanded, setExpanded] = useState(false);
   const [viewTab, setViewTab] = useState<ViewTab>('humanized');
   const summary = summarizeToolUse(name, input);
@@ -160,4 +160,4 @@ export const ToolUseCard = ({ name, input, isStreaming, result }: ToolUseCardPro
       )}
     </div>
   );
-};
+});

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 {
@@ -213,6 +214,8 @@ export interface UseChatStreamReturn {
     /** Attempt to re-attach to an in-flight stream after page reload. */
     attachSession: (claudeSessionId: string) => void;
     messages: ChatMessage[];
+    /** The currently streaming assistant message (separate from messages for render isolation). */
+    streamingMessage: ChatMessage | null;
     streaming: boolean;
     connected: boolean;
     error: string | null;
@@ -349,9 +352,16 @@ 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[]>([]);
+    /** The currently streaming assistant message, isolated from historical messages
+     *  so that per-token updates don't trigger re-renders of the entire message list. */
+    const [streamingMessage, setStreamingMessage] = useState<ChatMessage | null>(null);
+    /** Ref mirror of streamingMessage for synchronous reads in event handlers. */
+    const streamingMessageRef = useRef<ChatMessage | null>(null);
     const [error, setError] = useState<string | null>(null);
     const [pendingPermission, setPendingPermission] = useState<PendingPermission | null>(null);
     const [cancelledUserMessage, setCancelledUserMessage] = useState<string | null>(null);
@@ -391,57 +401,56 @@ export const useChatStream = (): UseChatStreamReturn => {
             }
 
             switch (msg.type) {
-                case 'stream_start':
+                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
-                    setMessages(prev => [
-                        ...prev,
-                        {id: nextMessageId(), role: 'assistant', content: [], isStreaming: true},
-                    ]);
+                    // Create an isolated streaming message (not in the messages array)
+                    const startMsg: ChatMessage = {id: nextMessageId(), role: 'assistant', content: [], isStreaming: true};
+                    streamingMessageRef.current = startMsg;
+                    setStreamingMessage(startMsg);
                     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':
+                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);
                     }
-                    // Mark the last assistant message as no longer streaming
-                    setMessages(prev => {
-                        const updated = [...prev];
-                        for (let i = updated.length - 1; i >= 0; i--) {
-                            if (updated[i].role === 'assistant' && updated[i].isStreaming) {
-                                updated[i] = {...updated[i], isStreaming: false};
-                                break;
-                            }
-                        }
-                        return updated;
-                    });
+                    // Merge the streaming message into historical messages
+                    const endMsg = streamingMessageRef.current;
+                    if (endMsg) {
+                        setMessages(prev => [...prev, {...endMsg, isStreaming: false}]);
+                    }
+                    streamingMessageRef.current = null;
+                    setStreamingMessage(null);
                     // Notify consumers (e.g. message queue) that streaming has ended
                     streamEndCallbackRef.current?.();
                     break;
+                }
 
                 case 'stream_cancelled':
+                    // Only process if this event is for our active session
+                    if (activeClaudeSessionRef.current && msg.claudeSessionId !== activeClaudeSessionRef.current) break;
                     setStreaming(false);
-                    // Discard the partial assistant response and the triggering user message.
-                    // Prepopulate the cancelled user message text for the input field.
+                    activeClaudeSessionRef.current = null;
+                    // Discard the streaming assistant message
+                    streamingMessageRef.current = null;
+                    setStreamingMessage(null);
+                    // Remove the last user message and prepopulate the input field
                     setMessages(prev => {
                         const updated = [...prev];
-
-                        // Remove the last streaming assistant message (partial response)
-                        for (let i = updated.length - 1; i >= 0; i--) {
-                            if (updated[i].role === 'assistant' && updated[i].isStreaming) {
-                                updated.splice(i, 1);
-                                break;
-                            }
-                        }
-
-                        // Remove the last user message and capture its text
                         for (let i = updated.length - 1; i >= 0; i--) {
                             if (updated[i].role === 'user') {
                                 const userContent = updated[i].content;
@@ -453,36 +462,46 @@ export const useChatStream = (): UseChatStreamReturn => {
                                 break;
                             }
                         }
-
                         return updated;
                     });
                     break;
 
-                case 'stream_resumed':
+                case 'stream_resumed': {
                     // Re-attached to an in-flight stream after page reload or session switch.
-                    // 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.
+                    activeClaudeSessionRef.current = msg.claudeSessionId;
                     setStreaming(true);
                     setError(null);
-                    setMessages(prev => markOrCreateStreamingAssistant(prev, nextMessageId()));
-                    break;
-
-                case 'stream_error':
-                    setStreaming(false);
-                    setError(msg.error);
-                    // Mark streaming message as done
+                    // Extract last assistant message from historical messages into streamingMessage,
+                    // or create a new empty one if none exists.
+                    streamingMessageRef.current = null;
                     setMessages(prev => {
-                        const updated = [...prev];
-                        for (let i = updated.length - 1; i >= 0; i--) {
-                            if (updated[i].role === 'assistant' && updated[i].isStreaming) {
-                                updated[i] = {...updated[i], isStreaming: false};
-                                break;
+                        for (let i = prev.length - 1; i >= 0; i--) {
+                            if (prev[i].role === 'assistant') {
+                                streamingMessageRef.current = {...prev[i], isStreaming: true};
+                                return [...prev.slice(0, i), ...prev.slice(i + 1)];
                             }
                         }
-                        return updated;
+                        return prev;
                     });
+                    if (!streamingMessageRef.current) {
+                        streamingMessageRef.current = {id: nextMessageId(), role: 'assistant', content: [], isStreaming: true};
+                    }
+                    setStreamingMessage(streamingMessageRef.current);
+                    break;
+                }
+
+                case 'stream_error': {
+                    setStreaming(false);
+                    setError(msg.error);
+                    // Merge the streaming message into historical messages (marked as done)
+                    const errMsg = streamingMessageRef.current;
+                    if (errMsg) {
+                        setMessages(prev => [...prev, {...errMsg, isStreaming: false}]);
+                    }
+                    streamingMessageRef.current = null;
+                    setStreamingMessage(null);
                     break;
+                }
 
                 case 'permission_request':
                     setPendingPermission({
@@ -524,51 +543,17 @@ export const useChatStream = (): UseChatStreamReturn => {
             const blocks = extractContentBlocks(event);
             if (blocks.length === 0) return;
 
-            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]};
-                        }
-                        break;
-                    }
-                }
-                return updated;
-            });
+            // Update only the isolated streaming message — historical messages stay untouched
+            const current = streamingMessageRef.current;
+            if (current) {
+                const updated = {...current, content: mergeAssistantContent(current.content, blocks)};
+                streamingMessageRef.current = updated;
+                setStreamingMessage(updated);
+            }
             return;
         }
 
-        // Process tool result events — merge tool_result blocks into the last
-        // streaming assistant message so ToolUseCard can show output.
+        // Process tool result events — merge tool_result blocks into the streaming message
         if (event.type === 'tool_result' || event.type === 'human' || event.type === 'user') {
             const blocks = extractContentBlocks(event);
             const resultBlocks = blocks.filter(
@@ -576,30 +561,22 @@ export const useChatStream = (): UseChatStreamReturn => {
             );
             if (resultBlocks.length === 0) return;
 
-            setMessages(prev => {
-                const updated = [...prev];
-                for (let i = updated.length - 1; i >= 0; i--) {
-                    if (updated[i].role === 'assistant' && updated[i].isStreaming) {
-                        // Append tool_result blocks, deduplicating by toolUseId
-                        const existingToolResultIds = new Set(
-                            updated[i].content
-                                .filter((b): b is ToolResultBlock => b.type === 'tool_result')
-                                .map(b => b.toolUseId),
-                        );
-                        const newResults = resultBlocks.filter(
-                            b => !existingToolResultIds.has(b.toolUseId),
-                        );
-                        if (newResults.length > 0) {
-                            updated[i] = {
-                                ...updated[i],
-                                content: [...updated[i].content, ...newResults],
-                            };
-                        }
-                        break;
-                    }
+            const current = streamingMessageRef.current;
+            if (current) {
+                const existingToolResultIds = new Set(
+                    current.content
+                        .filter((b): b is ToolResultBlock => b.type === 'tool_result')
+                        .map(b => b.toolUseId),
+                );
+                const newResults = resultBlocks.filter(
+                    b => !existingToolResultIds.has(b.toolUseId),
+                );
+                if (newResults.length > 0) {
+                    const updated = {...current, content: [...current.content, ...newResults]};
+                    streamingMessageRef.current = updated;
+                    setStreamingMessage(updated);
                 }
-                return updated;
-            });
+            }
         }
 
         // Extract contextWindow from result event's modelUsage
@@ -631,6 +608,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 +669,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,
@@ -734,11 +717,15 @@ export const useChatStream = (): UseChatStreamReturn => {
 
     const clearMessages = useCallback(() => {
         setMessages([]);
+        streamingMessageRef.current = null;
+        setStreamingMessage(null);
         setContextUsage(null);
     }, []);
 
     const restoreMessages = useCallback((msgs: ChatMessage[]) => {
         setMessages(msgs);
+        streamingMessageRef.current = null;
+        setStreamingMessage(null);
     }, []);
 
     const initContextUsage = useCallback((usage: ContextUsage | null) => {
@@ -809,6 +796,7 @@ export const useChatStream = (): UseChatStreamReturn => {
         loadMessages,
         attachSession,
         messages,
+        streamingMessage,
         streaming,
         connected,
         error,

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,

package/templates/assistkick-product-system/packages/shared/db/migrate.ts

@@ -156,6 +156,31 @@ async function seedDefaults() {
     if (check.rows.length > 0) seeded++;
   }
 
+  // Default Chat Agent — system prompt for the chat bridge
+  const chatGrounding = `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.`;
+
+  const chatGroundingEscaped = sqlEscape(chatGrounding);
+  await client.execute(
+    `INSERT OR IGNORE INTO agents (id, name, model, skills, grounding, default_grounding, project_id, is_default, created_at, updated_at)
+     VALUES ('chat-agent-default', 'Chat Agent', 'claude-opus-4-6', '[]', '${chatGroundingEscaped}', '${chatGroundingEscaped}', NULL, 1, '${now}', '${now}')`
+  );
+  const chatCheck = await client.execute(`SELECT id FROM agents WHERE id = 'chat-agent-default'`);
+  if (chatCheck.rows.length > 0) seeded++;
+
   // Default Pipeline workflow
   const defaultPipelineGraph = JSON.stringify({
     nodes: [