@budibase/frontend-core 3.28.3 → 3.29.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "3.28.3",
+  "version": "3.29.0",
   "description": "Budibase frontend core libraries used in builder and client",
   "author": "Budibase",
   "license": "MPL-2.0",
@@ -24,5 +24,5 @@
   "devDependencies": {
     "vitest": "^3.2.4"
   },
-  "gitHead": "40bc76dc62aa2c1876e442d464c17aa388630975"
+  "gitHead": "d16e42b03ed3e4e7e1c1b055810fa54879aa8706"
 }

package/src/api/agents.ts

@@ -7,6 +7,8 @@ import {
   FetchAgentsResponse,
   SyncAgentDiscordCommandsRequest,
   SyncAgentDiscordCommandsResponse,
+  ToggleAgentDiscordRequest,
+  ToggleAgentDiscordResponse,
   ToolMetadata,
   UpdateAgentRequest,
   UpdateAgentResponse,
@@ -34,6 +36,10 @@ export interface AgentEndpoints {
     agentId: string,
     body?: SyncAgentDiscordCommandsRequest
   ) => Promise<SyncAgentDiscordCommandsResponse>
+  toggleAgentDiscordDeployment: (
+    agentId: string,
+    enabled: boolean
+  ) => Promise<ToggleAgentDiscordResponse>
 }
 
 export const buildAgentEndpoints = (API: BaseAPIClient): AgentEndpoints => ({
@@ -108,4 +114,14 @@ export const buildAgentEndpoints = (API: BaseAPIClient): AgentEndpoints => ({
       body,
     })
   },
+
+  toggleAgentDiscordDeployment: async (agentId: string, enabled: boolean) => {
+    return await API.post<
+      ToggleAgentDiscordRequest,
+      ToggleAgentDiscordResponse
+    >({
+      url: `/api/agent/${agentId}/discord/toggle`,
+      body: { enabled },
+    })
+  },
 })

package/src/components/Chatbox/index.svelte

@@ -221,6 +221,7 @@
   let isBusy = $derived(
     chatInstance.status === "streaming" || chatInstance.status === "submitted"
   )
+  let canStart = $derived(inputValue.trim().length > 0)
   let hasMessages = $derived(Boolean(messages?.length))
   let showConversationStarters = $derived(
     !isBusy &&
@@ -372,6 +373,14 @@
     chatInstance.sendMessage({ text })
   }
 
+  const handlePromptAction = async () => {
+    if (isBusy) {
+      await chatInstance.stop()
+      return
+    }
+    await sendMessage()
+  }
+
   const toggleTool = (toolId: string) => {
     expandedTools = { ...expandedTools, [toolId]: !expandedTools[toolId] }
   }
@@ -632,14 +641,30 @@
     </div>
   {:else}
     <div class="input-wrapper">
-      <textarea
-        bind:value={inputValue}
-        bind:this={textareaElement}
-        class="input spectrum-Textfield-input"
-        onkeydown={handleKeyDown}
-        placeholder="Ask anything"
-        disabled={isBusy}
-      ></textarea>
+      <div class="input-container">
+        <textarea
+          bind:value={inputValue}
+          bind:this={textareaElement}
+          class="input spectrum-Textfield-input"
+          onkeydown={handleKeyDown}
+          placeholder="Ask..."
+          disabled={isBusy}
+        ></textarea>
+        <button
+          type="button"
+          class="prompt-action"
+          class:running={isBusy}
+          onclick={handlePromptAction}
+          aria-label={isBusy ? "Pause response" : "Start response"}
+          disabled={!isBusy && !canStart}
+        >
+          {#if isBusy}
+            <Icon name="stop" size="M" weight="fill" color="#ffffff" />
+          {:else}
+            <Icon name="arrow-up" size="M" weight="bold" color="#111111" />
+          {/if}
+        </button>
+      </div>
     </div>
   {/if}
 </div>
@@ -767,9 +792,14 @@
     text-align: center;
   }
 
+  .input-container {
+    position: relative;
+    width: 100%;
+  }
+
   .input {
     width: 100%;
-    height: 100px;
+    height: 80px;
     top: 0;
     resize: none;
     padding: 20px;
@@ -779,7 +809,7 @@
     border-radius: 10px;
     border: 1px solid var(--spectrum-global-color-gray-300) !important;
     outline: none;
-    min-height: 100px;
+    min-height: 80px;
   }
 
   .input:focus {
@@ -790,6 +820,37 @@
     color: var(--spectrum-global-color-gray-600);
   }
 
+  .prompt-action {
+    position: absolute;
+    right: 10px;
+    bottom: 10px;
+    width: 24px;
+    height: 24px;
+    min-width: 24px;
+    padding: 0;
+    border: none;
+    border-radius: 999px;
+    background: #f2f2f2;
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    transition: opacity 0.15s ease;
+  }
+
+  .prompt-action:hover:not(:disabled) {
+    opacity: 0.9;
+  }
+
+  .prompt-action.running {
+    background: rgba(255, 255, 255, 0.14);
+  }
+
+  .prompt-action:disabled {
+    opacity: 0.45;
+    cursor: not-allowed;
+  }
+
   /* Style the markdown tool sections in assistant messages */
   :global(.assistant strong) {
     color: var(--spectrum-global-color-gray-900);