From 4d58a8c722e6f757a477bf3544e82d3c87f8a18d Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Thu, 30 Oct 2025 16:24:13 +0000
Subject: [PATCH 1/4] Fix conversation list UI issues

- Fix conversation list vertical cutoff by increasing max-height from 384px to 600px
- Fix status field mapping from agent_status to status in ConversationInfo interface
- Fix agent name display by using agent.kind instead of agent.name for Agent-Output schema
- Update AgentExecutionStatus enum to match API schema (add waiting_for_confirmation and stuck)
- Update status color classes and icons for new status values
- Update AgentBase interface to use kind as primary field with name as fallback

Co-authored-by: openhands <openhands@all-hands.dev>
---
 example/src/components/ConversationManager.tsx | 17 +++++++++++------
 example/src/utils/serverStatus.ts              |  2 +-
 src/models/conversation.ts                     |  2 ++
 src/types/base.ts                              |  6 +++++-
 4 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/example/src/components/ConversationManager.tsx b/example/src/components/ConversationManager.tsx
index 27bb796..dedf070 100644
--- a/example/src/components/ConversationManager.tsx
+++ b/example/src/components/ConversationManager.tsx
@@ -172,7 +172,8 @@ export const ConversationManager: React.FC = () => {
         agent: conv.agent,
         created_at: conv.created_at,
         updated_at: conv.updated_at,
-        status: conv.status
+        // Map agent_status to status for display
+        status: conv.agent_status || conv.status
       }));
       
       setConversations(conversationData);
@@ -192,7 +193,7 @@ export const ConversationManager: React.FC = () => {
     try {
       // Create a simple agent configuration
       const agent: AgentBase = {
-        name: 'CodeActAgent',
+        kind: 'Agent',
         llm: {
           model: settings.modelName,
           api_key: settings.apiKey || ''
@@ -388,16 +389,18 @@ export const ConversationManager: React.FC = () => {
   };
 
   const getAgentName = (agent: AgentBase) => {
-    return agent.name || 'Unknown Agent';
+    return agent.kind || agent.name || 'Unknown Agent';
   };
 
   const getStatusColorClass = (status?: string) => {
     switch (status) {
       case 'running': return 'text-green-500';
-      case 'stopped': return 'text-red-500';
+      case 'idle': return 'text-gray-500';
       case 'paused': return 'text-orange-500';
+      case 'waiting_for_confirmation': return 'text-yellow-500';
       case 'finished': return 'text-blue-500';
       case 'error': return 'text-red-600';
+      case 'stuck': return 'text-red-500';
       default: return 'text-gray-500';
     }
   };
@@ -405,10 +408,12 @@ export const ConversationManager: React.FC = () => {
   const getStatusIcon = (status?: string) => {
     switch (status) {
       case 'running': return '🔄';
-      case 'stopped': return '⏹️';
+      case 'idle': return '⏸️';
       case 'paused': return '⏸️';
+      case 'waiting_for_confirmation': return '⏳';
       case 'finished': return '✅';
       case 'error': return '❌';
+      case 'stuck': return '🚫';
       default: return '❓';
     }
   };
@@ -455,7 +460,7 @@ export const ConversationManager: React.FC = () => {
               <p>No conversations yet. Create your first conversation!</p>
             </div>
           ) : (
-            <div className="space-y-3 max-h-96 overflow-y-auto">
+            <div className="space-y-3 max-h-[600px] overflow-y-auto">
               {conversations.map((conversation) => (
                 <div 
                   key={conversation.id} 
diff --git a/example/src/utils/serverStatus.ts b/example/src/utils/serverStatus.ts
index b641173..9332bc5 100644
--- a/example/src/utils/serverStatus.ts
+++ b/example/src/utils/serverStatus.ts
@@ -55,7 +55,7 @@ export const testLLMConfiguration = async (settings: Settings): Promise<{ succes
     const conversation = await RemoteConversation.create(
       settings.agentServerUrl,
       {
-        name: 'TestAgent',
+        kind: 'Agent',
         llm: {
           model: settings.modelName,
           api_key: settings.apiKey,
diff --git a/src/models/conversation.ts b/src/models/conversation.ts
index 061325a..64cd45a 100644
--- a/src/models/conversation.ts
+++ b/src/models/conversation.ts
@@ -25,6 +25,8 @@ export interface ConversationInfo {
   title?: string;
   created_at?: string;
   updated_at?: string;
+  // Add status as an alias for agent_status for backward compatibility
+  status?: AgentExecutionStatus;
   [key: string]: any;
 }
 
diff --git a/src/types/base.ts b/src/types/base.ts
index fd5120e..3b70cbb 100644
--- a/src/types/base.ts
+++ b/src/types/base.ts
@@ -72,8 +72,10 @@ export interface ImageContent extends MessageContent {
 }
 
 export interface AgentBase {
-  name: string;
+  kind: string;
   llm: LLM;
+  // Keep name for backward compatibility
+  name?: string;
   [key: string]: any;
 }
 
@@ -109,8 +111,10 @@ export enum AgentExecutionStatus {
   IDLE = 'idle',
   RUNNING = 'running',
   PAUSED = 'paused',
+  WAITING_FOR_CONFIRMATION = 'waiting_for_confirmation',
   FINISHED = 'finished',
   ERROR = 'error',
+  STUCK = 'stuck',
 }
 
 export interface ConversationStats {

From 6d8b7355c9658cf2234cfbb3539b7a390d928139 Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Thu, 30 Oct 2025 16:30:31 +0000
Subject: [PATCH 2/4] Remove agent name from UI

- Remove agent name display from conversation list items
- Remove agent name from conversation details section
- Remove unused getAgentName function
- Clean up UI to focus on more relevant information

Co-authored-by: openhands <openhands@all-hands.dev>
---
 example/src/components/ConversationManager.tsx | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/example/src/components/ConversationManager.tsx b/example/src/components/ConversationManager.tsx
index dedf070..e78c13f 100644
--- a/example/src/components/ConversationManager.tsx
+++ b/example/src/components/ConversationManager.tsx
@@ -388,10 +388,6 @@ export const ConversationManager: React.FC = () => {
     return new Date(dateString).toLocaleString();
   };
 
-  const getAgentName = (agent: AgentBase) => {
-    return agent.kind || agent.name || 'Unknown Agent';
-  };
-
   const getStatusColorClass = (status?: string) => {
     switch (status) {
       case 'running': return 'text-green-500';
@@ -476,7 +472,6 @@ export const ConversationManager: React.FC = () => {
                       ID: {conversation.id.substring(0, 8)}...
                     </div>
                     <div className="space-y-1 text-sm">
-                      <div className="text-gray-900 dark:text-white">Agent: {getAgentName(conversation.agent)}</div>
                       <div className="text-gray-600 dark:text-gray-400">Created: {formatDate(conversation.created_at)}</div>
                       <div className="flex items-center gap-2">
                         <span className="text-gray-600 dark:text-gray-400">Status:</span>
@@ -524,10 +519,7 @@ export const ConversationManager: React.FC = () => {
                       {getStatusIcon(selectedConversation.status)} {selectedConversation.status || 'unknown'}
                     </span>
                   </div>
-                  <div className="flex justify-between">
-                    <span className="font-medium text-gray-900 dark:text-white">Agent:</span>
-                    <span className="text-gray-600 dark:text-gray-400">{getAgentName(selectedConversation.agent)}</span>
-                  </div>
+
                   <div className="flex justify-between">
                     <span className="font-medium text-gray-900 dark:text-white">Model:</span>
                     <span className="text-gray-600 dark:text-gray-400">{selectedConversation.agent.llm?.model || 'Unknown'}</span>

From 0dab6d875b6a59e6ce6eca6f33df74b22319e468 Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Thu, 30 Oct 2025 16:34:15 +0000
Subject: [PATCH 3/4] Left align conversation details in list items

- Add text-left class to conversation content container
- Ensures all conversation details (ID, Created date, Status) are left-aligned
- Improves visual consistency and readability

Co-authored-by: openhands <openhands@all-hands.dev>
---
 example/src/components/ConversationManager.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/example/src/components/ConversationManager.tsx b/example/src/components/ConversationManager.tsx
index e78c13f..8a78990 100644
--- a/example/src/components/ConversationManager.tsx
+++ b/example/src/components/ConversationManager.tsx
@@ -467,7 +467,7 @@ export const ConversationManager: React.FC = () => {
                   }`}
                   onClick={() => selectConversation(conversation.id)}
                 >
-                  <div className="flex-1 min-w-0">
+                  <div className="flex-1 min-w-0 text-left">
                     <div className="text-sm font-mono text-gray-600 dark:text-gray-400 mb-2">
                       ID: {conversation.id.substring(0, 8)}...
                     </div>

From 606630add61aa1f236c44daa3aca6519c6bf13e2 Mon Sep 17 00:00:00 2001
From: openhands <openhands@all-hands.dev>
Date: Thu, 30 Oct 2025 16:38:12 +0000
Subject: [PATCH 4/4] Remove duplicate status field display

- Remove duplicate 'Agent Status' field from conversation details
- Consolidate to single 'Status' field that shows agent_status
- Update all status refresh logic to use unified status field
- Remove unused agentStatus from ConversationData interface
- Clean up unused AgentExecutionStatus import
- Eliminates confusing duplicate status information in UI

Co-authored-by: openhands <openhands@all-hands.dev>
---
 .../src/components/ConversationManager.tsx    | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/example/src/components/ConversationManager.tsx b/example/src/components/ConversationManager.tsx
index 8a78990..9541bfd 100644
--- a/example/src/components/ConversationManager.tsx
+++ b/example/src/components/ConversationManager.tsx
@@ -4,7 +4,6 @@ import {
   ConversationInfo,
   RemoteConversation,
   AgentBase,
-  AgentExecutionStatus,
   Event
 } from '@openhands/agent-server-typescript-client';
 import { useSettings } from '../contexts/SettingsContext';
@@ -12,7 +11,6 @@ import { useSettings } from '../contexts/SettingsContext';
 interface ConversationData extends ConversationInfo {
   remoteConversation?: RemoteConversation;
   events?: Event[];
-  agentStatus?: AgentExecutionStatus;
 }
 
 // Utility function to extract displayable content from events
@@ -136,7 +134,7 @@ export const ConversationManager: React.FC = () => {
         const status = await selectedConversation.remoteConversation!.state.getAgentStatus();
         setConversations(prev => prev.map(conv => 
           conv.id === selectedConversation.id 
-            ? { ...conv, agentStatus: status }
+            ? { ...conv, status: status }
             : conv
         ));
       } catch (err) {
@@ -146,13 +144,13 @@ export const ConversationManager: React.FC = () => {
 
     // Refresh every 2 seconds if the agent is running
     const interval = setInterval(() => {
-      if (selectedConversation.agentStatus === 'running') {
+      if (selectedConversation.status === 'running') {
         refreshStatus();
       }
     }, 2000);
 
     return () => clearInterval(interval);
-  }, [selectedConversation?.id, selectedConversation?.agentStatus]);
+  }, [selectedConversation?.id, selectedConversation?.status]);
 
   const loadConversations = async (conversationManager?: SDKConversationManager) => {
     const mgr = conversationManager || manager;
@@ -313,7 +311,7 @@ export const ConversationManager: React.FC = () => {
               remoteConversation.state.getAgentStatus().then(status => {
                 setConversations(prev => prev.map(conv => 
                   conv.id === conversationId 
-                    ? { ...conv, agentStatus: status }
+                    ? { ...conv, status: status }
                     : conv
                 ));
               }).catch(err => console.warn('Failed to update agent status:', err));
@@ -353,7 +351,7 @@ export const ConversationManager: React.FC = () => {
       // Update the conversation in our state with additional details
       setConversations(prev => prev.map(conv => 
         conv.id === conversationId 
-          ? { ...conv, remoteConversation, events, agentStatus }
+          ? { ...conv, remoteConversation, events, status: agentStatus }
           : conv
       ));
       
@@ -532,12 +530,7 @@ export const ConversationManager: React.FC = () => {
                     <span className="font-medium text-gray-900 dark:text-white">Updated:</span>
                     <span className="text-gray-600 dark:text-gray-400">{formatDate(selectedConversation.updated_at)}</span>
                   </div>
-                  {selectedConversation.agentStatus && (
-                    <div className="flex justify-between">
-                      <span className="font-medium text-gray-900 dark:text-white">Agent Status:</span>
-                      <span className="text-gray-600 dark:text-gray-400">{selectedConversation.agentStatus}</span>
-                    </div>
-                  )}
+
                   <div className="flex justify-between">
                     <span className="font-medium text-gray-900 dark:text-white">Total Events:</span>
                     <span className="text-gray-600 dark:text-gray-400">{selectedConversation.events?.length || 0}</span>