From 02eec5c8cafc054ac6293217cd988a5b775a1f26 Mon Sep 17 00:00:00 2001
From: Brandon Keiji <brandonkeiji@google.com>
Date: Thu, 22 May 2025 05:57:53 +0000
Subject: feat: useToolScheduler hook to manage parallel tool calls (#448)

---
 packages/cli/src/ui/components/messages/ToolGroupMessage.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

(limited to 'packages/cli/src/ui/components/messages/ToolGroupMessage.tsx')

diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
index d0ad1c5f..4b2c7dfe 100644
--- a/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
+++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.tsx
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Box } from 'ink';
 import { IndividualToolCallDisplay, ToolCallStatus } from '../../types.js';
 import { ToolMessage } from './ToolMessage.js';
@@ -19,7 +19,6 @@ interface ToolGroupMessageProps {
 
 // Main component renders the border and maps the tools using ToolMessage
 export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
-  groupId,
   toolCalls,
   availableTerminalHeight,
 }) => {
@@ -30,9 +29,13 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
 
   const staticHeight = /* border */ 2 + /* marginBottom */ 1;
 
+  const toolAwaitingApproval = useMemo(
+    () => toolCalls.find((tc) => tc.status === ToolCallStatus.Confirming),
+    [toolCalls],
+  );
+
   return (
     <Box
-      key={groupId}
       flexDirection="column"
       borderStyle="round"
       /*
@@ -48,7 +51,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
       marginBottom={1}
     >
       {toolCalls.map((tool) => (
-        <Box key={groupId + '-' + tool.callId} flexDirection="column">
+        <Box key={tool.callId} flexDirection="column">
           <ToolMessage
             key={tool.callId}
             callId={tool.callId}
@@ -60,6 +63,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
             availableTerminalHeight={availableTerminalHeight - staticHeight}
           />
           {tool.status === ToolCallStatus.Confirming &&
+            tool.callId === toolAwaitingApproval?.callId &&
             tool.confirmationDetails && (
               <ToolConfirmationMessage
                 confirmationDetails={tool.confirmationDetails}
-- 
cgit v1.2.3

