From 3e36b09376b8acedad354929987241460dda2f6f Mon Sep 17 00:00:00 2001
From: Richard Palethorpe <io@richiejp.com>
Date: Wed, 26 Mar 2025 06:31:45 +0000
Subject: [PATCH] fix(ui): Format status result as string

---
 webui/react-ui/src/pages/AgentStatus.jsx | 25 ++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/webui/react-ui/src/pages/AgentStatus.jsx b/webui/react-ui/src/pages/AgentStatus.jsx
index 74c91ca..8cf635b 100644
--- a/webui/react-ui/src/pages/AgentStatus.jsx
+++ b/webui/react-ui/src/pages/AgentStatus.jsx
@@ -54,6 +54,23 @@ function AgentStatus() {
     };
   }, [name]);
 
+  // Helper function to safely convert any value to a displayable string
+  const formatValue = (value) => {
+    if (value === null || value === undefined) {
+      return 'N/A';
+    }
+    
+    if (typeof value === 'object') {
+      try {
+        return JSON.stringify(value, null, 2);
+      } catch (err) {
+        return '[Complex Object]';
+      }
+    }
+    
+    return String(value);
+  };
+
   if (loading) {
     return (
       <div className="loading-container">
@@ -102,20 +119,20 @@ function AgentStatus() {
                   <div className="status-details">
                     <div className="status-row">
                       <span className="status-label">Result:</span>
-                      <span className="status-value">{item.Result || 'N/A'}</span>
+                      <span className="status-value">{formatValue(item.Result)}</span>
                     </div>
                     <div className="status-row">
                       <span className="status-label">Action:</span>
-                      <span className="status-value">{item.Action || 'N/A'}</span>
+                      <span className="status-value">{formatValue(item.Action)}</span>
                     </div>
                     <div className="status-row">
                       <span className="status-label">Parameters:</span>
-                      <span className="status-value">{item.Params || 'N/A'}</span>
+                      <span className="status-value pre-wrap">{formatValue(item.Params)}</span>
                     </div>
                     {item.Reasoning && (
                       <div className="status-row">
                         <span className="status-label">Reasoning:</span>
-                        <span className="status-value reasoning">{item.Reasoning}</span>
+                        <span className="status-value reasoning">{formatValue(item.Reasoning)}</span>
                       </div>
                     )}
                   </div>