From 00840f75a12b2eda6fbc5cdbf3d219365d5c6340 Mon Sep 17 00:00:00 2001
From: Taylor Mullen <ntaylormullen@google.com>
Date: Sun, 27 Apr 2025 13:25:11 -0700
Subject: [PATCH] Allow tool groups + following content to be updateable.

- I found that when there are fast transactions that update our tool group history at times promoting a tool group into the static container can result in bleeding. As a temporary fix for this (not a react Guru) I'm increasing the # of items to be 2 as updateable if a tool group is close to the end.
---
 packages/cli/src/ui/App.tsx | 36 ++++++++++++++++++++++++++++--------
 1 file changed, 28 insertions(+), 8 deletions(-)

diff --git a/packages/cli/src/ui/App.tsx b/packages/cli/src/ui/App.tsx
index e37ab2f2..3b499ab9 100644
--- a/packages/cli/src/ui/App.tsx
+++ b/packages/cli/src/ui/App.tsx
@@ -80,8 +80,8 @@ export const App = ({ config, cliVersion }: AppProps) => {
 
   // --- Render Logic ---
 
-  const staticallyRenderedHistoryItems = history.slice(0, -1);
-  const updatableHistoryItem = history[history.length - 1];
+  const { staticallyRenderedHistoryItems, updatableHistoryItems } =
+    getHistoryRenderSlices(history);
 
   return (
     <Box flexDirection="column" marginBottom={1} width="90%">
@@ -118,13 +118,15 @@ export const App = ({ config, cliVersion }: AppProps) => {
         }}
       </Static>
 
-      {updatableHistoryItem && (
+      {updatableHistoryItems.length > 0 && (
         <Box flexDirection="column" alignItems="flex-start">
-          <HistoryItemDisplay
-            key={'history-' + updatableHistoryItem.id}
-            item={updatableHistoryItem}
-            onSubmit={submitQuery}
-          />
+          {updatableHistoryItems.map((historyItem) => (
+            <HistoryItemDisplay
+              key={'history-' + historyItem.id}
+              item={historyItem}
+              onSubmit={submitQuery}
+            />
+          ))}
         </Box>
       )}
 
@@ -214,3 +216,21 @@ export const App = ({ config, cliVersion }: AppProps) => {
     </Box>
   );
 };
+
+function getHistoryRenderSlices(history: HistoryItem[]) {
+  let staticallyRenderedHistoryItems: HistoryItem[] = [];
+  let updatableHistoryItems: HistoryItem[] = [];
+  if (
+    history.length > 1 &&
+    history[history.length - 2]?.type === 'tool_group'
+  ) {
+    // If the second-to-last item is a tool_group, it and the last item are updateable
+    staticallyRenderedHistoryItems = history.slice(0, -2);
+    updatableHistoryItems = history.slice(-2);
+  } else {
+    // Otherwise, only the last item is updateable
+    staticallyRenderedHistoryItems = history.slice(0, -1);
+    updatableHistoryItems = history.slice(-1);
+  }
+  return { staticallyRenderedHistoryItems, updatableHistoryItems };
+}