fix: render streaming updates

codex-cli/src/components/chat/terminal-message-history.tsx

@@ -6,7 +6,7 @@ import type { FileOpenerScheme } from "src/utils/config.js";
 
 import TerminalChatResponseItem from "./terminal-chat-response-item.js";
 import TerminalHeader from "./terminal-header.js";
-import { Box, Static } from "ink";
+import { Box } from "ink";
 import React, { useMemo } from "react";
 
 // A batch entry can either be a standalone response item or a grouped set of
@@ -42,50 +42,41 @@ const TerminalMessageHistory: React.FC<TerminalMessageHistoryProps> = ({
 
   return (
     <Box flexDirection="column">
-      {/* The dedicated thinking indicator in the input area now displays the
-          elapsed time, so we no longer render a separate counter here. */}
-      <Static items={["header", ...messages]}>
-        {(item, index) => {
-          if (item === "header") {
-            return <TerminalHeader key="header" {...headerProps} />;
-          }
+      {/* Render header first so subsequent updates do not cause it to reappear */}
+      <TerminalHeader {...headerProps} />
+      {messages.map((message, index) => {
+        // Suppress empty reasoning updates (i.e. items with an empty summary).
+        const msg = message as unknown as { summary?: Array<unknown> };
+        if (msg.summary?.length === 0) {
+          return null;
+        }
 
-          // After the guard above, item is a ResponseItem
-          const message = item as ResponseItem;
-          // Suppress empty reasoning updates (i.e. items with an empty summary).
-          const msg = message as unknown as { summary?: Array<unknown> };
-          if (msg.summary?.length === 0) {
-            return null;
-          }
-          return (
-            <Box
-              key={`${message.id}-${index}`}
-              flexDirection="column"
-              marginLeft={
-                message.type === "message" &&
-                (message.role === "user" || message.role === "assistant")
-                  ? 0
-                  : 4
-              }
-              marginTop={
-                message.type === "message" && message.role === "user" ? 0 : 1
-              }
-              marginBottom={
-                message.type === "message" && message.role === "assistant"
-                  ? 1
-                  : 0
-              }
-            >
-              <TerminalChatResponseItem
-                item={message}
-                fullStdout={fullStdout}
-                setOverlayMode={setOverlayMode}
-                fileOpener={fileOpener}
-              />
-            </Box>
-          );
-        }}
-      </Static>
+        return (
+          <Box
+            key={`${message.id}-${index}`}
+            flexDirection="column"
+            marginLeft={
+              message.type === "message" &&
+              (message.role === "user" || message.role === "assistant")
+                ? 0
+                : 4
+            }
+            marginTop={
+              message.type === "message" && message.role === "user" ? 0 : 1
+            }
+            marginBottom={
+              message.type === "message" && message.role === "assistant" ? 1 : 0
+            }
+          >
+            <TerminalChatResponseItem
+              item={message}
+              fullStdout={fullStdout}
+              setOverlayMode={setOverlayMode}
+              fileOpener={fileOpener}
+            />
+          </Box>
+        );
+      })}
     </Box>
   );
 };