@budibase/frontend-core 3.27.3 → 3.27.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "3.27.3",
+  "version": "3.27.5",
   "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": "a2ccba6d3b5002fab734abfe9563b7cf2b3a6592"
+  "gitHead": "46316dfbbf8e41a547bc8a4977ccd819a7515b9a"
 }

package/src/api/rows.ts

@@ -11,7 +11,11 @@ import {
 import { BaseAPIClient } from "./types"
 
 export interface RowEndpoints {
-  fetchRow: (tableId: string, rowId: string) => Promise<FindRowResponse>
+  fetchRow: (
+    tableId: string,
+    rowId: string,
+    suppressErrors?: boolean
+  ) => Promise<FindRowResponse>
   saveRow: (
     row: SaveRowRequest,
     suppressErrors?: boolean
@@ -34,10 +38,12 @@ export const buildRowEndpoints = (API: BaseAPIClient): RowEndpoints => ({
    * Fetches data about a certain row in a data source.
    * @param sourceId the ID of the table or view to fetch from
    * @param rowId the ID of the row to fetch
+   * @param suppressErrors whether or not to suppress error notifications
    */
-  fetchRow: async (sourceId, rowId) => {
+  fetchRow: async (sourceId, rowId, suppressErrors = false) => {
     return await API.get({
       url: `/api/${sourceId}/rows/${rowId}`,
+      suppressErrors,
     })
   },
 

package/src/api/user.ts

@@ -43,7 +43,10 @@ export interface UserEndpoints {
   deleteUser: (userId: string) => Promise<DeleteUserResponse>
   deleteUsers: (users: UserIdentifier[]) => Promise<BulkUserDeleted | undefined>
   onboardUsers: (data: InviteUsersRequest) => Promise<InviteUsersResponse>
-  getUserInvite: (code: string) => Promise<CheckInviteResponse>
+  getUserInvite: (
+    code: string,
+    tenantId?: string
+  ) => Promise<CheckInviteResponse>
   getUserInvites: () => Promise<GetUserInvitesResponse>
   inviteUsers: (users: InviteUsersRequest) => Promise<InviteUsersResponse>
   removeUserInvites: (
@@ -223,9 +226,10 @@ export const buildUserEndpoints = (API: BaseAPIClient): UserEndpoints => ({
    * Retrieves the invitation associated with a provided code.
    * @param code The unique code for the target invite
    */
-  getUserInvite: async code => {
+  getUserInvite: async (code, tenantId) => {
+    const query = tenantId ? `?tenantId=${encodeURIComponent(tenantId)}` : ""
     return await API.get({
-      url: `/api/global/users/invite/${code}`,
+      url: `/api/global/users/invite/${code}${query}`,
     })
   },
 

package/src/components/Chatbox/index.svelte

@@ -31,10 +31,13 @@
     chat: ChatConversationLike
     persistConversation?: boolean
     conversationStarters?: { prompt: string }[]
+    initialPrompt?: string
     onchatsaved?: (_event: {
       detail: { chatId?: string; chat: ChatConversationLike }
     }) => void
     isAgentPreviewChat?: boolean
+    readOnly?: boolean
+    readOnlyReason?: "disabled" | "deleted" | "offline"
   }
 
   let {
@@ -42,8 +45,11 @@
     chat = $bindable(),
     persistConversation = true,
     conversationStarters = [],
+    initialPrompt = "",
     onchatsaved,
     isAgentPreviewChat = false,
+    readOnly = false,
+    readOnlyReason,
   }: Props = $props()
 
   let API = $state(
@@ -60,6 +66,7 @@
   let textareaElement = $state<HTMLTextAreaElement>()
   let expandedTools = $state<Record<string, boolean>>({})
   let inputValue = $state("")
+  let lastInitialPrompt = $state("")
   let reasoningTimers = $state<Record<string, number>>({})
 
   const getReasoningText = (message: UIMessage<AgentMessageMetadata>) =>
@@ -78,6 +85,9 @@
       part => isToolUIPart(part) && part.state === "output-error"
     )
 
+  const getMessageError = (message: UIMessage<AgentMessageMetadata>) =>
+    message.metadata?.error
+
   $effect(() => {
     const interval = setInterval(() => {
       let updated = false
@@ -138,6 +148,20 @@
     tick().then(() => textareaElement?.focus())
   }
 
+  $effect(() => {
+    if (!initialPrompt) {
+      lastInitialPrompt = ""
+      return
+    }
+
+    if (initialPrompt === lastInitialPrompt) {
+      return
+    }
+
+    lastInitialPrompt = initialPrompt
+    applyConversationStarter(initialPrompt)
+  })
+
   const chatInstance = new Chat<UIMessage<AgentMessageMetadata>>({
     transport: new DefaultChatTransport({
       headers: () => ({ [Header.APP_ID]: workspaceId }),
@@ -151,6 +175,7 @@
             chatAppId,
             agentId: chat?.agentId,
             transient: !persistConversation,
+            isPreview: isAgentPreviewChat,
             title: chat?.title,
             messages,
           },
@@ -194,12 +219,20 @@
   let isBusy = $derived(
     chatInstance.status === "streaming" || chatInstance.status === "submitted"
   )
-  let hasMessages = $derived(Boolean(chat?.messages?.length))
+  let hasMessages = $derived(Boolean(messages?.length))
   let showConversationStarters = $derived(
     !isBusy &&
       !hasMessages &&
       conversationStarters.length > 0 &&
-      !isAgentPreviewChat
+      !isAgentPreviewChat &&
+      !readOnly
+  )
+  let readOnlyMessage = $derived(
+    readOnlyReason === "deleted"
+      ? "This agent was deleted. Select another agent to resume chatting."
+      : readOnlyReason === "offline"
+        ? "This agent is no longer live. Make it live in Settings to resume chatting."
+        : "This agent is disabled. Enable it in Settings to resume chatting."
   )
 
   let lastChatId = $state<string | undefined>(chat?._id)
@@ -258,6 +291,10 @@
   }
 
   const handleKeyDown = async (event: KeyboardEvent) => {
+    if (readOnly) {
+      return
+    }
+
     if (event.key === "Enter" && !event.shiftKey) {
       event.preventDefault()
       await sendMessage()
@@ -265,6 +302,10 @@
   }
 
   const sendMessage = async () => {
+    if (readOnly) {
+      return
+    }
+
     const chatAppIdFromEnsure = await ensureChatApp()
 
     if (!chat) {
@@ -347,7 +388,9 @@
       mounted = true
       ensureChatApp()
       tick().then(() => {
-        textareaElement?.focus()
+        if (!readOnly) {
+          textareaElement?.focus()
+        }
       })
     }
   })
@@ -385,7 +428,7 @@
           {/each}
         </div>
       </div>
-    {:else}
+    {:else if !hasMessages}
       <div class="empty-state">
         <div class="empty-state-icon">
           <Icon
@@ -409,9 +452,13 @@
         {@const reasoningText = getReasoningText(message)}
         {@const reasoningId = `${message.id}-reasoning`}
         {@const toolError = hasToolError(message)}
+        {@const messageError = getMessageError(message)}
         {@const reasoningStreaming = isReasoningStreaming(message)}
         {@const isThinking =
-          reasoningStreaming && !toolError && !message.metadata?.completedAt}
+          reasoningStreaming &&
+          !toolError &&
+          !messageError &&
+          !message.metadata?.completedAt}
         <div class="message assistant">
           {#if reasoningText}
             <div class="reasoning-part">
@@ -487,7 +534,7 @@
                   <div class="tool-name-wrapper">
                     <span class="tool-name">{getToolName(part)}</span>
                   </div>
-                  {#if isRunning || isError}
+                  {#if isRunning || isError || isSuccess}
                     <span class="tool-status">
                       {#if isRunning}
                         <ProgressCircle size="S" />
@@ -497,6 +544,12 @@
                           size="S"
                           color="var(--spectrum-global-color-red-600)"
                         />
+                      {:else if isSuccess}
+                        <Icon
+                          name="check"
+                          size="S"
+                          color="var(--spectrum-global-color-green-600)"
+                        />
                       {/if}
                     </span>
                   {/if}
@@ -556,16 +609,26 @@
     {/each}
   </div>
 
-  <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>
+  {#if readOnly}
+    <div class="input-wrapper">
+      <div class="read-only-notice">
+        <Body size="S" color="var(--spectrum-global-color-gray-700)">
+          {readOnlyMessage}
+        </Body>
+      </div>
+    </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>
+  {/if}
 </div>
 
 <style>
@@ -602,36 +665,45 @@
   .starter-section {
     display: flex;
     flex-direction: column;
-    gap: var(--spacing-s);
+    align-items: center;
+    gap: var(--spacing-xl);
+    margin: auto 0;
   }
 
   .starter-title {
-    font-size: 12px;
-    text-transform: uppercase;
-    letter-spacing: 0.08em;
-    color: var(--spectrum-global-color-gray-600);
+    font-size: 14px;
+    letter-spacing: 0;
+    color: var(--spectrum-global-color-gray-700);
+    text-align: center;
   }
 
   .starter-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
-    gap: var(--spacing-s);
+    gap: var(--spacing-m);
+    width: min(520px, 100%);
+    margin: 0 auto;
   }
 
   .starter-card {
-    border: 1px solid var(--grey-3);
+    border: 1px solid var(--spectrum-global-color-gray-200);
     border-radius: 12px;
     padding: var(--spacing-m);
-    background: var(--grey-2);
-    color: var(--spectrum-global-color-gray-900);
+    background: var(--spectrum-global-color-gray-50);
+    color: var(--spectrum-global-color-gray-800);
     font: inherit;
-    text-align: left;
+    font-size: 14px;
+    line-height: 1.4;
+    text-align: center;
     cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
   .starter-card:hover {
-    border-color: var(--grey-4);
-    background: var(--grey-1);
+    border-color: var(--spectrum-global-color-gray-300);
+    background: var(--spectrum-global-color-gray-100);
   }
 
   .message {
@@ -674,6 +746,14 @@
     line-height: 1.4;
   }
 
+  .read-only-notice {
+    border: 1px solid var(--spectrum-global-color-gray-200);
+    border-radius: 10px;
+    padding: var(--spacing-m);
+    background-color: var(--spectrum-global-color-gray-50);
+    text-align: center;
+  }
+
   .input {
     width: 100%;
     height: 100px;