diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js index 194d1b2e39..d6d02ab979 100644 --- a/packages/builder/src/builderStore/dataBinding.js +++ b/packages/builder/src/builderStore/dataBinding.js @@ -199,7 +199,12 @@ export const getComponentBindableProperties = (asset, componentId) => { * both global and local bindings, taking into account a component's position * in the component tree. */ -const getComponentContexts = (asset, componentId, type) => { +export const getComponentContexts = ( + asset, + componentId, + type, + options = { includeSelf: false } +) => { if (!asset || !componentId) { return [] } @@ -245,6 +250,11 @@ const getComponentContexts = (asset, componentId, type) => { const localComponents = findComponentPath(asset.props, componentId) localComponents.forEach(processContexts("local")) + // Exclude self if required + if (!options?.includeSelf) { + delete map[componentId] + } + return Object.values(map) } @@ -257,17 +267,9 @@ export const getContextProviderComponents = ( type, options = { includeSelf: false } ) => { - let componentContexts = getComponentContexts(asset, componentId, type) - - // Exclude self if required - if (!options?.includeSelf) { - componentContexts = componentContexts.filter( - entry => entry.component._id !== componentId - ) - } - - // Ignore contexts and just return the component instances - return componentContexts.map(entry => entry.component) + return getComponentContexts(asset, componentId, type, options).map( + entry => entry.component + ) } /** diff --git a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/SaveRow.svelte b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/SaveRow.svelte index c1917ad90f..2657aa75e7 100644 --- a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/SaveRow.svelte +++ b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/SaveRow.svelte @@ -3,8 +3,8 @@ import { store, currentAsset } from "builderStore" import { tables, viewsV2 } from "stores/backend" import { - getContextProviderComponents, getSchemaForDatasourcePlus, + getComponentContexts, } from "builderStore/dataBinding" import SaveFields from "./SaveFields.svelte" @@ -12,18 +12,18 @@ export let bindings = [] export let nested - $: formComponents = getContextProviderComponents( + $: formContexts = getComponentContexts( $currentAsset, $store.selectedComponentId, "form", { includeSelf: nested } ) - $: schemaComponents = getContextProviderComponents( + $: schemaContexts = getComponentContexts( $currentAsset, $store.selectedComponentId, "schema" ) - $: providerOptions = getProviderOptions(formComponents, schemaComponents) + $: providerOptions = getProviderOptions(formContexts, schemaContexts) $: schemaFields = getSchemaFields(parameters?.tableId) $: tableOptions = $tables.list.map(table => ({ label: table.name, @@ -35,38 +35,23 @@ })) $: options = [...(tableOptions || []), ...(viewOptions || [])] - // Gets a context definition of a certain type from a component definition - const extractComponentContext = (component, contextType) => { - const def = store.actions.components.getDefinition(component?._component) - if (!def) { - return null - } - const contexts = Array.isArray(def.context) ? def.context : [def.context] - return contexts.find(context => context?.type === contextType) - } - // Gets options for valid context keys which provide valid data to submit - const getProviderOptions = (formComponents, schemaComponents) => { - const formContexts = formComponents.map(component => ({ - component, - context: extractComponentContext(component, "form"), - })) - const schemaContexts = schemaComponents.map(component => ({ - component, - context: extractComponentContext(component, "schema"), - })) + const getProviderOptions = (formContexts, schemaContexts) => { const allContexts = formContexts.concat(schemaContexts) - - return allContexts.map(({ component, context }) => { + let options = [] + allContexts.forEach(({ component, contexts }) => { let runtimeBinding = component._id - if (context.suffix) { - runtimeBinding += `-${context.suffix}` - } - return { - label: component._instanceName, - value: runtimeBinding, - } + contexts.forEach(context => { + if (context.suffix) { + runtimeBinding += `-${context.suffix}` + } + options.push({ + label: component._instanceName, + value: runtimeBinding, + }) + }) }) + return options } const getSchemaFields = resourceId => {