feat: Implement Plan Mode for Safe Code Planning (#658)

packages/cli/src/ui/components/messages/ToolMessage.tsx

@@ -18,9 +18,11 @@ import { TOOL_STATUS } from '../../constants.js';
 import type {
   TodoResultDisplay,
   TaskResultDisplay,
+  PlanResultDisplay,
   Config,
 } from '@qwen-code/qwen-code-core';
 import { AgentExecutionDisplay } from '../subagents/index.js';
+import { PlanSummaryDisplay } from '../PlanSummaryDisplay.js';
 
 const STATIC_HEIGHT = 1;
 const RESERVED_LINE_COUNT = 5; // for tool name, status, padding etc.
@@ -35,6 +37,7 @@ export type TextEmphasis = 'high' | 'medium' | 'low';
 type DisplayRendererResult =
   | { type: 'none' }
   | { type: 'todo'; data: TodoResultDisplay }
+  | { type: 'plan'; data: PlanResultDisplay }
   | { type: 'string'; data: string }
   | { type: 'diff'; data: { fileDiff: string; fileName: string } }
   | { type: 'task'; data: TaskResultDisplay };
@@ -63,6 +66,18 @@ const useResultDisplayRenderer = (
       };
     }
 
+    if (
+      typeof resultDisplay === 'object' &&
+      resultDisplay !== null &&
+      'type' in resultDisplay &&
+      resultDisplay.type === 'plan_summary'
+    ) {
+      return {
+        type: 'plan',
+        data: resultDisplay as PlanResultDisplay,
+      };
+    }
+
     // Check for SubagentExecutionResultDisplay (for non-task tools)
     if (
       typeof resultDisplay === 'object' &&
@@ -102,6 +117,18 @@ const TodoResultRenderer: React.FC<{ data: TodoResultDisplay }> = ({
   data,
 }) => <TodoDisplay todos={data.todos} />;
 
+const PlanResultRenderer: React.FC<{
+  data: PlanResultDisplay;
+  availableHeight?: number;
+  childWidth: number;
+}> = ({ data, availableHeight, childWidth }) => (
+  <PlanSummaryDisplay
+    data={data}
+    availableHeight={availableHeight}
+    childWidth={childWidth}
+  />
+);
+
 /**
  * Component to render subagent execution results
  */
@@ -229,6 +256,13 @@ export const ToolMessage: React.FC<ToolMessageProps> = ({
             {displayRenderer.type === 'todo' && (
               <TodoResultRenderer data={displayRenderer.data} />
             )}
+            {displayRenderer.type === 'plan' && (
+              <PlanResultRenderer
+                data={displayRenderer.data}
+                availableHeight={availableHeight}
+                childWidth={childWidth}
+              />
+            )}
             {displayRenderer.type === 'task' && (
               <SubagentExecutionRenderer
                 data={displayRenderer.data}