@budibase/frontend-core 3.32.4 → 3.32.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "3.32.4",
+  "version": "3.32.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": "2bca48effb7679e79385bd7515d1fd604c609d8f"
+  "gitHead": "9584bb3f87662f62b08760a78ea5fc0e95818410"
 }

package/src/api/agentLogs.ts

@@ -0,0 +1,62 @@
+import type {
+  AgentLogEnvironment,
+  FetchAgentLogsResponse,
+  AgentLogRequestDetail,
+  AgentLogSession,
+} from "@budibase/types"
+import type { BaseAPIClient } from "./types"
+
+export interface AgentLogEndpoints {
+  fetchAgentLogs: (
+    agentId: string,
+    opts?: {
+      startDate?: string
+      endDate?: string
+      bookmark?: string
+      limit?: number
+      statusFilter?: string
+      triggerFilter?: string
+    }
+  ) => Promise<FetchAgentLogsResponse>
+  fetchAgentLogDetail: (
+    agentId: string,
+    requestId: string
+  ) => Promise<AgentLogRequestDetail>
+  fetchAgentLogSession: (
+    agentId: string,
+    sessionId: string,
+    environment: AgentLogEnvironment
+  ) => Promise<AgentLogSession | null>
+}
+
+export const buildAgentLogEndpoints = (
+  API: BaseAPIClient
+): AgentLogEndpoints => ({
+  fetchAgentLogs: async (agentId, opts = {}) => {
+    const params = new URLSearchParams()
+    if (opts.startDate) params.set("startDate", opts.startDate)
+    if (opts.endDate) params.set("endDate", opts.endDate)
+    if (opts.bookmark) params.set("bookmark", opts.bookmark)
+    if (opts.limit !== undefined) params.set("limit", String(opts.limit))
+    if (opts.statusFilter) params.set("statusFilter", opts.statusFilter)
+    if (opts.triggerFilter) params.set("triggerFilter", opts.triggerFilter)
+    const query = params.toString()
+    return await API.get({
+      url: `/api/agent/${agentId}/logs${query ? `?${query}` : ""}`,
+    })
+  },
+
+  fetchAgentLogDetail: async (agentId, requestId) => {
+    return await API.get({
+      url: `/api/agent/${agentId}/logs/${requestId}`,
+    })
+  },
+
+  fetchAgentLogSession: async (agentId, sessionId, environment) => {
+    const params = new URLSearchParams({ sessionId })
+    params.set("environment", environment)
+    return await API.get({
+      url: `/api/agent/${agentId}/logs/session?${params.toString()}`,
+    })
+  },
+})

package/src/api/agents.ts

@@ -1,9 +1,7 @@
 import {
-  AgentFileUploadResponse,
   CreateAgentRequest,
   CreateAgentResponse,
   DuplicateAgentResponse,
-  FetchAgentFilesResponse,
   FetchAgentsResponse,
   ProvisionAgentSlackChannelRequest,
   ProvisionAgentSlackChannelResponse,
@@ -27,15 +25,6 @@ export interface AgentEndpoints {
   updateAgent: (agent: UpdateAgentRequest) => Promise<UpdateAgentResponse>
   duplicateAgent: (agentId: string) => Promise<DuplicateAgentResponse>
   deleteAgent: (agentId: string) => Promise<{ deleted: true }>
-  fetchAgentFiles: (agentId: string) => Promise<FetchAgentFilesResponse>
-  uploadAgentFile: (
-    agentId: string,
-    file: File
-  ) => Promise<AgentFileUploadResponse>
-  deleteAgentFile: (
-    agentId: string,
-    fileId: string
-  ) => Promise<{ deleted: true }>
   syncAgentDiscordCommands: (
     agentId: string,
     body?: SyncAgentDiscordCommandsRequest
@@ -103,28 +92,6 @@ export const buildAgentEndpoints = (API: BaseAPIClient): AgentEndpoints => ({
     })
   },
 
-  fetchAgentFiles: async (agentId: string) => {
-    return await API.get({
-      url: `/api/agent/${agentId}/files`,
-    })
-  },
-
-  uploadAgentFile: async (agentId: string, file: File) => {
-    const formData = new FormData()
-    formData.append("file", file)
-    return await API.post<FormData, AgentFileUploadResponse>({
-      url: `/api/agent/${agentId}/files`,
-      body: formData,
-      json: false,
-    })
-  },
-
-  deleteAgentFile: async (agentId: string, fileId: string) => {
-    return await API.delete({
-      url: `/api/agent/${agentId}/files/${fileId}`,
-    })
-  },
-
   syncAgentDiscordCommands: async (agentId: string, body) => {
     return await API.post<
       SyncAgentDiscordCommandsRequest | undefined,

package/src/api/index.ts

@@ -47,6 +47,7 @@ import { buildMigrationEndpoints } from "./migrations"
 import { buildRowActionEndpoints } from "./rowActions"
 import { buildOAuth2Endpoints } from "./oauth2"
 import { buildAgentEndpoints } from "./agents"
+import { buildAgentLogEndpoints } from "./agentLogs"
 import { buildChatAppEndpoints } from "./chatApps"
 import { buildFeatureFlagEndpoints } from "./features"
 import { buildNavigationEndpoints } from "./navigation"
@@ -58,6 +59,7 @@ import { buildWorkspaceHomeEndpoints } from "./workspaceHome"
 import { buildRecaptchaEndpoints } from "./recaptcha"
 import { buildAIConfigEndpoints } from "./aiConfig"
 import { buildVectorDbEndpoints } from "./vectorDbs"
+import { buildKnowledgeBaseEndpoints } from "./knowledgeBases"
 
 export type { APIClient } from "./types"
 
@@ -317,6 +319,7 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
     ...buildLogsEndpoints(API),
     ...buildMigrationEndpoints(API),
     ...buildAgentEndpoints(API),
+    ...buildAgentLogEndpoints(API),
     ...buildChatAppEndpoints(API),
     ...buildFeatureFlagEndpoints(API),
     deployment: buildDeploymentEndpoints(API),
@@ -331,5 +334,6 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
     recaptcha: buildRecaptchaEndpoints(API),
     aiConfig: buildAIConfigEndpoints(API),
     vectorDb: buildVectorDbEndpoints(API),
+    knowledgeBase: buildKnowledgeBaseEndpoints(API),
   }
 }

package/src/api/knowledgeBases.ts

@@ -0,0 +1,79 @@
+import {
+  CreateKnowledgeBaseRequest,
+  FetchKnowledgeBaseFilesResponse,
+  KnowledgeBase,
+  KnowledgeBaseFileUploadResponse,
+  KnowledgeBaseListResponse,
+  UpdateKnowledgeBaseRequest,
+} from "@budibase/types"
+import { BaseAPIClient } from "./types"
+
+export interface KnowledgeBaseEndpoints {
+  fetch: () => Promise<KnowledgeBaseListResponse>
+  create: (config: CreateKnowledgeBaseRequest) => Promise<KnowledgeBase>
+  update: (config: UpdateKnowledgeBaseRequest) => Promise<KnowledgeBase>
+  delete: (id: string) => Promise<{ deleted: true }>
+  fetchFiles: (
+    knowledgeBaseId: string
+  ) => Promise<FetchKnowledgeBaseFilesResponse>
+  uploadFile: (
+    knowledgeBaseId: string,
+    file: File
+  ) => Promise<KnowledgeBaseFileUploadResponse>
+  deleteFile: (
+    knowledgeBaseId: string,
+    fileId: string
+  ) => Promise<{ deleted: true }>
+}
+
+export const buildKnowledgeBaseEndpoints = (
+  API: BaseAPIClient
+): KnowledgeBaseEndpoints => ({
+  fetch: async () => {
+    return await API.get({
+      url: "/api/knowledge-base",
+    })
+  },
+
+  create: async config => {
+    return await API.post({
+      url: "/api/knowledge-base",
+      body: config,
+    })
+  },
+
+  update: async config => {
+    return await API.put({
+      url: "/api/knowledge-base",
+      body: config,
+    })
+  },
+
+  delete: async id => {
+    return await API.delete({
+      url: `/api/knowledge-base/${id}`,
+    })
+  },
+
+  fetchFiles: async knowledgeBaseId => {
+    return await API.get({
+      url: `/api/knowledge-base/${knowledgeBaseId}/files`,
+    })
+  },
+
+  uploadFile: async (knowledgeBaseId, file) => {
+    const formData = new FormData()
+    formData.append("file", file)
+    return await API.post<FormData, KnowledgeBaseFileUploadResponse>({
+      url: `/api/knowledge-base/${knowledgeBaseId}/files`,
+      body: formData,
+      json: false,
+    })
+  },
+
+  deleteFile: async (knowledgeBaseId, fileId) => {
+    return await API.delete({
+      url: `/api/knowledge-base/${knowledgeBaseId}/files/${fileId}`,
+    })
+  },
+})

package/src/api/types.ts

@@ -35,6 +35,7 @@ import { UserEndpoints } from "./user"
 import { ViewEndpoints } from "./views"
 import { ViewV2Endpoints } from "./viewsV2"
 import { AgentEndpoints } from "./agents"
+import { AgentLogEndpoints } from "./agentLogs"
 import { ChatAppEndpoints } from "./chatApps"
 import { NavigationEndpoints } from "./navigation"
 import { WorkspaceAppEndpoints } from "./workspaceApps"
@@ -45,6 +46,7 @@ import { WorkspaceHomeEndpoints } from "./workspaceHome"
 import { RecaptchaEndpoints } from "./recaptcha"
 import { AIConfigEndpoints } from "./aiConfig"
 import { VectorDbEndpoints } from "./vectorDbs"
+import { KnowledgeBaseEndpoints } from "./knowledgeBases"
 
 export enum HTTPMethod {
   POST = "POST",
@@ -116,6 +118,7 @@ export type APIError = {
 export type APIClient = BaseAPIClient &
   AIEndpoints &
   AgentEndpoints &
+  AgentLogEndpoints &
   ChatAppEndpoints &
   AnalyticsEndpoints &
   AppEndpoints &
@@ -161,4 +164,5 @@ export type APIClient = BaseAPIClient &
     recaptcha: RecaptchaEndpoints
     aiConfig: AIConfigEndpoints
     vectorDb: VectorDbEndpoints
+    knowledgeBase: KnowledgeBaseEndpoints
   }

package/src/components/Chatbox/index.svelte

@@ -16,6 +16,7 @@
   import { tick } from "svelte"
   import { createAPIClient } from "@budibase/frontend-core"
   import { Chat } from "@ai-sdk/svelte"
+  import { formatToolName } from "../../utils/aiTools"
   import {
     DefaultChatTransport,
     isTextUIPart,
@@ -63,7 +64,10 @@
     })
   )
 
-  let stableSessionId = $state(Helpers.uuid())
+  const createStableSessionId = () =>
+    isAgentPreviewChat ? `chat-preview:${Helpers.uuid()}` : Helpers.uuid()
+
+  let stableSessionId = $state(createStableSessionId())
   let chatAreaElement = $state<HTMLDivElement>()
   let textareaElement = $state<HTMLTextAreaElement>()
   let expandedTools = $state<Record<string, boolean>>({})
@@ -257,7 +261,7 @@
   $effect(() => {
     if (chat?._id !== lastChatId) {
       lastChatId = chat?._id
-      stableSessionId = Helpers.uuid()
+      stableSessionId = createStableSessionId()
       chatInstance.messages = chat?.messages || []
       expandedTools = {}
     }
@@ -534,7 +538,12 @@
             {#if isTextUIPart(part)}
               <MarkdownViewer value={part.text} />
             {:else if isToolUIPart(part)}
-              {@const toolId = `${message.id}-${getToolName(part)}-${partIndex}`}
+              {@const rawToolName = getToolName(part)}
+              {@const displayToolName = formatToolName(
+                rawToolName,
+                message.metadata?.toolDisplayNames?.[rawToolName]
+              )}
+              {@const toolId = `${message.id}-${rawToolName}-${partIndex}`}
               {@const isRunning =
                 part.state === "input-streaming" ||
                 part.state === "input-available"}
@@ -553,7 +562,7 @@
                   >
                     <span class="tool-chevron-icon tool-chevron-icon-default">
                       <Icon
-                        name="globe-simple"
+                        name="wrench"
                         size="M"
                         weight="regular"
                         color="var(--spectrum-global-color-gray-600)"
@@ -570,7 +579,14 @@
                   </span>
                   <span class="tool-call-label">Tool call</span>
                   <div class="tool-name-wrapper">
-                    <span class="tool-name">{getToolName(part)}</span>
+                    <span class="tool-name-primary"
+                      >{displayToolName.primary}</span
+                    >
+                    {#if displayToolName.secondary}
+                      <span class="tool-name-secondary">
+                        {displayToolName.secondary}
+                      </span>
+                    {/if}
                   </div>
                   {#if isRunning || isError || isSuccess}
                     <span class="tool-status">
@@ -979,18 +995,25 @@
 
   .tool-name-wrapper {
     display: flex;
-    align-items: center;
-    gap: var(--spacing-s);
-    padding: 3px 6px;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 2px;
+    padding: 6px 8px;
     background-color: var(--spectrum-global-color-gray-200);
-    border-radius: 4px;
+    border-radius: 6px;
   }
 
-  .tool-name {
-    font-family: var(--font-mono), monospace;
+  .tool-name-primary {
     font-size: 13px;
     color: var(--spectrum-global-color-gray-800);
-    font-weight: 400;
+    font-weight: 600;
+    line-height: 1.2;
+  }
+
+  .tool-name-secondary {
+    font-size: 11px;
+    color: var(--spectrum-global-color-gray-600);
+    line-height: 1.2;
   }
 
   .tool-status {

package/src/constants.ts

@@ -88,6 +88,7 @@ export const PlanType = {
   BUSINESS: "business",
   PREMIUM: "premium",
   PREMIUM_PLUS: "premium_plus",
+  PREMIUM_PLUS_TRIAL: "premium_plus_trial",
   ENTERPRISE: "enterprise",
   ENTERPRISE_BASIC_TRIAL: "enterprise_basic_trial",
 }

package/src/utils/aiTools.test.ts

@@ -0,0 +1,95 @@
+import { describe, expect, it } from "vitest"
+import { formatToolName } from "./aiTools"
+
+describe("formatToolName", () => {
+  describe("without readableName", () => {
+    it("humanizes underscored names", () => {
+      expect(formatToolName("fetch_users")).toEqual({
+        primary: "Fetch Users",
+        full: "Fetch Users",
+      })
+    })
+
+    it("humanizes hyphenated names", () => {
+      expect(formatToolName("create-record")).toEqual({
+        primary: "Create Record",
+        full: "Create Record",
+      })
+    })
+
+    it("humanizes mixed separators", () => {
+      expect(formatToolName("get_all-records")).toEqual({
+        primary: "Get All Records",
+        full: "Get All Records",
+      })
+    })
+
+    it("collapses multiple separators", () => {
+      expect(formatToolName("fetch___users")).toEqual({
+        primary: "Fetch Users",
+        full: "Fetch Users",
+      })
+    })
+
+    it("trims whitespace", () => {
+      expect(formatToolName("  fetch_users  ")).toEqual({
+        primary: "Fetch Users",
+        full: "Fetch Users",
+      })
+    })
+
+    it("handles single word", () => {
+      expect(formatToolName("users")).toEqual({
+        primary: "Users",
+        full: "Users",
+      })
+    })
+  })
+
+  describe("with readableName", () => {
+    it("splits on last dot into primary and secondary", () => {
+      expect(formatToolName("raw", "datasource.fetch_rows")).toEqual({
+        primary: "datasource",
+        secondary: "Fetch Rows",
+        full: "datasource - Fetch Rows",
+      })
+    })
+
+    it("returns primary only when no dot present", () => {
+      expect(formatToolName("raw", "fetch_rows")).toEqual({
+        primary: "Fetch Rows",
+        full: "Fetch Rows",
+      })
+    })
+
+    it("handles dot at start (index 0) as single segment", () => {
+      expect(formatToolName("raw", ".fetch_rows")).toEqual({
+        primary: ".Fetch Rows",
+        full: ".Fetch Rows",
+      })
+    })
+
+    it("handles dot at end as single segment", () => {
+      expect(formatToolName("raw", "datasource.")).toEqual({
+        primary: "Datasource.",
+        full: "Datasource.",
+      })
+    })
+
+    it("splits on the last dot when multiple dots exist", () => {
+      expect(formatToolName("raw", "group.datasource.fetch_rows")).toEqual({
+        primary: "group.datasource",
+        secondary: "Fetch Rows",
+        full: "group.datasource - Fetch Rows",
+      })
+    })
+
+    it("humanizes the secondary segment only", () => {
+      expect(formatToolName("raw", "My Source.get_all_users")).toEqual({
+        primary: "My Source",
+        secondary: "Get All Users",
+        full: "My Source - Get All Users",
+      })
+    })
+  })
+})

package/src/utils/aiTools.ts

@@ -0,0 +1,43 @@
+export interface FormattedToolName {
+  full: string
+  primary: string
+  secondary?: string
+}
+
+const humanizeSegment = (value: string): string =>
+  value
+    .replace(/[_-]+/g, " ")
+    .replace(/\s+/g, " ")
+    .trim()
+    .replace(/\b\w/g, letter => letter.toUpperCase())
+
+const splitReadableName = (value: string) => {
+  const lastDotIndex = value.lastIndexOf(".")
+  if (lastDotIndex <= 0 || lastDotIndex >= value.length - 1) {
+    return {
+      primary: humanizeSegment(value),
+    }
+  }
+
+  const primary = value.slice(0, lastDotIndex).trim()
+  const secondary = humanizeSegment(value.slice(lastDotIndex + 1))
+  return {
+    primary,
+    ...(secondary ? { secondary } : {}),
+  }
+}
+
+export const formatToolName = (
+  rawName: string,
+  readableName?: string
+): FormattedToolName => {
+  const { primary, secondary } = readableName
+    ? splitReadableName(readableName)
+    : { primary: humanizeSegment(rawName) }
+
+  return {
+    primary,
+    ...(secondary ? { secondary } : {}),
+    full: secondary ? `${primary} - ${secondary}` : primary,
+  }
+}

package/src/utils/index.ts

@@ -16,5 +16,6 @@ export * from "./table"
 export * from "./components"
 export * from "./validation"
 export * from "./formatting"
+export * from "./aiTools"
 export * from "./login"
 export * from "./translationGroups"