Merge branch 'master' into BUDI-9011

lerna.json

@@ -1,6 +1,6 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "3.4.22",
+  "version": "3.4.23",
   "npmClient": "yarn",
   "concurrency": 20,
   "command": {

packages/bbui/src/Form/Core/Multiselect.svelte

@@ -1,22 +1,26 @@
-<script>
+<script lang="ts" context="module">
+  type Option = any
+</script>
+
+<script lang="ts">
   import Picker from "./Picker.svelte"
   import { createEventDispatcher } from "svelte"
 
-  export let value = []
-  export let id = null
-  export let placeholder = null
-  export let disabled = false
-  export let options = []
-  export let getOptionLabel = option => option
-  export let getOptionValue = option => option
-  export let readonly = false
-  export let autocomplete = false
-  export let sort = false
-  export let autoWidth = false
-  export let searchTerm = null
-  export let customPopoverHeight = undefined
-  export let open = false
-  export let loading
+  export let value: string[] = []
+  export let id: string | undefined = undefined
+  export let placeholder: string | null = null
+  export let disabled: boolean = false
+  export let options: Option[] = []
+  export let getOptionLabel = (option: Option, _index?: number) => option
+  export let getOptionValue = (option: Option, _index?: number) => option
+  export let readonly: boolean = false
+  export let autocomplete: boolean = false
+  export let sort: boolean = false
+  export let autoWidth: boolean = false
+  export let searchTerm: string | null = null
+  export let customPopoverHeight: string | undefined = undefined
+  export let open: boolean = false
+  export let loading: boolean
   export let onOptionMouseenter = () => {}
   export let onOptionMouseleave = () => {}
 
@@ -27,10 +31,15 @@
   $: optionLookupMap = getOptionLookupMap(options)
 
   $: fieldText = getFieldText(arrayValue, optionLookupMap, placeholder)
-  $: isOptionSelected = optionValue => selectedLookupMap[optionValue] === true
+  $: isOptionSelected = (optionValue: string) =>
+    selectedLookupMap[optionValue] === true
   $: toggleOption = makeToggleOption(selectedLookupMap, arrayValue)
 
-  const getFieldText = (value, map, placeholder) => {
+  const getFieldText = (
+    value: string[],
+    map: Record<string, any> | null,
+    placeholder: string | null
+  ) => {
     if (Array.isArray(value) && value.length > 0) {
       if (!map) {
         return ""
@@ -42,8 +51,8 @@
     }
   }
 
-  const getSelectedLookupMap = value => {
-    let map = {}
+  const getSelectedLookupMap = (value: string[]) => {
+    const map: Record<string, boolean> = {}
     if (Array.isArray(value) && value.length > 0) {
       value.forEach(option => {
         if (option) {
@@ -54,22 +63,23 @@
     return map
   }
 
-  const getOptionLookupMap = options => {
-    let map = null
-    if (options?.length) {
-      map = {}
-      options.forEach((option, idx) => {
-        const optionValue = getOptionValue(option, idx)
-        if (optionValue != null) {
-          map[optionValue] = getOptionLabel(option, idx) || ""
-        }
-      })
+  const getOptionLookupMap = (options: Option[]) => {
+    if (!options?.length) {
+      return null
     }
+
+    const map: Record<string, any> = {}
+    options.forEach((option, idx) => {
+      const optionValue = getOptionValue(option, idx)
+      if (optionValue != null) {
+        map[optionValue] = getOptionLabel(option, idx) || ""
+      }
+    })
     return map
   }
 
-  const makeToggleOption = (map, value) => {
-    return optionValue => {
+  const makeToggleOption = (map: Record<string, boolean>, value: string[]) => {
+    return (optionValue: string) => {
       if (map[optionValue]) {
         const filtered = value.filter(option => option !== optionValue)
         dispatch("change", filtered)

packages/client/src/components/app/forms/Field.svelte

@@ -5,11 +5,12 @@
   import { memo } from "@budibase/frontend-core"
   import Placeholder from "../Placeholder.svelte"
   import InnerForm from "./InnerForm.svelte"
+  import type { FieldApi } from "."
 
   export let label: string | undefined = undefined
   export let field: string | undefined = undefined
   export let fieldState: any
-  export let fieldApi: any
+  export let fieldApi: FieldApi
   export let fieldSchema: any
   export let defaultValue: string | undefined = undefined
   export let type: any

packages/client/src/components/app/forms/RelationshipField.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { CoreSelect, CoreMultiselect } from "@budibase/bbui"
-  import { FieldType, InternalTable } from "@budibase/types"
+  import { BasicOperator, FieldType, InternalTable } from "@budibase/types"
   import { fetchData, Utils } from "@budibase/frontend-core"
   import { getContext } from "svelte"
   import Field from "./Field.svelte"
@@ -9,10 +9,11 @@
     RelationshipFieldMetadata,
     Row,
   } from "@budibase/types"
+  import type { FieldApi, FieldState } from "."
 
   export let field: string | undefined = undefined
   export let label: string | undefined = undefined
-  export let placeholder: any = undefined
+  export let placeholder: string | undefined = undefined
   export let disabled: boolean = false
   export let readonly: boolean = false
   export let validation: any
@@ -35,12 +36,13 @@
   const { API } = getContext("sdk")
 
   // Field state
-  let fieldState: any
-  let fieldApi: any
+  let fieldState: FieldState<string | string[]> | undefined
+
+  let fieldApi: FieldApi
   let fieldSchema: RelationshipFieldMetadata | undefined
 
   // Local UI state
-  let searchTerm: any
+  let searchTerm: string
   let open: boolean = false
 
   // Options state
@@ -106,17 +108,14 @@
     filter: SearchFilter[],
     linkedTableId?: string
   ) => {
-    if (!linkedTableId) {
-      return undefined
-    }
     const datasource =
-      datasourceType === "table"
+      dsType === "table"
         ? {
-            type: datasourceType,
-            tableId: fieldSchema?.tableId!,
+            type: dsType,
+            tableId: linkedTableId!,
           }
         : {
-            type: datasourceType,
+            type: dsType,
             tableId: InternalTable.USER_METADATA,
           }
     return fetchData({
@@ -306,14 +305,14 @@
     }
 
     // Ensure we match all filters, rather than any
-    let newFilter: any = filter
+    let newFilter = filter
     if (searchTerm) {
       // @ts-expect-error this doesn't fit types, but don't want to change it yet
       newFilter = (newFilter || []).filter(x => x.operator !== "allOr")
       newFilter.push({
         // Use a big numeric prefix to avoid clashing with an existing filter
         field: `999:${primaryDisplay}`,
-        operator: "string",
+        operator: BasicOperator.STRING,
         value: searchTerm,
       })
     }

packages/client/src/components/app/forms/index.ts

@@ -19,3 +19,15 @@ export { default as codescanner } from "./CodeScannerField.svelte"
 export { default as signaturesinglefield } from "./SignatureField.svelte"
 export { default as bbreferencefield } from "./BBReferenceField.svelte"
 export { default as bbreferencesinglefield } from "./BBReferenceSingleField.svelte"
+
+export interface FieldApi {
+  setValue(value: any): boolean
+  deregister(): void
+}
+
+export interface FieldState<T> {
+  value: T
+  fieldId: string
+  disabled: boolean
+  readonly: boolean
+}

packages/shared-core/src/utils.ts

@@ -117,7 +117,8 @@ export function isSupportedUserSearch(
     { op: BasicOperator.EQUAL, key: "_id" },
     { op: ArrayOperator.ONE_OF, key: "_id" },
   ]
-  for (const [key, operation] of Object.entries(query)) {
+  const { allOr, onEmptyFilter, ...filters } = query
+  for (const [key, operation] of Object.entries(filters)) {
     if (typeof operation !== "object") {
       return false
     }