From 606590ec80b59c8dfbd14095cf8165918ed9d106 Mon Sep 17 00:00:00 2001
From: JAE <jae@jaeswift.xyz>
Date: Fri, 27 Mar 2026 17:08:52 +0000
Subject: [PATCH] fix: critical bugs preventing messages from sending in web UI

- FIX 1: Agent constructor now wraps model/systemPrompt in initialState
  (was passed as top-level keys which Agent class ignores, causing it to
  default to Google Gemini with empty prompt and no tools)
- FIX 2: chatPanel.setAgent now includes onApiKeyRequired handler using
  ApiKeyPromptDialog.prompt() (was missing, causing silent abort when no
  API key found for provider)
- FIX 3: Fixed toolsFactory signature to match ChatPanel expected params
  (agent, iface, artifacts, runtimeFactory) instead of () => allTools
- FIX 4: Removed broken allTools.map(t => t.tool) - createXxxTool()
  returns AgentTool directly, .tool property does not exist
- FIX 5: Removed invalid convertToLlm from both Agent constructor and
  setAgent config (not a valid AgentOptions or setAgent config key)
- FIX 6: Added pointer-events:none to empty state overlay wrapper with
  pointer-events:auto on interactive child to prevent input blocking
---
 packages/web-ui/example/src/main.ts | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/packages/web-ui/example/src/main.ts b/packages/web-ui/example/src/main.ts
index d330e2e..ad1c1ae 100644
--- a/packages/web-ui/example/src/main.ts
+++ b/packages/web-ui/example/src/main.ts
@@ -240,18 +240,18 @@ async function createAgent(initialState?: AgentState) {
   const memTools = createMemoryTools();
   const allTools = [replTool, webSearch, imageGen, tts, bash, browser, ...memTools];
 
-  agent = new Agent({
+agent = new Agent({
+  initialState: {
     model,
     systemPrompt: SYSTEM_PROMPT,
-    tools: allTools.map((t) => t.tool),
-    convertToLlm: customConvertToLlm,
     ...initialState,
-  });
+  },
+});
 
-  chatPanel.setAgent(agent, {
-    toolsFactory: () => allTools,
-    convertToLlm: customConvertToLlm,
-  });
+chatPanel.setAgent(agent, {
+  onApiKeyRequired: (provider: string) => ApiKeyPromptDialog.prompt(provider),
+  toolsFactory: (_agent, _iface, _artifacts, _runtimeFactory) => allTools,
+});
 
   registerCustomMessageRenderers(chatPanel);
 
@@ -612,8 +612,8 @@ function renderApp() {
           <!-- CHAT AREA -->
           <div class="flex flex-col flex-1 min-w-0 min-h-0 relative ${getViewClasses()}">
             ${!hasMessages ? html`
-              <div class="absolute inset-x-0 top-0 z-10 flex flex-col" style="bottom:130px" @suggestion=${handleSuggestion}>
-                <jae-empty-state style="display:flex;flex-direction:column;flex:1;width:100%;min-height:0"></jae-empty-state>
+              <div class="absolute inset-x-0 top-0 z-10 flex flex-col" style="bottom:130px;pointer-events:none" @suggestion=${handleSuggestion}>
+                <jae-empty-state style="display:flex;flex-direction:column;flex:1;width:100%;min-height:0;pointer-events:auto"></jae-empty-state>
               </div>
             ` : html``}
             <div id="chat-wrapper" class="flex flex-col flex-1 min-h-0">