fix(ui): prevent UI freeze during context compaction

src/agent.ts

@@ -146,6 +146,7 @@ export interface AgentOptions {
   onToolCall?: (name: string, input: Record<string, unknown>) => void;
   onToolResult?: (name: string, result: string, isError: boolean) => void;
   onConfirm?: (confirmation: ToolConfirmation) => Promise<ConfirmationResult>; // Confirm destructive tools
+  onCompaction?: (status: 'start' | 'end') => void; // Notify when context compaction starts/ends
 }
 
 /**
@@ -211,6 +212,7 @@ export class Agent {
     onToolCall?: (name: string, input: Record<string, unknown>) => void;
     onToolResult?: (name: string, result: string, isError: boolean) => void;
     onConfirm?: (confirmation: ToolConfirmation) => Promise<ConfirmationResult>;
+    onCompaction?: (status: 'start' | 'end') => void;
   };
 
   constructor(options: AgentOptions) {
@@ -261,6 +263,7 @@ export class Agent {
       onToolCall: options.onToolCall,
       onToolResult: options.onToolResult,
       onConfirm: options.onConfirm,
+      onCompaction: options.onCompaction,
     };
   }
 
@@ -269,6 +272,17 @@ export class Agent {
    * More aggressive than normal token-based compaction.
    */
   private async proactiveCompact(): Promise<void> {
+    this.callbacks.onCompaction?.('start');
+    // Yield to event loop so UI can render the status update
+    await new Promise(resolve => setImmediate(resolve));
+    try {
+      await this.doProactiveCompact();
+    } finally {
+      this.callbacks.onCompaction?.('end');
+    }
+  }
+
+  private async doProactiveCompact(): Promise<void> {
     const beforeTokens = countMessageTokens(this.messages);
     const beforeMessages = this.messages.length;
 
@@ -567,6 +581,18 @@ Always use tools to interact with the filesystem rather than asking the user to
       return; // No compaction needed
     }
 
+    // Notify UI that compaction is starting
+    this.callbacks.onCompaction?.('start');
+    // Yield to event loop so UI can render the status update
+    await new Promise(resolve => setImmediate(resolve));
+    try {
+      await this.doCompactContext(totalTokens);
+    } finally {
+      this.callbacks.onCompaction?.('end');
+    }
+  }
+
+  private async doCompactContext(totalTokens: number): Promise<void> {
     const isProactive = totalTokens <= this.maxContextTokens;
     logger.debug(
       isProactive

src/index.ts

@@ -3964,6 +3964,23 @@ Begin by analyzing the query and planning your research approach.`;
         workerStatusUI?.setAgentActivity('thinking', null);
       }
     },
+    onCompaction: (status) => {
+      if (status === 'start') {
+        spinner.toolStart('compacting context');
+        if (useInkUi && inkController) {
+          inkController.setStatus({ activity: 'tool', activityDetail: 'compacting' });
+        } else if (workerStatusUI) {
+          workerStatusUI.setAgentActivity('tool', 'compacting');
+        }
+      } else {
+        spinner.stop();
+        if (useInkUi && inkController) {
+          inkController.setStatus({ activity: 'thinking', activityDetail: null });
+        } else if (workerStatusUI) {
+          workerStatusUI.setAgentActivity('thinking', null);
+        }
+      }
+    },
   });
 
   // Add agent and session state to command context