backup

packages/client/src/createApp.js

@@ -50,17 +50,17 @@ export const createApp = (componentLibraries, appDefinition, user, uiFunctions)
         if(isFunction(event)) event(context);
     }
 
-    const initialiseChildrenParams = (hydrate, parentContext) =>  ({
+    const initialiseChildrenParams = (hydrate, parentContext, childIndex) =>  ({
         bb, coreApi, store, parentContext,
         componentLibraries, appDefinition, 
-        hydrate, uiFunctions
+        hydrate, uiFunctions, childIndex
     });
 
-    const bb = (componentProps, componentContext, parent) => ({
-        hydrateChildren: _initialiseChildren(initialiseChildrenParams(true, componentContext)), 
-        appendChildren: _initialiseChildren(initialiseChildrenParams(false, componentContext)), 
+    const bb = (componentProps, componentContext, childIndex) => ({
+        hydrateChildren: _initialiseChildren(initialiseChildrenParams(true, componentContext, childIndex)), 
+        appendChildren: _initialiseChildren(initialiseChildrenParams(false, componentContext, childIndex)), 
         insertChildren: (props, htmlElement, anchor) => 
-            _initialiseChildren(initialiseChildrenParams(false, componentContext))
+            _initialiseChildren(initialiseChildrenParams(false, componentContext, childIndex))
                                 (props, htmlElement, anchor), 
         context: componentContext,
         props: componentProps,

packages/client/src/index.js

@@ -35,7 +35,7 @@ export const loadBudibase = async ({
         props = appDefinition.props;
     }
 
-    const _app = createApp(
+    const app = createApp(
         componentLibraries, 
         appDefinition,  
         user, 

packages/client/src/render/initialiseChildren.js

@@ -12,7 +12,7 @@ export const _initialiseChildren = (initialiseOpts) =>
                             (childrenProps, htmlElement, anchor=null) => {
 
     const { uiFunctions, bb, coreApi, 
-        store, componentLibraries, 
+        store, componentLibraries, childIndex,
         appDefinition, parentContext, hydrate } = initialiseOpts;
         
     const childComponents = [];
@@ -23,6 +23,7 @@ export const _initialiseChildren = (initialiseOpts) =>
         }
     }
     
+    let childIndex = 0;
     for(let childProps of childrenProps) {       
         
         const {componentName, libName} = splitName(childProps._component);
@@ -36,14 +37,19 @@ export const _initialiseChildren = (initialiseOpts) =>
        
         const componentConstructor = componentLibraries[libName][componentName];
 
-        const {component, context} = renderComponent({
+        const {component, context, lastChildIndex} = renderComponent({
             componentConstructor,uiFunctions, 
-            htmlElement, anchor, 
+            htmlElement, anchor, childIndex,  
             parentContext, initialProps, bb});
 
-
-        bind(component);
-        childComponents.push({component, context});
+        childIndex = lastChildIndex;
+        
+        const unsubscribe = bind(component);
+        childComponents.push({
+            component, 
+            context,
+            unsubscribe
+        });
     }
 
     return childComponents;

packages/client/src/render/renderComponent.js

@@ -2,7 +2,7 @@
 export const renderComponent = ({
     componentConstructor, uiFunctions,
     htmlElement, anchor, parentContext,
-    initialProps, bb}) => {
+    initialProps, bb, childIndex}) => {
 
     const func = initialProps._id 
                  ? uiFunctions[componentProps._id]
@@ -27,6 +27,8 @@ export const renderComponent = ({
             hydrate:false,
             anchor
         });
+
+        childIndex += 1;
     }
 
     if(func) {
@@ -37,6 +39,7 @@ export const renderComponent = ({
 
     return ({
         context: componentContext,
+        lastChildIndex: childIndex,
         component
     });
 }