update binding generation to only find bindings from passed screen

packages/builder/src/dataBinding.js

@@ -54,7 +54,7 @@ export const getBindableProperties = (asset, componentId) => {
   const userBindings = getUserBindings()
   const urlBindings = getUrlBindings(asset)
   const deviceBindings = getDeviceBindings()
-  const stateBindings = getStateBindings()
+  const stateBindings = getStateBindings(asset)
   const selectedRowsBindings = getSelectedRowsBindings(asset)
   const roleBindings = getRoleBindings()
   const embedBindings = getEmbedBindings()
@@ -711,10 +711,10 @@ export const makeStateBinding = key => {
 /**
  * Gets all state bindings that are globally available.
  */
-const getStateBindings = () => {
+const getStateBindings = asset => {
   let bindings = []
   if (get(appStore).clientFeatures?.state) {
-    bindings = getAllStateVariables().map(makeStateBinding)
+    bindings = getAllStateVariables(asset).map(makeStateBinding)
   }
   return bindings
 }
@@ -1160,28 +1160,39 @@ export const buildFormSchema = (component, asset) => {
  * in the app.
  */
 export const getAllStateVariables = screen => {
-  let assets = []
-  if (screen) {
-    // only include state variables from a specific screen
-    assets.push(screen)
-  } else {
-    // otherwise include state variables from all screens
-    assets = getAllAssets()
+  let stateVars = new Set()
+
+  // Helper function to extract state variables with their persist status from actions
+  const extractStateVariablesFromActions = actions => {
+    if (!Array.isArray(actions)) {
+      return []
     }
-  let eventSettings = []
-  assets.forEach(asset => {
-    findAllMatchingComponents(asset.props, component => {
-      const settings = componentStore.getComponentSettings(component._component)
+    return actions.reduce((vars, action) => {
+      if (
+        action["##eventHandlerType"] === "Update State" &&
+        action.parameters?.type === "set" &&
+        action.parameters?.key &&
+        action.parameters?.value
+      ) {
+        vars.push({
+          key: action.parameters.key,
+          persisted: !!action.parameters.persist,
+        })
+      }
+      return vars
+    }, [])
+  }
+
+  // Extracts all event settings from a component instance.
+  // Recurses into nested types to find all event-like settings at any
+  // depth.
+  const parseEventSettings = (settings, comp, actions) => {
     const nestedTypes = [
       "buttonConfiguration",
       "fieldConfiguration",
       "stepConfiguration",
     ]
 
-      // Extracts all event settings from a component instance.
-      // Recurses into nested types to find all event-like settings at any
-      // depth.
-      const parseEventSettings = (settings, comp) => {
     if (!settings?.length) {
       return
     }
@@ -1190,7 +1201,7 @@ export const getAllStateVariables = screen => {
     settings
       .filter(setting => setting.type === "event")
       .forEach(setting => {
-            eventSettings.push(comp[setting.key])
+        actions.push(...(comp[setting.key] || []))
       })
 
     // Recurse into any nested instance types
@@ -1210,47 +1221,46 @@ export const getAllStateVariables = screen => {
 
             // Parsed nested component instances inside this setting
             const nestedSettings = componentStore.getComponentSettings(type)
-                parseEventSettings(nestedSettings, instance)
+            parseEventSettings(nestedSettings, instance, actions)
           })
         }
       })
   }
 
-      parseEventSettings(settings, component)
-    })
+  const collectScreenActions = screen => {
+    let actions = []
+    if (screen.onLoad) {
+      actions.push(...screen.onLoad)
+    }
+    findAllMatchingComponents(screen.props, component => {
+      const settings = componentStore.getComponentSettings(component._component)
+      parseEventSettings(settings, component, actions)
     })
+    return actions
+  }
 
-  // Add on load settings from screens
+  // Get state variables from the specific screen
   if (screen) {
-    if (screen.onLoad) {
-      eventSettings.push(screen.onLoad)
+    const screenActions = collectScreenActions(screen)
+    extractStateVariablesFromActions(screenActions).forEach(
+      ({ key, persisted }) => {
+        if (!persisted) stateVars.add(key)
       }
-  } else {
-    get(screenStore).screens.forEach(screen => {
-      if (screen.onLoad) {
-        eventSettings.push(screen.onLoad)
-      }
-    })
+    )
   }
 
-  // Extract all state keys from any "update state" actions in each setting
-  let bindingSet = new Set()
-  eventSettings.forEach(setting => {
-    if (!Array.isArray(setting)) {
-      return
-    }
-    setting.forEach(action => {
-      if (
-        action["##eventHandlerType"] === "Update State" &&
-        action.parameters?.type === "set" &&
-        action.parameters?.key &&
-        action.parameters?.value
-      ) {
-        bindingSet.add(action.parameters.key)
+  // Now get all other state variables for the purpose of finding persisted ones
+  const allScreens = get(screenStore).screens
+  allScreens.forEach(currentScreen => {
+    const screenActions = collectScreenActions(currentScreen)
+    extractStateVariablesFromActions(screenActions).forEach(
+      ({ key, persisted }) => {
+        if (persisted) stateVars.add(key)
       }
+    )
   })
-  })
-  return Array.from(bindingSet)
+
+  return Array.from(stateVars)
 }
 
 export const getAllAssets = () => {