From 3fed0ac2e84b59f501ec67e6012c27bd40c9d41e Mon Sep 17 00:00:00 2001
From: Peter Steinberger <steipete@gmail.com>
Date: Sun, 4 Jan 2026 17:11:42 +0000
Subject: [PATCH] fix(ui): show chat send errors

---
 ui/src/ui/app-render.ts       |  1 +
 ui/src/ui/app.ts              |  5 +++--
 ui/src/ui/controllers/chat.ts | 29 +++++++++++++++++++++++++----
 ui/src/ui/views/chat.ts       |  5 +++++
 4 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/ui/src/ui/app-render.ts b/ui/src/ui/app-render.ts
index c84a875ab..120fd5697 100644
--- a/ui/src/ui/app-render.ts
+++ b/ui/src/ui/app-render.ts
@@ -391,6 +391,7 @@ export function renderApp(state: AppViewState) {
               connected: state.connected,
               canSend: state.connected,
               disabledReason: chatDisabledReason,
+              error: state.lastError,
               sessions: state.sessionsResult,
               onRefresh: () => {
                 state.resetToolStream();
diff --git a/ui/src/ui/app.ts b/ui/src/ui/app.ts
index 620080abb..d098e02bc 100644
--- a/ui/src/ui/app.ts
+++ b/ui/src/ui/app.ts
@@ -756,8 +756,9 @@ export class ClawdbotApp extends LitElement {
   }
   async handleSendChat() {
     if (!this.connected) return;
-    await sendChat(this);
-    void loadChatHistory(this);
+    const ok = await sendChat(this);
+    if (ok) void loadChatHistory(this);
+    this.scheduleChatScroll();
   }
 
   async handleWhatsAppStart(force: boolean) {
diff --git a/ui/src/ui/controllers/chat.ts b/ui/src/ui/controllers/chat.ts
index 4e097c67c..c5b36f257 100644
--- a/ui/src/ui/controllers/chat.ts
+++ b/ui/src/ui/controllers/chat.ts
@@ -41,10 +41,20 @@ export async function loadChatHistory(state: ChatState) {
   }
 }
 
-export async function sendChat(state: ChatState) {
-  if (!state.client || !state.connected) return;
+export async function sendChat(state: ChatState): Promise<boolean> {
+  if (!state.client || !state.connected) return false;
   const msg = state.chatMessage.trim();
-  if (!msg) return;
+  if (!msg) return false;
+
+  const now = Date.now();
+  state.chatMessages = [
+    ...state.chatMessages,
+    {
+      role: "user",
+      content: [{ type: "text", text: msg }],
+      timestamp: now,
+    },
+  ];
 
   state.chatSending = true;
   state.chatMessage = "";
@@ -59,11 +69,22 @@ export async function sendChat(state: ChatState) {
       deliver: false,
       idempotencyKey: runId,
     });
+    return true;
   } catch (err) {
+    const error = String(err);
     state.chatRunId = null;
     state.chatStream = null;
     state.chatMessage = msg;
-    state.lastError = String(err);
+    state.lastError = error;
+    state.chatMessages = [
+      ...state.chatMessages,
+      {
+        role: "assistant",
+        content: [{ type: "text", text: "Error: " + error }],
+        timestamp: Date.now(),
+      },
+    ];
+    return false;
   } finally {
     state.chatSending = false;
   }
diff --git a/ui/src/ui/views/chat.ts b/ui/src/ui/views/chat.ts
index d501c3744..2003dc3df 100644
--- a/ui/src/ui/views/chat.ts
+++ b/ui/src/ui/views/chat.ts
@@ -15,6 +15,7 @@ export type ChatProps = {
   connected: boolean;
   canSend: boolean;
   disabledReason: string | null;
+  error: string | null;
   sessions: SessionsListResult | null;
   onRefresh: () => void;
   onDraftChange: (next: string) => void;
@@ -68,6 +69,10 @@ export function renderChat(props: ChatProps) {
           </div>`
         : nothing}
 
+      ${props.error
+        ? html`<div class="callout danger" style="margin-top: 12px;">${props.error}</div>`
+        : nothing}
+
       <div class="chat-thread" role="log" aria-live="polite">
         ${props.loading ? html`<div class="muted">Loading chat…</div>` : nothing}
         ${props.messages.map((m) => renderMessage(m))}