From 8943640a71ad9c946077fe3349ddcce65f793b27 Mon Sep 17 00:00:00 2001
From: Christian Gunderman <gundermanc@google.com>
Date: Fri, 1 May 2026 16:46:16 +0000
Subject: [PATCH] fix(ui): fix issue with box edges (#26148)

---
 .../messages/ToolGroupMessage.test.tsx        | 33 +++++++++++++++++++
 .../components/messages/ToolGroupMessage.tsx  |  9 +++--
 .../ToolGroupMessage.test.tsx.snap            | 16 +++++++++
 3 files changed, 56 insertions(+), 2 deletions(-)

diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx
index 94584879f9..dbf1533d9d 100644
--- a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx
+++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx
@@ -368,6 +368,39 @@ describe('<ToolGroupMessage />', () => {
       unmount();
     });
 
+    it('renders update_topic in the middle of other tools', async () => {
+      const toolCalls = [
+        createToolCall({
+          callId: 'tool-1',
+          name: 'read_file',
+          status: CoreToolCallStatus.Success,
+        }),
+        createToolCall({
+          callId: 'topic-tool-middle',
+          name: UPDATE_TOPIC_TOOL_NAME,
+          args: {
+            [TOPIC_PARAM_TITLE]: 'Middle Topic',
+          },
+        }),
+        createToolCall({
+          callId: 'tool-2',
+          name: 'write_file',
+          status: CoreToolCallStatus.Success,
+        }),
+      ];
+      const item = createItem(toolCalls);
+
+      const { lastFrame, unmount } = await renderWithProviders(
+        <ToolGroupMessage {...baseProps} item={item} toolCalls={toolCalls} />,
+        {
+          config: baseMockConfig,
+          settings: fullVerbositySettings,
+        },
+      );
+      expect(lastFrame()).toMatchSnapshot('update_topic_middle');
+      unmount();
+    });
+
     it('renders with limited terminal height', async () => {
       const toolCalls = [
         createToolCall({
diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
index f71f3e7800..3ca1fad658 100644
--- a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
+++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
@@ -192,6 +192,9 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
         !Array.isArray(prevGroup) &&
         isCompactTool(prevGroup, isCompactModeEnabled);
 
+      const prevIsTopic =
+        prevGroup && !Array.isArray(prevGroup) && isTopicTool(prevGroup.name);
+
       const nextGroup = !isLast ? groupedTools[i + 1] : null;
       const nextIsCompact =
         nextGroup &&
@@ -226,7 +229,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
 
       const isFirstProp = !!(isFirst
         ? (borderTopOverride ?? true)
-        : prevIsCompact);
+        : prevIsCompact || prevIsTopic);
 
       const showClosingBorder =
         !isCompact &&
@@ -363,6 +366,8 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
           prevGroup &&
           !Array.isArray(prevGroup) &&
           isCompactTool(prevGroup, isCompactModeEnabled);
+        const prevIsTopic =
+          prevGroup && !Array.isArray(prevGroup) && isTopicTool(prevGroup.name);
 
         const nextGroup = !isLast ? groupedTools[index + 1] : null;
         const nextIsCompact =
@@ -379,7 +384,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
 
         const isFirstProp = !!(isFirst
           ? (borderTopOverride ?? true)
-          : prevIsCompact);
+          : prevIsCompact || prevIsTopic);
 
         const showClosingBorder =
           !isCompact &&
diff --git a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap
index b0d33feebd..e0caedef9b 100644
--- a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap
+++ b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap
@@ -141,6 +141,22 @@ exports[`<ToolGroupMessage /> > Golden Snapshots > renders two tool groups where
 "
 `;
 
+exports[`<ToolGroupMessage /> > Golden Snapshots > renders update_topic in the middle of other tools > update_topic_middle 1`] = `
+"╭──────────────────────────────────────────────────────────────────────────╮
+│ ✓  read_file A tool for testing                                          │
+│                                                                          │
+│ Test result                                                              │
+╰──────────────────────────────────────────────────────────────────────────╯
+  Middle Topic
+
+╭──────────────────────────────────────────────────────────────────────────╮
+│ ✓  write_file A tool for testing                                         │
+│                                                                          │
+│ Test result                                                              │
+╰──────────────────────────────────────────────────────────────────────────╯
+"
+`;
+
 exports[`<ToolGroupMessage /> > Golden Snapshots > renders update_topic tool call using TopicMessage > update_topic_tool 1`] = `
 "  Testing Topic: This is the description
 "