diff --git a/packages/bbui/src/Form/Core/Dropzone.svelte b/packages/bbui/src/Form/Core/Dropzone.svelte index bbaf5a3ff9..f7fed78b70 100644 --- a/packages/bbui/src/Form/Core/Dropzone.svelte +++ b/packages/bbui/src/Form/Core/Dropzone.svelte @@ -22,6 +22,7 @@ export let error = null export let fileTags = [] export let maximum = null + export let extensions = "*" const dispatch = createEventDispatcher() const imageExtensions = [ @@ -207,6 +208,7 @@ {disabled} type="file" multiple + accept={extensions} on:change={handleFile} /> { }) }) }) -}) + diff --git a/packages/builder/cypress/support/commands.js b/packages/builder/cypress/support/commands.js index 5952f4699c..e69bc8badc 100644 --- a/packages/builder/cypress/support/commands.js +++ b/packages/builder/cypress/support/commands.js @@ -43,6 +43,7 @@ Cypress.Commands.add("createApp", name => { } }) cy.contains(/Start from scratch/).dblclick() + cy.wait(2000) cy.get(".spectrum-Modal").within(() => { cy.get("input").eq(0).type(name).should("have.value", name).blur() cy.get(".spectrum-ButtonGroup").contains("Create app").click() diff --git a/packages/client/manifest.json b/packages/client/manifest.json index 9431129fa0..e618ca1c11 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -2236,7 +2236,7 @@ "setting": "optionsSource", "value": "provider" } - }, + }, { "type": "options", "key": "customOptions", @@ -2419,6 +2419,11 @@ "label": "Label", "key": "label" }, + { + "type": "text", + "label": "Extensions", + "key": "extensions" + }, { "type": "boolean", "label": "Disabled", diff --git a/packages/client/src/components/app/forms/AttachmentField.svelte b/packages/client/src/components/app/forms/AttachmentField.svelte index 8c4eaea243..4d8a0b482d 100644 --- a/packages/client/src/components/app/forms/AttachmentField.svelte +++ b/packages/client/src/components/app/forms/AttachmentField.svelte @@ -7,6 +7,7 @@ export let label export let disabled = false export let validation + export let extensions let fieldState let fieldApi @@ -52,6 +53,7 @@ }} {processFiles} {handleFileTooLarge} + {extensions} /> {/if} diff --git a/packages/client/src/components/app/forms/InnerForm.svelte b/packages/client/src/components/app/forms/InnerForm.svelte index 47bc717d92..c1e92bf442 100644 --- a/packages/client/src/components/app/forms/InnerForm.svelte +++ b/packages/client/src/components/app/forms/InnerForm.svelte @@ -141,8 +141,18 @@ return } + // Create validation function based on field schema + const schemaConstraints = schema?.[field]?.constraints + const validator = createValidatorFromConstraints( + schemaConstraints, + validationRules, + field, + table + ) + // If we've already registered this field then keep some existing state let initialValue = deepGet(initialValues, field) ?? defaultValue + let initialError = null let fieldId = `id-${generateID()}` const existingField = getField(field) if (existingField) { @@ -156,20 +166,17 @@ } else { initialValue = fieldState.value ?? initialValue } + + // If this field has already been registered and we previously had an + // error set, then re-run the validator to see if we can unset it + if (fieldState.error) { + initialError = validator(initialValue) + } } // Auto columns are always disabled const isAutoColumn = !!schema?.[field]?.autocolumn - // Create validation function based on field schema - const schemaConstraints = schema?.[field]?.constraints - const validator = createValidatorFromConstraints( - schemaConstraints, - validationRules, - field, - table - ) - // Construct field info const fieldInfo = writable({ name: field, @@ -178,7 +185,7 @@ fieldState: { fieldId, value: initialValue, - error: null, + error: initialError, disabled: disabled || fieldDisabled || isAutoColumn, defaultValue, validator, diff --git a/packages/client/src/components/app/forms/MultiFieldSelect.svelte b/packages/client/src/components/app/forms/MultiFieldSelect.svelte index cecc569b6f..686198dfe1 100644 --- a/packages/client/src/components/app/forms/MultiFieldSelect.svelte +++ b/packages/client/src/components/app/forms/MultiFieldSelect.svelte @@ -20,6 +20,7 @@ let fieldSchema $: flatOptions = optionsSource == null || optionsSource === "schema" + $: expandedDefaultValue = expand(defaultValue) $: options = getOptions( optionsSource, fieldSchema, @@ -28,6 +29,18 @@ valueColumn, customOptions ) + + const expand = values => { + if (!values) { + return [] + } + + if (Array.isArray(values)) { + return values + } + + return values.split(",").map(value => value.trim()) + }