works a lot better with 4o!

frontend/src/components/ChatWindow.jsx

@@ -19,17 +19,18 @@ export default function ChatWindow({ conversation, loading, onConfirm }) {
   }
 
   const filtered = conversation.filter((msg) => {
-    console.log(conversation[conversation.length - 1].actor)
+
     const { actor, response } = msg;
   
     if (actor === "user") {
       return true;
     }
-    if (actor === "response") {
+    if (actor === "agent") {
       const parsed = typeof response === "string" ? safeParse(response) : response;
-      // Keep if next is "question", "confirm", or "confirmed".
+      // Keep if next is "question", "confirm", or "user_confirmed_tool_run".
       // Only skip if next is "done" (or something else).
-      return !["done"].includes(parsed.next);
+      // return !["done"].includes(parsed.next);
+      return true;
     }
     return false;
   });
@@ -37,13 +38,14 @@ export default function ChatWindow({ conversation, loading, onConfirm }) {
   return (
     <div className="flex-grow overflow-y-auto space-y-4">
       {filtered.map((msg, idx) => {
+
         const { actor, response } = msg;
 
         if (actor === "user") {
           return (
             <MessageBubble key={idx} message={{ response }} isUser />
           );
-        } else if (actor === "response") {
+        } else if (actor === "agent") {
           const data =
             typeof response === "string" ? safeParse(response) : response;
           return <LLMResponse key={idx} data={data} onConfirm={onConfirm} />;
@@ -57,16 +59,6 @@ export default function ChatWindow({ conversation, loading, onConfirm }) {
           <LoadingIndicator />
         </div>
       )}
-      {conversation.length > 0 && conversation[conversation.length - 1].actor === "user" && (
-        <div className="flex justify-center">
-          <LoadingIndicator />
-        </div>
-      )}
-      {conversation.length > 0 && conversation[conversation.length - 1].actor === "tool_result_to_llm" && (
-        <div className="flex justify-center">
-          <LoadingIndicator />
-        </div>
-      )}
     </div>
   );
 }

frontend/src/components/LLMResponse.jsx

@@ -14,6 +14,10 @@ export default function LLMResponse({ data, onConfirm }) {
 
   const requiresConfirm = data.next === "confirm";
 
+  if (typeof data.response === "object") {
+    data.response = data.response.response;
+  }
+
   let displayText = (data.response || "").trim();
   if (!displayText && requiresConfirm) {
     displayText = `Agent is ready to run "${data.tool}". Please confirm.`;

frontend/src/pages/App.jsx

@@ -18,9 +18,12 @@ export default function App() {
                     const data = await res.json();
                     // data is now an object like { messages: [ ... ] }
 
-                    if (data.messages && data.messages.some(msg => msg.actor === "response" || msg.actor === "tool_result")) {
+                    if (data.messages && data.messages.length > 0 && (data.messages[data.messages.length - 1].actor === "agent")) {
                         setLoading(false);
                     }
+                    else {
+                        setLoading(true);
+                    }
                     setConversation(data.messages || []);
                 }
             } catch (err) {