fix(flow-chat): eliminate excess footer whitespace after tool-card collapses (#1176)

src/crates/assembly/core/src/agentic/agents/prompts/general_purpose_agent.md

@@ -2,12 +2,17 @@ You are a general-purpose agent for BitFun, a desktop AI IDE and agent runtime.
 
 {LANGUAGE_PREFERENCE}
 
+## When to use this agent
+
+Use this agent **only** when the task requires file modifications, shell commands, or other write operations. For read-only exploration and research, prefer the `Explore` or `FileFinder` subagents instead. This agent has write capabilities (Write, Edit, Delete, Bash) and cannot run in parallel with other write-capable agents for safety reasons.
+
 ## Strengths
 
+- Implementing features, fixing bugs, and refactoring code
+- Running build, test, and validation commands via Bash
 - Searching for code, configurations, and patterns across large codebases
 - Analyzing multiple files to understand system architecture
-- Investigating complex questions that require exploring many files
-- Performing multi-step research tasks
+- Performing multi-step research tasks that may require edits
 
 ## Working style
 
@@ -31,5 +36,5 @@ You are a general-purpose agent for BitFun, a desktop AI IDE and agent runtime.
 
 - Keep the final response concise and concrete.
 - Include the relevant file paths you changed or inspected when they matter to the parent agent.
-- Include short code snippets only when the exact text is load-bearing.
+- Include short code snippets only when the exact code is load-bearing.
 - Avoid emojis.

src/web-ui/src/flow_chat/services/flow-chat-manager/ToolEventModule.ts

@@ -20,7 +20,9 @@ import type {
   FlowToolEvent,
   ParamsPartialToolEvent,
   ProgressToolEvent,
+  QueuedToolEvent,
   StartedToolEvent,
+  WaitingToolEvent,
 } from '../EventBatcher';
 
 const log = createLogger('ToolEventModule');
@@ -69,6 +71,16 @@ export function processToolEvent(
       handleParamsPartial(store, sessionId, turnId, toolEvent);
       break;
     }
+
+    case 'Queued': {
+      handleQueued(store, sessionId, turnId, toolEvent);
+      break;
+    }
+
+    case 'Waiting': {
+      handleWaiting(store, sessionId, turnId, toolEvent);
+      break;
+    }
 
     case 'Started': {
       flushPendingBatchedEvents(context);
@@ -357,6 +369,40 @@ function handleParamsPartial(
   applyParamsPartial(store, sessionId, turnId, toolEvent);
 }
 
+/**
+ * Handle tool queued event
+ */
+function handleQueued(
+  store: FlowChatStore,
+  sessionId: string,
+  turnId: string,
+  toolEvent: QueuedToolEvent
+): void {
+  const existingItem = store.findToolItem(sessionId, turnId, toolEvent.tool_id);
+  if (existingItem && existingItem.type === 'tool') {
+    updateToolItem(store, sessionId, turnId, toolEvent.tool_id, {
+      status: 'queued',
+    });
+  }
+}
+
+/**
+ * Handle tool waiting event
+ */
+function handleWaiting(
+  store: FlowChatStore,
+  sessionId: string,
+  turnId: string,
+  toolEvent: WaitingToolEvent
+): void {
+  const existingItem = store.findToolItem(sessionId, turnId, toolEvent.tool_id);
+  if (existingItem && existingItem.type === 'tool') {
+    updateToolItem(store, sessionId, turnId, toolEvent.tool_id, {
+      status: 'waiting',
+    });
+  }
+}
+
 /**
  * Handle tool started event
  */

src/web-ui/src/flow_chat/tool-cards/BaseToolCard.tsx

@@ -16,6 +16,8 @@ import { ToolCardStatusIcon } from './ToolCardStatusIcon';
 import './BaseToolCard.scss';
 
 const LOADING_SHIMMER_STATUSES = new Set([
+  'queued',
+  'waiting',
   'preparing',
   'streaming',
   'receiving',
@@ -29,7 +31,7 @@ function statusUsesLoadingShimmer(status: string): boolean {
 
 export interface BaseToolCardProps {
   /** Tool status */
-  status: 'pending' | 'preparing' | 'streaming' | 'receiving' | 'running' | 'completed' | 'error' | 'cancelled' | 'analyzing' | 'pending_confirmation' | 'confirmed';
+  status: 'pending' | 'queued' | 'waiting' | 'preparing' | 'streaming' | 'receiving' | 'running' | 'completed' | 'error' | 'cancelled' | 'analyzing' | 'pending_confirmation' | 'confirmed';
   /** Whether expanded */
   isExpanded?: boolean;
   /** Card click callback */

src/web-ui/src/flow_chat/tool-cards/DefaultToolCard.tsx

@@ -160,6 +160,10 @@ export const DefaultToolCard: React.FC<ToolCardProps> = ({
     }
 
     switch (status) {
+      case 'queued':
+        return t('toolCards.default.queued');
+      case 'waiting':
+        return t('toolCards.default.waiting');
       case 'streaming':
       case 'running':
         return t('toolCards.default.executing');
@@ -187,6 +191,20 @@ export const DefaultToolCard: React.FC<ToolCardProps> = ({
       return progressMessage;
     }
 
+    if (status === 'queued') {
+      const preview = getInlinePreview(filteredInput);
+      return preview
+        ? `${t('toolCards.default.queued')} - ${preview}`
+        : t('toolCards.default.queued');
+    }
+
+    if (status === 'waiting') {
+      const preview = getInlinePreview(filteredInput);
+      return preview
+        ? `${t('toolCards.default.waiting')} - ${preview}`
+        : t('toolCards.default.waiting');
+    }
+
     if (status === 'completed') {
       const preview = getInlinePreview(toolResult?.result) || getInlinePreview(filteredInput);
       return preview

src/web-ui/src/flow_chat/tool-cards/ToolCardStatusSlot.tsx

@@ -15,7 +15,7 @@
  */
 
 import React, { ReactNode } from 'react';
-import { Check, X } from 'lucide-react';
+import { Check, X, Clock } from 'lucide-react';
 import { ToolProcessingDots } from '@/component-library';
 import type { ToolProcessingDotsSize } from '@/component-library';
 import type { BaseToolCardProps } from './BaseToolCard';
@@ -43,6 +43,9 @@ function StatusIcon({ status, size }: { status: ToolCardStatusSlotStatus; size:
       return <X size={size} className="tcss-error" />;
     case 'cancelled':
       return <X size={size} className="tcss-cancelled" />;
+    case 'queued':
+    case 'waiting':
+      return <Clock size={size} className="tcss-waiting" />;
     default:
       return <ToolProcessingDots size={size} />;
   }

src/web-ui/src/flow_chat/types/flow-chat.ts

@@ -15,7 +15,7 @@ export interface FlowItem {
   id: string;
   type: 'text' | 'tool' | 'image-analysis' | 'thinking' | 'user-steering';
   timestamp: number;
-  status: 'pending' | 'preparing' | 'running' | 'streaming' | 'receiving' | 'completed' | 'cancelled' | 'error' | 'analyzing' | 'pending_confirmation' | 'confirmed'; // Includes error, analyzing, and confirmation states.
+  status: 'pending' | 'queued' | 'waiting' | 'preparing' | 'running' | 'streaming' | 'receiving' | 'completed' | 'cancelled' | 'error' | 'analyzing' | 'pending_confirmation' | 'confirmed'; // Includes error, analyzing, and confirmation states.
 
   /**
    * Session-scoped subagent linkage.

src/web-ui/src/locales/en-US/flow-chat.json

@@ -1545,6 +1545,8 @@
     },
     "default": {
       "waitingConfirm": "Waiting for confirmation",
+      "queued": "Queued",
+      "waiting": "Waiting",
       "executing": "Executing...",
       "completed": "Completed",
       "cancelled": "Cancelled",

src/web-ui/src/locales/zh-CN/flow-chat.json

@@ -1545,6 +1545,8 @@
     },
     "default": {
       "waitingConfirm": "等待确认",
+      "queued": "排队中",
+      "waiting": "等待中",
       "executing": "执行中...",
       "completed": "已完成",
       "cancelled": "已取消",

src/web-ui/src/locales/zh-TW/flow-chat.json

@@ -1545,6 +1545,8 @@
     },
     "default": {
       "waitingConfirm": "等待確認",
+      "queued": "排隊中",
+      "waiting": "等待中",
       "executing": "執行中...",
       "completed": "已完成",
       "cancelled": "已取消",

tests/e2e/config/wdio.conf_l1.ts

@@ -14,6 +14,7 @@ export const config = createEmbeddedConfig(
     '../specs/l1-session.spec.ts',
     '../specs/l1-dialog.spec.ts',
     '../specs/l1-chat.spec.ts',
+    '../specs/l1-chat-scroll-whitespace.spec.ts',
   ],
   'L1'
 );