fix(ui): synchronize ToolGroupMessage static height calculation with rendering (address review feedback)

- Updates staticHeight to account for all rendered lines and boundaries.
- Use layout constants TOOL_RESULT_STATIC_HEIGHT and TOOL_RESULT_STANDARD_RESERVED_LINE_COUNT for height logic.
- Update comments to exhaustively explain the line count breakdown for all message types.

Author: jwhelangoog

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

@@ -221,8 +221,6 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
 
   const staticHeight = useMemo(() => {
     let height = 0;
-    // To match rendering, we track if all tools so far have been topics
-    let allPreviousWereTopics = true;
 
     for (let i = 0; i < groupedTools.length; i++) {
       const group = groupedTools[i];
@@ -251,47 +249,65 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
       // Align isFirst logic with rendering
       let isFirst = i === 0;
       if (!isFirst) {
-        isFirst = allPreviousWereTopics;
-      }
-
-      // Update state for next tool
-      if (isAgentGroup || !isTopicToolCall) {
-        allPreviousWereTopics = false;
+        // Check if all previous tools were topics (matches rendering logic exactly)
+        let allPreviousTopics = true;
+        for (let j = 0; j < i; j++) {
+          const prevGroupItem = groupedTools[j];
+          if (
+            Array.isArray(prevGroupItem) ||
+            !isTopicTool(prevGroupItem.name)
+          ) {
+            allPreviousTopics = false;
+            break;
+          }
+        }
+        isFirst = allPreviousTopics;
       }
 
       const isFirstProp = !!(isFirst
         ? (borderTopOverride ?? true)
         : prevIsCompact);
 
-      // Align closing border logic
       const showClosingBorder =
         !isCompact &&
         !isTopicToolCall &&
         (nextIsCompact || nextIsTopicToolCall || isLast);
 
       if (isAgentGroup) {
-        height += 1; // Header
-        height += group.length; // 1 line per agent
-        if (isFirstProp) height += 1; // Top border
-        if (showClosingBorder) height += 1; // Bottom border
+        // Agent Group Spacing Breakdown:
+        // 1. Top Boundary (0 or 1): Only present via borderTop if isFirstProp is true.
+        // 2. Header Content (1): The "≡ Running Agent..." status text.
+        // 3. Agent List (group.length lines): One line per agent in the group.
+        // 4. Closing Border (1): Added if transition logic (showClosingBorder) requires it.
+        height +=
+          (isFirstProp ? 1 : 0) +
+          1 +
+          group.length +
+          (showClosingBorder ? 1 : 0);
       } else if (isTopicToolCall) {
+        // Topic Message Spacing Breakdown:
+        // 1. Top Margin (1): Present unless it's the very first item following a boundary.
+        // 2. Topic Content (1).
+        // 3. Bottom Margin (1): Always present around TopicMessage for breathing room.
         const hasTopMargin = !(isFirst && isToolGroupBoundary);
-        height += 1 + (hasTopMargin ? 1 : 0) + 1; // TopicMessage + top/bottom padding
+        height += (hasTopMargin ? 1 : 0) + 1 + 1;
       } else if (isCompact) {
-        height += 1; // Base height for compact tool header
+        // Compact Tool: Always renders as a single dense line.
+        height += 1;
       } else {
-        // Standard tool (Shell or ToolMessage)
-        if (isFirstProp) height += 1; // StickyHeader borderTop
-
+        // Standard Tool (ToolMessage / ShellToolMessage) Spacing Breakdown:
+        // 1. TOOL_RESULT_STANDARD_RESERVED_LINE_COUNT (4) accounts for the top boundary,
+        // internal separator, header padding, and the group closing border.
+        // (Subtract 1 to isolate the group-level closing border.)
+        // 2. Header Content (1): TOOL_RESULT_STATIC_HEIGHT (the tool name/status).
+        // 3. Output File Message (1): (conditional) if outputFile is present.
+        // 4. Group Closing Border (1): (conditional) if transition logic (showClosingBorder) requires it.
         height +=
-          TOOL_RESULT_STATIC_HEIGHT + TOOL_RESULT_STANDARD_RESERVED_LINE_COUNT;
-
-        // Account for "Output saved to..." message
-        if (group.outputFile) {
-          height += 1;
-        }
-
-        if (showClosingBorder) height += 1; // Bottom border
+          TOOL_RESULT_STANDARD_RESERVED_LINE_COUNT -
+          1 +
+          TOOL_RESULT_STATIC_HEIGHT +
+          (group.outputFile ? 1 : 0) +
+          (showClosingBorder ? 1 : 0);
       }
     }
     return height;