diff --git a/packages/bbui/src/Table/CellRenderer.svelte b/packages/bbui/src/Table/CellRenderer.svelte index c64b975884..4ad6e22d7e 100644 --- a/packages/bbui/src/Table/CellRenderer.svelte +++ b/packages/bbui/src/Table/CellRenderer.svelte @@ -25,6 +25,7 @@ longform: StringRenderer, array: ArrayRenderer, internal: InternalRenderer, + bb_reference: RelationshipRenderer, } $: type = getType(schema) $: customRenderer = customRenderers?.find(x => x.column === schema?.name) diff --git a/packages/builder/src/components/design/settings/componentSettings.js b/packages/builder/src/components/design/settings/componentSettings.js index 6d673cbd3d..4c49587372 100644 --- a/packages/builder/src/components/design/settings/componentSettings.js +++ b/packages/builder/src/components/design/settings/componentSettings.js @@ -65,6 +65,7 @@ const componentMap = { "field/array": FormFieldSelect, "field/json": FormFieldSelect, "field/barcodeqr": FormFieldSelect, + "field/bb_reference": FormFieldSelect, // Some validation types are the same as others, so not all types are // explicitly listed here. e.g. options uses string validation "validation/string": ValidationEditor, @@ -74,6 +75,7 @@ const componentMap = { "validation/datetime": ValidationEditor, "validation/attachment": ValidationEditor, "validation/link": ValidationEditor, + "validation/bb_reference": ValidationEditor, } export const getComponentForSetting = setting => { diff --git a/packages/builder/src/components/design/settings/controls/FieldConfiguration/utils.js b/packages/builder/src/components/design/settings/controls/FieldConfiguration/utils.js index d4a8963dba..c929263db1 100644 --- a/packages/builder/src/components/design/settings/controls/FieldConfiguration/utils.js +++ b/packages/builder/src/components/design/settings/controls/FieldConfiguration/utils.js @@ -43,4 +43,5 @@ export const FieldTypeToComponentMap = { link: "relationshipfield", json: "jsonfield", barcodeqr: "codescanner", + bb_reference: "bbreferencefield", } diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/new/_components/componentStructure.json b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/new/_components/componentStructure.json index ee0f99a074..11a130490a 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/new/_components/componentStructure.json +++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/new/_components/componentStructure.json @@ -69,7 +69,8 @@ "datetimefield", "multifieldselect", "s3upload", - "codescanner" + "codescanner", + "bbreferencefield" ] }, { diff --git a/packages/client/manifest.json b/packages/client/manifest.json index 6788925c31..4e56ca758d 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -5623,5 +5623,73 @@ "defaultValue": false } ] + }, + "bbreferencefield": { + "devComment": "As bb reference is only used for user subtype for now, we are using user for icon and labels", + "name": "User Field", + "icon": "User", + "styles": ["size"], + "requiredAncestors": ["form"], + "editable": true, + "size": { + "width": 400, + "height": 50 + }, + "settings": [ + { + "type": "field/bb_reference", + "label": "Field", + "key": "field", + "required": true + }, + { + "type": "text", + "label": "Label", + "key": "label" + }, + { + "type": "text", + "label": "Placeholder", + "key": "placeholder" + }, + { + "type": "text", + "label": "Default value", + "key": "defaultValue" + }, + { + "type": "event", + "label": "On change", + "key": "onChange", + "context": [ + { + "label": "Field Value", + "key": "value" + } + ] + }, + { + "type": "validation/link", + "label": "Validation", + "key": "validation" + }, + { + "type": "filter/relationship", + "label": "Filtering", + "key": "filter" + }, + { + "type": "boolean", + "label": "Search", + "key": "autocomplete", + "defaultValue": true + }, + { + "type": "boolean", + "label": "Disabled", + "key": "disabled", + "defaultValue": false + } + ] } } diff --git a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte index f2887e97ad..ec5daa21b1 100644 --- a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte +++ b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte @@ -30,6 +30,7 @@ link: "relationshipfield", json: "jsonfield", barcodeqr: "codescanner", + bb_reference: "bbreferencefield", } let formId diff --git a/packages/client/src/components/app/forms/BBReferenceField.svelte b/packages/client/src/components/app/forms/BBReferenceField.svelte new file mode 100644 index 0000000000..7d11ff5525 --- /dev/null +++ b/packages/client/src/components/app/forms/BBReferenceField.svelte @@ -0,0 +1,9 @@ + + + diff --git a/packages/client/src/components/app/forms/RelationshipField.svelte b/packages/client/src/components/app/forms/RelationshipField.svelte index c9fe4a8549..768f784d49 100644 --- a/packages/client/src/components/app/forms/RelationshipField.svelte +++ b/packages/client/src/components/app/forms/RelationshipField.svelte @@ -16,6 +16,8 @@ export let defaultValue export let onChange export let filter + export let datasourceType = "table" + export let primaryDisplay let fieldState let fieldApi @@ -24,12 +26,15 @@ let searchTerm let open + $: type = + datasourceType === "table" ? FieldTypes.LINK : FieldTypes.BB_REFERENCE + $: multiselect = fieldSchema?.relationshipType !== "one-to-many" $: linkedTableId = fieldSchema?.tableId $: fetch = fetchData({ API, datasource: { - type: "table", + type: datasourceType, tableId: linkedTableId, }, options: { @@ -44,7 +49,7 @@ : flatten(fieldState?.value)?.[0] $: component = multiselect ? CoreMultiselect : CoreSelect $: expandedDefaultValue = expand(defaultValue) - $: primaryDisplay = tableDefinition?.primaryDisplay + $: primaryDisplay = primaryDisplay || tableDefinition?.primaryDisplay let optionsObj = {} let initialValuesProcessed @@ -54,7 +59,7 @@ // Persist the initial values as options, allowing them to be present in the dropdown, // even if they are not in the inital fetch results initialValuesProcessed = true - optionsObj = fieldState?.value?.reduce((accumulator, value) => { + optionsObj = (fieldState?.value || []).reduce((accumulator, value) => { accumulator[value._id] = { _id: value._id, [primaryDisplay]: value.primaryDisplay, @@ -161,7 +166,7 @@ {disabled} {validation} defaultValue={expandedDefaultValue} - type={FieldTypes.LINK} + {type} bind:fieldState bind:fieldApi bind:fieldSchema diff --git a/packages/client/src/components/app/forms/index.js b/packages/client/src/components/app/forms/index.js index 47701fe3a9..5804d3a79d 100644 --- a/packages/client/src/components/app/forms/index.js +++ b/packages/client/src/components/app/forms/index.js @@ -15,3 +15,4 @@ export { default as formstep } from "./FormStep.svelte" export { default as jsonfield } from "./JSONField.svelte" export { default as s3upload } from "./S3Upload.svelte" export { default as codescanner } from "./CodeScannerField.svelte" +export { default as bbreferencefield } from "./BBReferenceField.svelte" diff --git a/packages/client/src/constants.js b/packages/client/src/constants.js index 37a45fbe5d..f0a89b9cfd 100644 --- a/packages/client/src/constants.js +++ b/packages/client/src/constants.js @@ -1,17 +1,5 @@ -export const FieldTypes = { - STRING: "string", - BARCODEQR: "barcodeqr", - LONGFORM: "longform", - OPTIONS: "options", - NUMBER: "number", - BOOLEAN: "boolean", - ARRAY: "array", - DATETIME: "datetime", - ATTACHMENT: "attachment", - LINK: "link", - FORMULA: "formula", - JSON: "json", -} +import { FieldType as FieldTypes } from "@budibase/types" +export { FieldType as FieldTypes } from "@budibase/types" export const UnsortableTypes = [ FieldTypes.FORMULA,