1 files changed, 39 insertions, 0 deletions
diff --git a/packages/cli/src/ui/components/HistoryDisplay.tsx b/packages/cli/src/ui/components/HistoryDisplay.tsx
new file mode 100644
index 00000000..bacbb258
--- /dev/null
+++ b/packages/cli/src/ui/components/HistoryDisplay.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import { Box } from 'ink';
+import type { HistoryItem } from '../types.js';
+import { UI_WIDTH } from '../constants.js';
+import UserMessage from './messages/UserMessage.js';
+import GeminiMessage from './messages/GeminiMessage.js';
+import InfoMessage from './messages/InfoMessage.js';
+import ErrorMessage from './messages/ErrorMessage.js';
+import ToolGroupMessage from './messages/ToolGroupMessage.js';
+import { PartListUnion } from '@google/genai';
+
+interface HistoryDisplayProps {
+    history: HistoryItem[];
+    onSubmit: (value: PartListUnion) => void;
+}
+
+const HistoryDisplay: React.FC<HistoryDisplayProps> = ({ history, onSubmit }) => {
+    // No grouping logic needed here anymore
+    return (
+        <Box flexDirection="column">
+            {history.map((item) => (
+                <Box key={item.id} marginBottom={1}>
+                    {/* Render standard message types */}
+                    {item.type === 'user' && <UserMessage text={item.text} />}
+                    {item.type === 'gemini' && <GeminiMessage text={item.text} />}
+                    {item.type === 'info' && <InfoMessage text={item.text} />}
+                    {item.type === 'error' && <ErrorMessage text={item.text} />}
+
+                    {/* Render the tool group component */}
+                    {item.type === 'tool_group' && (
+                        <ToolGroupMessage toolCalls={item.tools} onSubmit={onSubmit} />
+                    )}
+                </Box>
+            ))}
+        </Box>
+    );
+};
+
+export default HistoryDisplay;
+\ No newline at end of file