From 3d7a2d4ba942e371f597143b71a7ff27bdaced11 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Fri, 1 Sep 2023 11:49:46 +0100 Subject: [PATCH 1/7] Ensure resourceId is specified when creating default table datasources --- packages/builder/src/builderStore/store/frontend.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index f6cecb856c..5997c69151 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -627,6 +627,7 @@ export const getFrontendStore = () => { component[setting.key] = { label: defaultDS.name, tableId: defaultDS._id, + resourceId: defaultDS._id, type: "table", } } else if (setting.type === "dataProvider") { From 401c12732f394d36b76628c5063f9bb3398cdf50 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Mon, 4 Sep 2023 08:37:24 +0100 Subject: [PATCH 2/7] Fix datasource definitions to ensure they work with both tables and views, for both type datasource and type table, and fix bindings --- .../store/screenTemplates/rowListScreen.js | 10 +++---- .../settings/controls/TableSelect.svelte | 7 ++--- .../NewScreen/DatasourceModal.svelte | 26 +++++++------------ .../NewScreen/DatasourceTemplateRow.svelte | 2 +- 4 files changed, 20 insertions(+), 25 deletions(-) diff --git a/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js b/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js index 54dd38ac63..bbefe65fc8 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/rowListScreen.js @@ -8,7 +8,7 @@ export default function (datasources) { } return datasources.map(datasource => { return { - name: `${datasource.name} - List`, + name: `${datasource.label} - List`, create: () => createScreen(datasource), id: ROW_LIST_TEMPLATE, resourceId: datasource.resourceId, @@ -17,13 +17,13 @@ export default function (datasources) { } export const ROW_LIST_TEMPLATE = "ROW_LIST_TEMPLATE" -export const rowListUrl = datasource => sanitizeUrl(`/${datasource.name}`) +export const rowListUrl = datasource => sanitizeUrl(`/${datasource.label}`) const generateTableBlock = datasource => { const tableBlock = new Component("@budibase/standard-components/tableblock") tableBlock .customProps({ - title: datasource.name, + title: datasource.label, dataSource: datasource, sortOrder: "Ascending", size: "spectrum--medium", @@ -34,14 +34,14 @@ const generateTableBlock = datasource => { titleButtonText: "Create row", titleButtonClickBehaviour: "new", }) - .instanceName(`${datasource.name} - Table block`) + .instanceName(`${datasource.label} - Table block`) return tableBlock } const createScreen = datasource => { return new Screen() .route(rowListUrl(datasource)) - .instanceName(`${datasource.name} - List`) + .instanceName(`${datasource.label} - List`) .addChild(generateTableBlock(datasource)) .json() } diff --git a/packages/builder/src/components/design/settings/controls/TableSelect.svelte b/packages/builder/src/components/design/settings/controls/TableSelect.svelte index 4a6f33202b..da50ad8c2a 100644 --- a/packages/builder/src/components/design/settings/controls/TableSelect.svelte +++ b/packages/builder/src/components/design/settings/controls/TableSelect.svelte @@ -8,15 +8,16 @@ const dispatch = createEventDispatcher() $: tables = $tablesStore.list.map(table => ({ - ...table, type: "table", label: table.name, + tableId: table._id, resourceId: table._id, })) $: views = $viewsV2.list.map(view => ({ - ...view, type: "viewV2", + id: view.id, label: view.name, + tableId: view.tableId, resourceId: view.id, })) $: options = [...(tables || []), ...(views || [])] @@ -32,7 +33,7 @@ // Migrate old values before "resourceId" existed if (value && !value.resourceId) { const view = views.find(x => x.resourceId === value.id) - const table = tables.find(x => x.resourceId === value._id) + const table = tables.find(x => x.resourceId === value.tableId) dispatch("change", view || table) } }) diff --git a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte index fc6601178a..a866cd23d4 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte @@ -75,43 +75,37 @@ {@const views = Object.values(table.views || {}).filter( view => view.version === 2 )} - {@const datasource = { - ...table, - // Legacy properties + {@const tableDS = { tableId: table._id, label: table.name, - // New consistent properties resourceId: table._id, - name: table.name, type: "table", }} {@const selected = selectedScreens.find( - screen => screen.resourceId === datasource.resourceId + screen => screen.resourceId === tableDS.resourceId )} toggleSelection(datasource)} + on:click={() => toggleSelection(tableDS)} {selected} - {datasource} + datasource={tableDS} /> {#each views as view} - {@const datasource = { - ...view, - // Legacy properties + {@const viewDS = { label: view.name, - // New consistent properties + id: view.id, resourceId: view.id, - name: view.name, + tableId: view.tableId, type: "viewV2", }} {@const selected = selectedScreens.find( - x => x.resourceId === datasource.resourceId + x => x.resourceId === viewDS.resourceId )} toggleSelection(datasource)} + on:click={() => toggleSelection(viewDS)} {selected} - {datasource} + datasource={viewDS} /> {/each} {/each} diff --git a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceTemplateRow.svelte b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceTemplateRow.svelte index 5a05c8d198..dac0aaed6e 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceTemplateRow.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceTemplateRow.svelte @@ -8,7 +8,7 @@
- {datasource.name} + {datasource.label} {#if selected} From cf33680b1e6710bddbfbd78d7e2695bc2b20cc6a Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Mon, 4 Sep 2023 09:05:33 +0100 Subject: [PATCH 3/7] Fix crash when converting form fields with a schema that doesn't contain a certain field --- packages/builder/src/builderStore/dataBinding.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js index d2f354a361..efd56e9d4b 100644 --- a/packages/builder/src/builderStore/dataBinding.js +++ b/packages/builder/src/builderStore/dataBinding.js @@ -955,7 +955,9 @@ export const buildFormSchema = (component, asset) => { const patched = convertOldFieldFormat(component.fields || []) patched?.forEach(({ field, active }) => { if (!active) return - schema[field] = { type: info?.schema[field].type } + if (info?.schema[field]) { + schema[field] = { type: info?.schema[field].type } + } }) } From c6bd81ba210ba7a77cf93a1c4b57e92a364d7abe Mon Sep 17 00:00:00 2001 From: Dean Date: Tue, 5 Sep 2023 11:40:52 +0100 Subject: [PATCH 4/7] Fix for datasource reset on formblock. Added 'resetOn' to the manifest to trigger a clear when the configured field is cleared --- .../src/builderStore/store/frontend.js | 10 ++++++++ .../FieldConfiguration.svelte | 5 ++-- packages/client/manifest.json | 4 +++- .../app/blocks/form/InnerFormBlock.svelte | 24 ++++++++++--------- 4 files changed, 29 insertions(+), 14 deletions(-) diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index 5997c69151..5148afd13c 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -1246,6 +1246,16 @@ export const getFrontendStore = () => { const settings = getComponentSettings(component._component) const updatedSetting = settings.find(setting => setting.key === name) + const resetFields = settings.filter( + setting => name === setting.resetOn + ) + resetFields?.forEach(setting => { + console.log(setting.key, component) + if (component[setting.key]) { + component[setting.key] = null + } + }) + if ( updatedSetting?.type === "dataSource" || updatedSetting?.type === "table" diff --git a/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte b/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte index f12e8d27ae..e41b41642b 100644 --- a/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte +++ b/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte @@ -34,9 +34,10 @@ } $: datasource = getDatasourceForProvider($currentAsset, componentInstance) + $: resourceId = datasource.resourceId || datasource.tableId - $: if (!isEqual(value, cachedValue)) { - cachedValue = value + $: if (!isEqual(value, cachedValue) || resourceId) { + cachedValue = cloneDeep(value) schema = getSchema($currentAsset, datasource) } diff --git a/packages/client/manifest.json b/packages/client/manifest.json index 015d32ce2d..d91a71853e 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -4745,7 +4745,8 @@ "dependsOn": { "setting": "clickBehaviour", "value": "details" - } + }, + "resetOn": "dataSource" }, { "label": "Save button", @@ -5397,6 +5398,7 @@ "type": "fieldConfiguration", "key": "fields", "nested": true, + "resetOn": "dataSource", "selectAllFields": true }, { diff --git a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte index bca6c21cdb..f2887e97ad 100644 --- a/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte +++ b/packages/client/src/components/app/blocks/form/InnerFormBlock.svelte @@ -211,17 +211,19 @@ {/if} {/if} - - {#each fields as field, idx} - {#if getComponentForField(field) && field.active} - - {/if} - {/each} - + {#key fields} + + {#each fields as field, idx} + {#if getComponentForField(field) && field.active} + + {/if} + {/each} + + {/key} {:else} From b923d24d56b08fccf1b52c1509a90cb148db2188 Mon Sep 17 00:00:00 2001 From: Dean Date: Tue, 5 Sep 2023 11:56:23 +0100 Subject: [PATCH 5/7] Removed debugging console statement --- packages/builder/src/builderStore/store/frontend.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index 5148afd13c..106847ea0a 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -1250,7 +1250,6 @@ export const getFrontendStore = () => { setting => name === setting.resetOn ) resetFields?.forEach(setting => { - console.log(setting.key, component) if (component[setting.key]) { component[setting.key] = null } From 61cbd45806b2b3d06972a5acfad6287034686ce7 Mon Sep 17 00:00:00 2001 From: Dean Date: Tue, 5 Sep 2023 13:32:54 +0100 Subject: [PATCH 6/7] Fix for default create row label in table block. Ensure its always visible --- packages/client/src/components/app/blocks/TableBlock.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/components/app/blocks/TableBlock.svelte b/packages/client/src/components/app/blocks/TableBlock.svelte index 190f005a36..5d8f1b71ae 100644 --- a/packages/client/src/components/app/blocks/TableBlock.svelte +++ b/packages/client/src/components/app/blocks/TableBlock.svelte @@ -275,7 +275,7 @@ dataSource, showSaveButton: true, showDeleteButton: false, - saveButtonLabel: sidePanelSaveLabel, + saveButtonLabel: sidePanelSaveLabel || "Save", //always show actionType: "Create", fields: sidePanelFields || normalFields, title: "Create Row", From 4a1e969b7ce2cdfda307d9c55da9d0be6a410dc2 Mon Sep 17 00:00:00 2001 From: Dean Date: Wed, 6 Sep 2023 09:09:43 +0100 Subject: [PATCH 7/7] PR Feedback and fixes for the edit field popover --- .../src/builderStore/store/frontend.js | 4 +-- .../FieldConfiguration.svelte | 29 ++++++++++--------- 2 files changed, 17 insertions(+), 16 deletions(-) diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index 106847ea0a..13b28a3572 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -1250,9 +1250,7 @@ export const getFrontendStore = () => { setting => name === setting.resetOn ) resetFields?.forEach(setting => { - if (component[setting.key]) { - component[setting.key] = null - } + component[setting.key] = null }) if ( diff --git a/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte b/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte index e41b41642b..4c4fa0b7b7 100644 --- a/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte +++ b/packages/builder/src/components/design/settings/controls/FieldConfiguration/FieldConfiguration.svelte @@ -21,6 +21,9 @@ let fieldList let schema let cachedValue + let options + let sanitisedValue + let unconfigured $: bindings = getBindableProperties($selectedScreen, componentInstance._id) $: actionType = componentInstance.actionType @@ -36,15 +39,22 @@ $: datasource = getDatasourceForProvider($currentAsset, componentInstance) $: resourceId = datasource.resourceId || datasource.tableId - $: if (!isEqual(value, cachedValue) || resourceId) { + $: if (!isEqual(value, cachedValue)) { cachedValue = cloneDeep(value) - schema = getSchema($currentAsset, datasource) } - $: options = Object.keys(schema || {}) - $: sanitisedValue = getValidColumns(convertOldFieldFormat(value), options) - $: updateSanitsedFields(sanitisedValue) - $: unconfigured = buildUnconfiguredOptions(schema, sanitisedFields) + const updateState = value => { + schema = getSchema($currentAsset, datasource) + options = Object.keys(schema || {}) + sanitisedValue = getValidColumns(convertOldFieldFormat(value), options) + updateSanitsedFields(sanitisedValue) + unconfigured = buildUnconfiguredOptions(schema, sanitisedFields) + fieldList = [...sanitisedFields, ...unconfigured] + .map(buildSudoInstance) + .filter(x => x != null) + } + + $: updateState(cachedValue, resourceId) // Builds unused ones only const buildUnconfiguredOptions = (schema, selected) => { @@ -98,7 +108,6 @@ if (instance._component) { return instance } - const type = getComponentForField(instance.field, schema) if (!type) { return null @@ -119,12 +128,6 @@ return { ...instance, ...pseudoComponentInstance } } - $: if (sanitisedFields) { - fieldList = [...sanitisedFields, ...unconfigured] - .map(buildSudoInstance) - .filter(x => x != null) - } - const processItemUpdate = e => { const updatedField = e.detail const parentFieldsUpdated = fieldList ? cloneDeep(fieldList) : []