@budibase/frontend-core 3.27.4 → 3.28.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "3.27.4",
+  "version": "3.28.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": "d0d77e2d7618885095e00c73cefcfefd8ad54877"
+  "gitHead": "b57235144ae6ed94b1b54d9ea73335106feedc02"
 }

package/src/api/index.ts

@@ -54,6 +54,7 @@ import { buildWorkspaceAppEndpoints } from "./workspaceApps"
 import { buildResourceEndpoints } from "./resource"
 import { buildDeploymentEndpoints } from "./deploy"
 import { buildWorkspaceFavouriteEndpoints } from "./workspaceFavourites"
+import { buildWorkspaceHomeEndpoints } from "./workspaceHome"
 import { buildRecaptchaEndpoints } from "./recaptcha"
 import { buildAIConfigEndpoints } from "./aiConfig"
 import { buildVectorDbEndpoints } from "./vectorDbs"
@@ -324,6 +325,7 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
     navigation: buildNavigationEndpoints(API),
     workspaceApp: buildWorkspaceAppEndpoints(API),
     workspace: buildWorkspaceFavouriteEndpoints(API),
+    workspaceHome: buildWorkspaceHomeEndpoints(API),
     resource: buildResourceEndpoints(API),
     recaptcha: buildRecaptchaEndpoints(API),
     aiConfig: buildAIConfigEndpoints(API),

package/src/api/types.ts

@@ -41,6 +41,7 @@ import { WorkspaceAppEndpoints } from "./workspaceApps"
 import { ResourceEndpoints } from "./resource"
 import { DeploymentEndpoints } from "./deploy"
 import { WorkspaceFavouriteEndpoints } from "./workspaceFavourites"
+import { WorkspaceHomeEndpoints } from "./workspaceHome"
 import { RecaptchaEndpoints } from "./recaptcha"
 import { AIConfigEndpoints } from "./aiConfig"
 import { VectorDbEndpoints } from "./vectorDbs"
@@ -155,6 +156,7 @@ export type APIClient = BaseAPIClient &
     navigation: NavigationEndpoints
     workspaceApp: WorkspaceAppEndpoints
     workspace: WorkspaceFavouriteEndpoints
+    workspaceHome: WorkspaceHomeEndpoints
     deployment: DeploymentEndpoints
     recaptcha: RecaptchaEndpoints
     aiConfig: AIConfigEndpoints

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: (
@@ -52,7 +55,7 @@ export interface UserEndpoints {
   acceptInvite: (
     data: AcceptUserInviteRequest
   ) => Promise<AcceptUserInviteResponse>
-  getUserCountByApp: (appId: string) => Promise<number>
+  getUserCountByWorkspace: (workspaceId: string) => Promise<number>
   getAccountHolder: () => Promise<LookupAccountHolderResponse>
   searchUsers: (data: SearchUsersRequest) => Promise<SearchUsersResponse>
   createUsers: (
@@ -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}`,
     })
   },
 
@@ -270,11 +274,11 @@ export const buildUserEndpoints = (API: BaseAPIClient): UserEndpoints => ({
   },
 
   /**
-   * Counts the number of users in an app
+   * Counts the number of users in a workspace
    */
-  getUserCountByApp: async appId => {
+  getUserCountByWorkspace: async workspaceId => {
     const res = await API.get<CountUserResponse>({
-      url: `/api/global/users/count/${appId}`,
+      url: `/api/global/users/count/${workspaceId}`,
     })
     return res.userCount
   },

package/src/api/workspaceHome.ts

@@ -0,0 +1,25 @@
+import {
+  GetGitHubStarsResponse,
+  GetWorkspaceHomeMetricsResponse,
+} from "@budibase/types"
+import { BaseAPIClient } from "./types"
+
+export interface WorkspaceHomeEndpoints {
+  getMetrics: () => Promise<GetWorkspaceHomeMetricsResponse>
+  getGitHubStars: () => Promise<GetGitHubStarsResponse>
+}
+
+export const buildWorkspaceHomeEndpoints = (
+  API: BaseAPIClient
+): WorkspaceHomeEndpoints => ({
+  getMetrics: async () => {
+    return await API.get({
+      url: "/api/workspace/home/metrics",
+    })
+  },
+  getGitHubStars: async () => {
+    return await API.get({
+      url: "/api/global/github/stars",
+    })
+  },
+})

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>) =>
@@ -129,6 +136,8 @@
     return () => clearInterval(interval)
   })
 
+  const PREVIEW_CHAT_APP_ID = "agent-preview"
+
   let resolvedChatAppId = $state<string | undefined>()
   let resolvedConversationId = $state<string | undefined>()
 
@@ -141,6 +150,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 }),
@@ -198,12 +221,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)
@@ -233,6 +264,15 @@
       resolvedChatAppId = chat.chatAppId
       return chat.chatAppId
     }
+
+    if (isAgentPreviewChat) {
+      resolvedChatAppId = PREVIEW_CHAT_APP_ID
+      if (chat) {
+        chat = { ...chat, chatAppId: PREVIEW_CHAT_APP_ID }
+      }
+      return PREVIEW_CHAT_APP_ID
+    }
+
     try {
       const chatApp = await API.fetchChatApp(workspaceId)
       if (chatApp?._id) {
@@ -262,6 +302,10 @@
   }
 
   const handleKeyDown = async (event: KeyboardEvent) => {
+    if (readOnly) {
+      return
+    }
+
     if (event.key === "Enter" && !event.shiftKey) {
       event.preventDefault()
       await sendMessage()
@@ -269,6 +313,10 @@
   }
 
   const sendMessage = async () => {
+    if (readOnly) {
+      return
+    }
+
     const chatAppIdFromEnsure = await ensureChatApp()
 
     if (!chat) {
@@ -290,7 +338,9 @@
 
     resolvedChatAppId = chatAppId
 
-    if (
+    if (isAgentPreviewChat) {
+      resolvedConversationId = chat._id
+    } else if (
       persistConversation &&
       !chat._id &&
       (!chat.messages || chat.messages.length === 0)
@@ -351,7 +401,9 @@
       mounted = true
       ensureChatApp()
       tick().then(() => {
-        textareaElement?.focus()
+        if (!readOnly) {
+          textareaElement?.focus()
+        }
       })
     }
   })
@@ -389,7 +441,7 @@
           {/each}
         </div>
       </div>
-    {:else}
+    {:else if !hasMessages}
       <div class="empty-state">
         <div class="empty-state-icon">
           <Icon
@@ -570,16 +622,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>
@@ -616,36 +678,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 {
@@ -688,6 +759,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;