fix: Adjust ToolGroupMessage filtering to hide Confirming and show Canceled tool calls. (#22230)

packages/cli/src/ui/components/__snapshots__/AlternateBufferQuittingDisplay.test.tsx.snap

@@ -13,10 +13,6 @@ Tips for getting started:
 2. /help for more information
 3. Ask coding questions, edit code or run commands
 4. Be specific for the best results
-╭──────────────────────────────────────────────────────────────────────────╮
-│ ?  confirming_tool Confirming tool description                           │
-│                                                                          │
-╰──────────────────────────────────────────────────────────────────────────╯
 
 Action Required (was prompted):
 

packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx

@@ -118,10 +118,30 @@ describe('<ToolGroupMessage />', () => {
         { config: baseMockConfig, settings: fullVerbositySettings },
       );
 
-      // Should now render confirming tools
+      // Should now hide confirming tools (to avoid duplication with Global Queue)
+      await waitUntilReady();
+      expect(lastFrame({ allowEmpty: true })).toBe('');
+      unmount();
+    });
+
+    it('renders canceled tool calls', async () => {
+      const toolCalls = [
+        createToolCall({
+          callId: 'canceled-tool',
+          name: 'canceled-tool',
+          status: CoreToolCallStatus.Cancelled,
+        }),
+      ];
+      const item = createItem(toolCalls);
+
+      const { lastFrame, unmount, waitUntilReady } = renderWithProviders(
+        <ToolGroupMessage {...baseProps} item={item} toolCalls={toolCalls} />,
+        { config: baseMockConfig, settings: fullVerbositySettings },
+      );
+
       await waitUntilReady();
       const output = lastFrame();
-      expect(output).toContain('test-tool');
+      expect(output).toMatchSnapshot('canceled_tool');
       unmount();
     });
 
@@ -842,7 +862,7 @@ describe('<ToolGroupMessage />', () => {
       );
 
       await waitUntilReady();
-      expect(lastFrame({ allowEmpty: true })).not.toBe('');
+      expect(lastFrame({ allowEmpty: true })).toBe('');
       unmount();
     });
 

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

@@ -110,11 +110,12 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
     () =>
       toolCalls.filter((t) => {
         const displayStatus = mapCoreStatusToDisplayStatus(t.status);
-        // We used to filter out Pending and Confirming statuses here to avoid
-        // duplication with the Global Queue, but this causes tools to appear to
-        // "vanish" from the context after approval.
-        // We now allow them to be visible here as well.
-        return displayStatus !== ToolCallStatus.Canceled;
+        // We hide Confirming tools from the history log because they are
+        // currently being rendered in the interactive ToolConfirmationQueue.
+        // We show everything else, including Pending (waiting to run) and
+        // Canceled (rejected by user), to ensure the history is complete
+        // and to avoid tools "vanishing" after approval.
+        return displayStatus !== ToolCallStatus.Confirming;
       }),
 
     [toolCalls],

packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap

@@ -49,6 +49,15 @@ exports[`<ToolGroupMessage /> > Border Color Logic > uses yellow border for shel
 "
 `;
 
+exports[`<ToolGroupMessage /> > Golden Snapshots > renders canceled tool calls > canceled_tool 1`] = `
+"╭──────────────────────────────────────────────────────────────────────────╮
+│ -  canceled-tool A tool for testing                                      │
+│                                                                          │
+│ Test result                                                              │
+╰──────────────────────────────────────────────────────────────────────────╯
+"
+`;
+
 exports[`<ToolGroupMessage /> > Golden Snapshots > renders empty tool calls array 1`] = `""`;
 
 exports[`<ToolGroupMessage /> > Golden Snapshots > renders header when scrolled 1`] = `