@budibase/frontend-core 2.10.14 → 2.10.16-alpha.0

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "2.10.14",
+  "version": "2.10.16-alpha.0",
   "description": "Budibase frontend core libraries used in builder and client",
   "author": "Budibase",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "dependencies": {
-    "@budibase/bbui": "2.10.14",
-    "@budibase/shared-core": "2.10.14",
-    "dayjs": "^1.11.7",
+    "@budibase/bbui": "2.10.16-alpha.0",
+    "@budibase/shared-core": "2.10.16-alpha.0",
+    "dayjs": "^1.10.8",
     "lodash": "^4.17.21",
     "socket.io-client": "^4.6.1",
     "svelte": "^3.46.2"
   },
-  "gitHead": "ab7ca87cce8a1e9acefb6386486fecefd18a97c1"
+  "gitHead": "f373448384d66541cf3dfaf59bd1df32efd3661b"
 }

package/src/api/app.js

@@ -1,3 +1,5 @@
+import { sdk } from "@budibase/shared-core"
+
 export const buildAppEndpoints = API => ({
   /**
    * Fetches screen definition for an app.
@@ -81,6 +83,22 @@ export const buildAppEndpoints = API => ({
     })
   },
 
+  /**
+   * Update an application using an export - the body
+   * should be of type FormData, with a "file" and a "password" if encrypted.
+   * @param appId The ID of the app to update - this will always be
+   * converted to development ID.
+   * @param body a FormData body with a file and password.
+   */
+  updateAppFromExport: async (appId, body) => {
+    const devId = sdk.applications.getDevAppID(appId)
+    return await API.post({
+      url: `/api/applications/${devId}/import`,
+      body,
+      json: false,
+    })
+  },
+
   /**
    * Imports an export of all apps.
    * @param apps the FormData containing the apps to import

package/src/api/tables.js

@@ -82,8 +82,9 @@ export const buildTableEndpoints = API => ({
       },
     })
   },
+
   /**
-   * Gets a list o tables.
+   * Gets a list of tables.
    */
   getTables: async () => {
     return await API.get({
@@ -91,6 +92,15 @@ export const buildTableEndpoints = API => ({
     })
   },
 
+  /**
+   * Get a single table based on table ID.
+   */
+  getTable: async tableId => {
+    return await API.get({
+      url: `/api/tables/${tableId}`,
+    })
+  },
+
   /**
    * Saves a table.
    * @param table the table to save

package/src/components/grid/cells/BBReferenceCell.svelte

@@ -0,0 +1,38 @@
+<script>
+  import { getContext } from "svelte"
+  import RelationshipCell from "./RelationshipCell.svelte"
+  import { FieldSubtype } from "@budibase/types"
+
+  const { API } = getContext("grid")
+  const { subtype } = $$props.schema
+
+  const schema = {
+    ...$$props.schema,
+    // This is not really used, just adding some content to be able to render the relationship cell
+    tableId: "external",
+  }
+
+  async function searchFunction(searchParams) {
+    if (subtype !== FieldSubtype.USER) {
+      throw `Search for '${subtype}' not implemented`
+    }
+
+    const results = await API.searchUsers({
+      ...searchParams,
+    })
+
+    // Mapping to the expected data within RelationshipCell
+    return {
+      ...results,
+      data: undefined,
+      rows: results.data,
+    }
+  }
+</script>
+
+<RelationshipCell
+  {...$$props}
+  {schema}
+  {searchFunction}
+  primaryDisplay={"email"}
+/>

package/src/components/grid/cells/HeaderCell.svelte

@@ -20,6 +20,8 @@
     config,
     ui,
     columns,
+    definition,
+    datasource,
   } = getContext("grid")
 
   const bannedDisplayColumnTypes = [
@@ -118,6 +120,33 @@
     open = false
   }
 
+  const duplicateColumn = async () => {
+    open = false
+
+    // Generate new name
+    let newName = `${column.name} copy`
+    let attempts = 2
+    while ($definition.schema[newName]) {
+      newName = `${column.name} copy ${attempts++}`
+    }
+
+    // Save schema with new column
+    const existingColumnDefinition = $definition.schema[column.name]
+    await datasource.actions.saveDefinition({
+      ...$definition,
+      schema: {
+        ...$definition.schema,
+        [newName]: {
+          ...existingColumnDefinition,
+          name: newName,
+          schema: {
+            ...existingColumnDefinition.schema,
+          },
+        },
+      },
+    })
+  }
+
   onMount(() => subscribe("close-edit-column", cancelEdit))
 </script>
 
@@ -192,6 +221,13 @@
       >
         Edit column
       </MenuItem>
+      <MenuItem
+        icon="Duplicate"
+        on:click={duplicateColumn}
+        disabled={!$config.canEditColumns}
+      >
+        Duplicate column
+      </MenuItem>
       <MenuItem
         icon="Label"
         on:click={makeDisplayColumn}

package/src/components/grid/cells/RelationshipCell.svelte

@@ -21,6 +21,8 @@
   import { Icon, Input, ProgressCircle, clickOutside } from "@budibase/bbui"
   import { debounce } from "../../../utils/utils"
 
+  const { API, dispatch } = getContext("grid")
+
   export let value
   export let api
   export let readonly
@@ -30,15 +32,15 @@
   export let invertX = false
   export let invertY = false
   export let contentLines = 1
+  export let searchFunction = API.searchTable
+  export let primaryDisplay
 
-  const { API, dispatch } = getContext("grid")
   const color = getColor(0)
 
   let isOpen = false
   let searchResults
   let searchString
   let lastSearchString
-  let primaryDisplay
   let candidateIndex
   let lastSearchId
   let searching = false
@@ -96,7 +98,7 @@
     lastSearchId = Math.random()
     searching = true
     const thisSearchId = lastSearchId
-    const results = await API.searchTable({
+    const results = await searchFunction({
       paginate: false,
       tableId: schema.tableId,
       limit: 20,
@@ -259,14 +261,16 @@
       on:wheel={e => (focused ? e.stopPropagation() : null)}
     >
       {#each value || [] as relationship}
-        {#if relationship.primaryDisplay}
+        {#if relationship[primaryDisplay] || relationship.primaryDisplay}
           <div class="badge">
             <span
               on:click={editable
                 ? () => showRelationship(relationship._id)
                 : null}
             >
-              {readable(relationship.primaryDisplay)}
+              {readable(
+                relationship[primaryDisplay] || relationship.primaryDisplay
+              )}
             </span>
             {#if editable}
               <Icon

package/src/components/grid/cells/TextCell.svelte

@@ -45,7 +45,7 @@
     on:focus={() => (active = true)}
     on:blur={() => (active = false)}
     {type}
-    value={value || ""}
+    value={value ?? ""}
     on:change={handleChange}
     spellcheck="false"
   />

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

@@ -9,6 +9,7 @@ import BooleanCell from "../cells/BooleanCell.svelte"
 import FormulaCell from "../cells/FormulaCell.svelte"
 import JSONCell from "../cells/JSONCell.svelte"
 import AttachmentCell from "../cells/AttachmentCell.svelte"
+import BBReferenceCell from "../cells/BBReferenceCell.svelte"
 
 const TypeComponentMap = {
   text: TextCell,
@@ -23,6 +24,7 @@ const TypeComponentMap = {
   link: RelationshipCell,
   formula: FormulaCell,
   json: JSONCell,
+  bb_reference: BBReferenceCell,
 }
 export const getCellRenderer = column => {
   return TypeComponentMap[column?.schema?.type] || TextCell

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

@@ -19,12 +19,21 @@ const TypeIconMap = {
   formula: "Calculator",
   json: "Brackets",
   bigint: "TagBold",
+  bb_reference: {
+    user: "User",
+  },
 }
 
 export const getColumnIcon = column => {
   if (column.schema.autocolumn) {
     return "MagicWand"
   }
-  const type = column.schema.type
-  return TypeIconMap[type] || "Text"
+  const { type, subtype } = column.schema
+
+  const result =
+    typeof TypeIconMap[type] === "object" && subtype
+      ? TypeIconMap[type][subtype]
+      : TypeIconMap[type]
+
+  return result || "Text"
 }