diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js
index 9a41ad2afc..b36613fbc5 100644
--- a/packages/builder/src/builderStore/dataBinding.js
+++ b/packages/builder/src/builderStore/dataBinding.js
@@ -61,7 +61,7 @@ export const getComponentBindableProperties = (asset, componentId) => {
/**
* Gets all data provider components above a component.
*/
-export const getDataProviderComponents = (asset, componentId) => {
+export const getContextProviderComponents = (asset, componentId, type) => {
if (!asset || !componentId) {
return []
}
@@ -74,7 +74,18 @@ export const getDataProviderComponents = (asset, componentId) => {
// Filter by only data provider components
return path.filter(component => {
const def = store.actions.components.getDefinition(component._component)
- return def?.context != null
+ if (!def?.context) {
+ return false
+ }
+
+ // If no type specified, return anything that exposes context
+ if (!type) {
+ return true
+ }
+
+ // Otherwise only match components with the specific context type
+ const contexts = Array.isArray(def.context) ? def.context : [def.context]
+ return contexts.find(context => context.type === type) != null
})
}
@@ -143,7 +154,7 @@ export const getDatasourceForProvider = (asset, component) => {
*/
const getContextBindings = (asset, componentId) => {
// Extract any components which provide data contexts
- const dataProviders = getDataProviderComponents(asset, componentId)
+ const dataProviders = getContextProviderComponents(asset, componentId)
// Generate bindings for all matching components
return getProviderContextBindings(asset, dataProviders)
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
index bc15110c09..8f5f7ef807 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
@@ -1,5 +1,5 @@
-Define actions
+Define actions
Define what actions to run.
-
+
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte
index 791380643f..55aac87cfd 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte
@@ -3,7 +3,7 @@
import { store, currentAsset } from "builderStore"
import { tables } from "stores/backend"
import {
- getDataProviderComponents,
+ getContextProviderComponents,
getSchemaForDatasource,
} from "builderStore/dataBinding"
import SaveFields from "./SaveFields.svelte"
@@ -11,13 +11,54 @@
export let parameters
export let bindings = []
- $: dataProviderComponents = getDataProviderComponents(
+ $: formComponents = getContextProviderComponents(
$currentAsset,
- $store.selectedComponentId
+ $store.selectedComponentId,
+ "form"
)
+ $: schemaComponents = getContextProviderComponents(
+ $currentAsset,
+ $store.selectedComponentId,
+ "schema"
+ )
+ $: providerOptions = getProviderOptions(formComponents, schemaComponents)
$: schemaFields = getSchemaFields($currentAsset, parameters?.tableId)
$: tableOptions = $tables.list || []
+ // 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 allContexts = formContexts.concat(schemaContexts)
+
+ return allContexts.map(({ component, context }) => {
+ let runtimeBinding = component._id
+ if (context.suffix) {
+ runtimeBinding += `-${context.suffix}`
+ }
+ return {
+ label: component._instanceName,
+ value: runtimeBinding,
+ }
+ })
+ }
+
const getSchemaFields = (asset, tableId) => {
const { schema } = getSchemaForDatasource(asset, { type: "table", tableId })
return Object.values(schema || {})
@@ -39,10 +80,8 @@