@budibase/frontend-core 3.2.38 → 3.2.40

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "3.2.38",
+  "version": "3.2.40",
   "description": "Budibase frontend core libraries used in builder and client",
   "author": "Budibase",
   "license": "MPL-2.0",
@@ -20,5 +20,5 @@
   "devDependencies": {
     "svelte-check": "^4.1.0"
   },
-  "gitHead": "e3eabe9c968e531a30fe8848141f536d2b8a0b65"
+  "gitHead": "f6424d1f4a4b524be41d8ab389053cc1287cfe9f"
 }

package/src/api/index.ts

@@ -46,6 +46,8 @@ import { buildLogsEndpoints } from "./logs"
 import { buildMigrationEndpoints } from "./migrations"
 import { buildRowActionEndpoints } from "./rowActions"
 
+export type { APIClient } from "./types"
+
 /**
  * Random identifier to uniquely identify a session in a tab. This is
  * used to determine the originator of calls to the API, which is in
@@ -68,13 +70,13 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
   ): Promise<APIError> => {
     // Try to read a message from the error
     let message = response.statusText
-    let json: any = null
+    let json = null
     try {
       json = await response.json()
       if (json?.message) {
         message = json.message
       } else if (json?.error) {
-        message = json.error
+        message = JSON.stringify(json.error)
       }
     } catch (error) {
       // Do nothing
@@ -93,7 +95,7 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
   // Generates an error object from a string
   const makeError = (
     message: string,
-    url?: string,
+    url: string,
     method?: HTTPMethod
   ): APIError => {
     return {
@@ -226,7 +228,7 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
         return await handler(callConfig)
       } catch (error) {
         if (config?.onError) {
-          config.onError(error)
+          config.onError(error as APIError)
         }
         throw error
       }
@@ -239,13 +241,9 @@ export const createAPIClient = (config: APIClientConfig = {}): APIClient => {
     patch: requestApiCall(HTTPMethod.PATCH),
     delete: requestApiCall(HTTPMethod.DELETE),
     put: requestApiCall(HTTPMethod.PUT),
-    error: (message: string) => {
-      throw makeError(message)
-    },
     invalidateCache: () => {
       cache = {}
     },
-
     // Generic utility to extract the current app ID. Assumes that any client
     // that exists in an app context will be attaching our app ID header.
     getAppID: (): string => {

package/src/api/self.ts

@@ -13,7 +13,7 @@ export interface SelfEndpoints {
   generateAPIKey: () => Promise<string | undefined>
   fetchDeveloperInfo: () => Promise<FetchAPIKeyResponse>
   fetchBuilderSelf: () => Promise<GetGlobalSelfResponse>
-  fetchSelf: () => Promise<AppSelfResponse>
+  fetchSelf: () => Promise<AppSelfResponse | null>
 }
 
 export const buildSelfEndpoints = (API: BaseAPIClient): SelfEndpoints => ({

package/src/api/types.ts

@@ -46,7 +46,7 @@ export type Headers = Record<string, string>
 export type APIClientConfig = {
   enableCaching?: boolean
   attachHeaders?: (headers: Headers) => void
-  onError?: (error: any) => void
+  onError?: (error: APIError) => void
   onMigrationDetected?: (migration: string) => void
 }
 
@@ -86,14 +86,13 @@ export type BaseAPIClient = {
   patch: <RequestT = null, ResponseT = void>(
     params: APICallParams<RequestT, ResponseT>
   ) => Promise<ResponseT>
-  error: (message: string) => void
   invalidateCache: () => void
   getAppID: () => string
 }
 
 export type APIError = {
   message?: string
-  url?: string
+  url: string
   method?: HTTPMethod
   json: any
   status: number

package/src/api/user.ts

@@ -21,11 +21,12 @@ import {
   SaveUserResponse,
   SearchUsersRequest,
   SearchUsersResponse,
+  UnsavedUser,
   UpdateInviteRequest,
   UpdateInviteResponse,
   UpdateSelfMetadataRequest,
   UpdateSelfMetadataResponse,
-  User,
+  UserIdentifier,
 } from "@budibase/types"
 import { BaseAPIClient } from "./types"
 
@@ -38,14 +39,9 @@ export interface UserEndpoints {
   createAdminUser: (
     user: CreateAdminUserRequest
   ) => Promise<CreateAdminUserResponse>
-  saveUser: (user: User) => Promise<SaveUserResponse>
+  saveUser: (user: UnsavedUser) => Promise<SaveUserResponse>
   deleteUser: (userId: string) => Promise<DeleteUserResponse>
-  deleteUsers: (
-    users: Array<{
-      userId: string
-      email: string
-    }>
-  ) => Promise<BulkUserDeleted | undefined>
+  deleteUsers: (users: UserIdentifier[]) => Promise<BulkUserDeleted | undefined>
   onboardUsers: (data: InviteUsersRequest) => Promise<InviteUsersResponse>
   getUserInvite: (code: string) => Promise<CheckInviteResponse>
   getUserInvites: () => Promise<GetUserInvitesResponse>
@@ -60,7 +56,7 @@ export interface UserEndpoints {
   getAccountHolder: () => Promise<LookupAccountHolderResponse>
   searchUsers: (data: SearchUsersRequest) => Promise<SearchUsersResponse>
   createUsers: (
-    users: User[],
+    users: UnsavedUser[],
     groups: any[]
   ) => Promise<BulkUserCreated | undefined>
   updateUserInvite: (

package/src/components/grid/lib/{renderers.js → renderers.ts}

@@ -1,4 +1,4 @@
-import { FieldType } from "@budibase/types"
+import { FieldType, UIColumn } from "@budibase/types"
 
 import OptionsCell from "../cells/OptionsCell.svelte"
 import DateCell from "../cells/DateCell.svelte"
@@ -40,13 +40,23 @@ const TypeComponentMap = {
   // Custom types for UI only
   role: RoleCell,
 }
-export const getCellRenderer = column => {
+
+function getCellRendererByType(type: FieldType | "role" | undefined) {
+  if (!type) {
+    return
+  }
+
+  return TypeComponentMap[type as keyof typeof TypeComponentMap]
+}
+
+export const getCellRenderer = (column: UIColumn) => {
   if (column.calculationType) {
     return NumberCell
   }
+
   return (
-    TypeComponentMap[column?.schema?.cellRenderType] ||
-    TypeComponentMap[column?.schema?.type] ||
+    getCellRendererByType(column.schema?.cellRenderType) ||
+    getCellRendererByType(column.schema?.type) ||
     TextCell
   )
 }

package/src/components/grid/lib/{websocket.js → websocket.ts}

@@ -1,12 +1,14 @@
 import { get } from "svelte/store"
 import { createWebsocket } from "../../../utils"
 import { SocketEvent, GridSocketEvent } from "@budibase/shared-core"
+import { Store } from "../stores"
+import { UIDatasource, UIUser } from "@budibase/types"
 
-export const createGridWebsocket = context => {
+export const createGridWebsocket = (context: Store) => {
   const { rows, datasource, users, focusedCellId, definition, API } = context
   const socket = createWebsocket("/socket/grid")
 
-  const connectToDatasource = datasource => {
+  const connectToDatasource = (datasource: UIDatasource) => {
     if (!socket.connected) {
       return
     }
@@ -18,7 +20,7 @@ export const createGridWebsocket = context => {
         datasource,
         appId,
       },
-      ({ users: gridUsers }) => {
+      ({ users: gridUsers }: { users: UIUser[] }) => {
         users.set(gridUsers)
       }
     )
@@ -65,7 +67,7 @@ export const createGridWebsocket = context => {
     GridSocketEvent.DatasourceChange,
     ({ datasource: newDatasource }) => {
       // Listen builder renames, as these aren't handled otherwise
-      if (newDatasource?.name !== get(definition).name) {
+      if (newDatasource?.name !== get(definition)?.name) {
         definition.set(newDatasource)
       }
     }

package/src/fetch/CustomFetch.ts

@@ -1,6 +1,7 @@
 import DataFetch from "./DataFetch"
 
 interface CustomDatasource {
+  type: "custom"
   data: any
 }
 

package/src/fetch/DataFetch.ts

@@ -13,6 +13,7 @@ import {
   UISearchFilter,
 } from "@budibase/types"
 import { APIClient } from "../api/types"
+import { DataFetchType } from "."
 
 const { buildQuery, limit: queryLimit, runQuery, sort } = QueryUtils
 
@@ -59,7 +60,7 @@ export interface DataFetchParams<
  * For other types of datasource, this class is overridden and extended.
  */
 export default abstract class DataFetch<
-  TDatasource extends {},
+  TDatasource extends { type: DataFetchType },
   TDefinition extends {
     schema?: Record<string, any> | null
     primaryDisplay?: string
@@ -368,7 +369,7 @@ export default abstract class DataFetch<
    * @param schema the datasource schema
    * @return {object} the enriched datasource schema
    */
-  private enrichSchema(schema: TableSchema): TableSchema {
+  enrichSchema(schema: TableSchema): TableSchema {
     // Check for any JSON fields so we can add any top level properties
     let jsonAdditions: Record<string, { type: string; nestedJSON: true }> = {}
     for (const fieldKey of Object.keys(schema)) {

package/src/fetch/FieldFetch.ts

@@ -1,7 +1,10 @@
 import { Row } from "@budibase/types"
 import DataFetch from "./DataFetch"
 
-export interface FieldDatasource {
+type Types = "field" | "queryarray" | "jsonarray"
+
+export interface FieldDatasource<TType extends Types> {
+  type: TType
   tableId: string
   fieldType: "attachment" | "array"
   value: string[] | Row[]
@@ -15,8 +18,8 @@ function isArrayOfStrings(value: string[] | Row[]): value is string[] {
   return Array.isArray(value) && !!value[0] && typeof value[0] !== "object"
 }
 
-export default class FieldFetch extends DataFetch<
-  FieldDatasource,
+export default class FieldFetch<TType extends Types> extends DataFetch<
+  FieldDatasource<TType>,
   FieldDefinition
 > {
   async getDefinition(): Promise<FieldDefinition | null> {

package/src/fetch/GroupUserFetch.ts

@@ -8,6 +8,7 @@ interface GroupUserQuery {
 }
 
 interface GroupUserDatasource {
+  type: "groupUser"
   tableId: TableNames.USERS
 }
 
@@ -20,6 +21,7 @@ export default class GroupUserFetch extends DataFetch<
     super({
       ...opts,
       datasource: {
+        type: "groupUser",
         tableId: TableNames.USERS,
       },
     })

package/src/fetch/JSONArrayFetch.ts

@@ -1,7 +1,7 @@
 import FieldFetch from "./FieldFetch"
 import { getJSONArrayDatasourceSchema } from "../utils/json"
 
-export default class JSONArrayFetch extends FieldFetch {
+export default class JSONArrayFetch extends FieldFetch<"jsonarray"> {
   async getDefinition() {
     const { datasource } = this.options
 

package/src/fetch/NestedProviderFetch.ts

@@ -2,6 +2,7 @@ import { Row, TableSchema } from "@budibase/types"
 import DataFetch from "./DataFetch"
 
 interface NestedProviderDatasource {
+  type: "provider"
   value?: {
     schema: TableSchema
     primaryDisplay: string

package/src/fetch/QueryArrayFetch.ts

@@ -4,7 +4,7 @@ import {
   generateQueryArraySchemas,
 } from "../utils/json"
 
-export default class QueryArrayFetch extends FieldFetch {
+export default class QueryArrayFetch extends FieldFetch<"queryarray"> {
   async getDefinition() {
     const { datasource } = this.options
 

package/src/fetch/QueryFetch.ts

@@ -4,6 +4,7 @@ import { ExecuteQueryRequest, Query } from "@budibase/types"
 import { get } from "svelte/store"
 
 interface QueryDatasource {
+  type: "query"
   _id: string
   fields: Record<string, any> & {
     pagination?: {

package/src/fetch/RelationshipFetch.ts

@@ -2,6 +2,7 @@ import { Table } from "@budibase/types"
 import DataFetch from "./DataFetch"
 
 interface RelationshipDatasource {
+  type: "link"
   tableId: string
   rowId: string
   rowTableId: string

package/src/fetch/TableFetch.ts

@@ -1,8 +1,13 @@
 import { get } from "svelte/store"
 import DataFetch from "./DataFetch"
-import { SortOrder, Table, UITable } from "@budibase/types"
+import { SortOrder, Table } from "@budibase/types"
 
-export default class TableFetch extends DataFetch<UITable, Table> {
+interface TableDatasource {
+  type: "table"
+  tableId: string
+}
+
+export default class TableFetch extends DataFetch<TableDatasource, Table> {
   async determineFeatureFlags() {
     return {
       supportsSearch: true,

package/src/fetch/UserFetch.ts

@@ -2,11 +2,7 @@ import { get } from "svelte/store"
 import DataFetch, { DataFetchParams } from "./DataFetch"
 import { TableNames } from "../constants"
 import { utils } from "@budibase/shared-core"
-import {
-  BasicOperator,
-  SearchFilters,
-  SearchUsersRequest,
-} from "@budibase/types"
+import { SearchFilters, SearchUsersRequest } from "@budibase/types"
 
 interface UserFetchQuery {
   appId: string
@@ -14,18 +10,22 @@ interface UserFetchQuery {
 }
 
 interface UserDatasource {
-  tableId: string
+  type: "user"
+  tableId: TableNames.USERS
 }
 
+interface UserDefinition {}
+
 export default class UserFetch extends DataFetch<
   UserDatasource,
-  {},
+  UserDefinition,
   UserFetchQuery
 > {
   constructor(opts: DataFetchParams<UserDatasource, UserFetchQuery>) {
     super({
       ...opts,
       datasource: {
+        type: "user",
         tableId: TableNames.USERS,
       },
     })
@@ -52,7 +52,7 @@ export default class UserFetch extends DataFetch<
 
     const finalQuery: SearchFilters = utils.isSupportedUserSearch(rest)
       ? rest
-      : { [BasicOperator.EMPTY]: { email: null } }
+      : {}
 
     try {
       const opts: SearchUsersRequest = {

package/src/fetch/ViewFetch.ts

@@ -1,9 +1,16 @@
-import { Table, View } from "@budibase/types"
+import { Table } from "@budibase/types"
 import DataFetch from "./DataFetch"
 
-type ViewV1 = View & { name: string }
+type ViewV1Datasource = {
+  type: "view"
+  name: string
+  tableId: string
+  calculation: string
+  field: string
+  groupBy: string
+}
 
-export default class ViewFetch extends DataFetch<ViewV1, Table> {
+export default class ViewFetch extends DataFetch<ViewV1Datasource, Table> {
   async getDefinition() {
     const { datasource } = this.options
 

package/src/fetch/ViewV2Fetch.ts

@@ -1,9 +1,17 @@
-import { SortOrder, UIView, ViewV2, ViewV2Type } from "@budibase/types"
+import { SortOrder, ViewV2Enriched, ViewV2Type } from "@budibase/types"
 import DataFetch from "./DataFetch"
 import { get } from "svelte/store"
 import { helpers } from "@budibase/shared-core"
 
-export default class ViewV2Fetch extends DataFetch<UIView, ViewV2> {
+interface ViewDatasource {
+  type: "viewV2"
+  id: string
+}
+
+export default class ViewV2Fetch extends DataFetch<
+  ViewDatasource,
+  ViewV2Enriched
+> {
   async determineFeatureFlags() {
     return {
       supportsSearch: true,

package/src/fetch/index.ts

@@ -1,18 +1,20 @@
-import TableFetch from "./TableFetch.js"
-import ViewFetch from "./ViewFetch.js"
-import ViewV2Fetch from "./ViewV2Fetch.js"
+import TableFetch from "./TableFetch"
+import ViewFetch from "./ViewFetch"
+import ViewV2Fetch from "./ViewV2Fetch"
 import QueryFetch from "./QueryFetch"
 import RelationshipFetch from "./RelationshipFetch"
 import NestedProviderFetch from "./NestedProviderFetch"
 import FieldFetch from "./FieldFetch"
 import JSONArrayFetch from "./JSONArrayFetch"
-import UserFetch from "./UserFetch.js"
+import UserFetch from "./UserFetch"
 import GroupUserFetch from "./GroupUserFetch"
 import CustomFetch from "./CustomFetch"
-import QueryArrayFetch from "./QueryArrayFetch.js"
-import { APIClient } from "../api/types.js"
+import QueryArrayFetch from "./QueryArrayFetch"
+import { APIClient } from "../api/types"
 
-const DataFetchMap = {
+export type DataFetchType = keyof typeof DataFetchMap
+
+export const DataFetchMap = {
   table: TableFetch,
   view: ViewFetch,
   viewV2: ViewV2Fetch,
@@ -24,15 +26,14 @@ const DataFetchMap = {
 
   // Client specific datasource types
   provider: NestedProviderFetch,
-  field: FieldFetch,
+  field: FieldFetch<"field">,
   jsonarray: JSONArrayFetch,
   queryarray: QueryArrayFetch,
 }
 
 // Constructs a new fetch model for a certain datasource
 export const fetchData = ({ API, datasource, options }: any) => {
-  const Fetch =
-    DataFetchMap[datasource?.type as keyof typeof DataFetchMap] || TableFetch
+  const Fetch = DataFetchMap[datasource?.type as DataFetchType] || TableFetch
   const fetch = new Fetch({ API, datasource, ...options })
 
   // Initially fetch data but don't bother waiting for the result
@@ -43,29 +44,27 @@ export const fetchData = ({ API, datasource, options }: any) => {
 
 // Creates an empty fetch instance with no datasource configured, so no data
 // will initially be loaded
-const createEmptyFetchInstance = <
-  TDatasource extends {
-    type: keyof typeof DataFetchMap
-  }
->({
+const createEmptyFetchInstance = <TDatasource extends { type: DataFetchType }>({
   API,
   datasource,
 }: {
   API: APIClient
   datasource: TDatasource
 }) => {
-  const handler = DataFetchMap[datasource?.type as keyof typeof DataFetchMap]
+  const handler = DataFetchMap[datasource?.type as DataFetchType]
   if (!handler) {
     return null
   }
-  return new handler({ API, datasource: null as any, query: null as any })
+  return new handler({
+    API,
+    datasource: null as never,
+    query: null as any,
+  })
 }
 
 // Fetches the definition of any type of datasource
 export const getDatasourceDefinition = async <
-  TDatasource extends {
-    type: keyof typeof DataFetchMap
-  }
+  TDatasource extends { type: DataFetchType }
 >({
   API,
   datasource,
@@ -79,9 +78,7 @@ export const getDatasourceDefinition = async <
 
 // Fetches the schema of any type of datasource
 export const getDatasourceSchema = <
-  TDatasource extends {
-    type: keyof typeof DataFetchMap
-  }
+  TDatasource extends { type: DataFetchType }
 >({
   API,
   datasource,

package/src/index.ts

@@ -1,5 +1,7 @@
 export { createAPIClient } from "./api"
-export { fetchData } from "./fetch"
+export type { APIClient } from "./api"
+export { fetchData, DataFetchMap } from "./fetch"
+export type { DataFetchType } from "./fetch"
 export * as Constants from "./constants"
 export * from "./stores"
 export * from "./utils"

package/src/utils/utils.js

@@ -209,6 +209,9 @@ export const buildFormBlockButtonConfig = props => {
     {
       "##eventHandlerType": "Close Side Panel",
     },
+    {
+      "##eventHandlerType": "Close Modal",
+    },
 
     ...(actionUrl
       ? [

package/src/components/grid/lib/utils.js

@@ -1,32 +0,0 @@
-// TODO: remove when all stores are typed
-
-import { GeneratedIDPrefix, CellIDSeparator } from "./constants"
-import { Helpers } from "@budibase/bbui"
-
-export const parseCellID = cellId => {
-  if (!cellId) {
-    return { rowId: undefined, field: undefined }
-  }
-  const parts = cellId.split(CellIDSeparator)
-  const field = parts.pop()
-  return { rowId: parts.join(CellIDSeparator), field }
-}
-
-export const getCellID = (rowId, fieldName) => {
-  return `${rowId}${CellIDSeparator}${fieldName}`
-}
-
-export const parseEventLocation = e => {
-  return {
-    x: e.clientX ?? e.touches?.[0]?.clientX,
-    y: e.clientY ?? e.touches?.[0]?.clientY,
-  }
-}
-
-export const generateRowID = () => {
-  return `${GeneratedIDPrefix}${Helpers.uuid()}`
-}
-
-export const isGeneratedRowID = id => {
-  return id?.startsWith(GeneratedIDPrefix)
-}