diff --git a/packages/client/src/createApp.js b/packages/client/src/createApp.js index accad9f51e..9c2e166c45 100644 --- a/packages/client/src/createApp.js +++ b/packages/client/src/createApp.js @@ -50,74 +50,32 @@ export const createApp = (componentLibraries, appDefinition, user, uiFunctions) if(isFunction(event)) event(context); } - const initialiseChildrenParams = (parentContext, hydrate) => ({ - bb, coreApi, store, + const initialiseChildrenParams = (hydrate, parentContext) => ({ + bb, coreApi, store, parentContext, componentLibraries, appDefinition, - parentContext, hydrate, uiFunctions + hydrate, uiFunctions }); - const bb = (context, props) => ({ - hydrateChildren: _initialiseChildren(initialiseChildrenParams(context, true)), - appendChildren: _initialiseChildren(initialiseChildrenParams(context, false)), - insertChildren: (props, htmlElement, anchor, context) => - _initialiseChildren(initialiseChildrenParams(context, false)) - (props, htmlElement, context, anchor), - store, - relativeUrl, - api, + const bb = (componentProps, componentContext, parent) => ({ + hydrateChildren: _initialiseChildren(initialiseChildrenParams(true, componentContext)), + appendChildren: _initialiseChildren(initialiseChildrenParams(false, componentContext)), + insertChildren: (props, htmlElement, anchor) => + _initialiseChildren(initialiseChildrenParams(false, componentContext)) + (props, htmlElement, anchor), + context: componentContext, + props: componentProps, call:safeCallEvent, - isBound, setStateFromBinding: (binding, value) => setStateFromBinding(store, binding, value), setState: (path, value) => setState(store, path, value), getStateOrValue: (prop, currentContext) => getStateOrValue(globalState, prop, currentContext), - context, - props + store, + relativeUrl, + api, + isBound, + parent }); return bb(); } - -const buildBindings = (boundProps, boundArrays, contextBoundProps) => { - const bindings = {}; - if(boundProps && boundProps.length > 0) { - for(let p of boundProps) { - bindings[p.propName] = { - path: p.path, - fallback: p.fallback, - source: p.source - } - } - } - - if(contextBoundProps && contextBoundProps.length > 0) { - for(let p of contextBoundProps) { - bindings[p.propName] = { - path: p.path, - fallback: p.fallback, - source: p.source - } - } - } - - if(boundArrays && boundArrays.length > 0) { - for(let a of boundArrays) { - const arrayOfBindings = []; - - for(let b of a.arrayOfBindings) { - arrayOfBindings.push( - buildBindings( - b.boundProps, - b.boundArrays, - b.contextBoundProps) - ); - } - - bindings[a.propName] = arrayOfBindings; - } - } - - return bindings; -} - diff --git a/packages/client/src/index.js b/packages/client/src/index.js index aba4906680..07aede2504 100644 --- a/packages/client/src/index.js +++ b/packages/client/src/index.js @@ -40,11 +40,11 @@ export const loadBudibase = async ({ appDefinition, user, uiFunctions || {}); - _app.hydrateChildren( + app.hydrateChildren( [props], window.document.body); - return _app; + return app; }; if(window) { diff --git a/packages/client/src/render/initialiseChildren.js b/packages/client/src/render/initialiseChildren.js index 50a0052642..663c1ed110 100644 --- a/packages/client/src/render/initialiseChildren.js +++ b/packages/client/src/render/initialiseChildren.js @@ -9,7 +9,7 @@ import { $ } from "../core/common"; import { renderComponent } from "./renderComponent"; export const _initialiseChildren = (initialiseOpts) => - (childrenProps, htmlElement, context, anchor=null) => { + (childrenProps, htmlElement, anchor=null) => { const { uiFunctions, bb, coreApi, store, componentLibraries, @@ -30,25 +30,20 @@ export const _initialiseChildren = (initialiseOpts) => if(!componentName || !libName) return; const {initialProps, bind} = setupBinding( - store, childProps, coreApi, - context || parentContext, appDefinition.appRootPath); - - /// here needs to go inside renderComponent ??? - const componentProps = { - ...initialProps, - _bb:bb(context || parentContext, childProps) - }; + store, childProps, coreApi, + appDefinition.appRootPath); + const componentConstructor = componentLibraries[libName][componentName]; - const {component} = renderComponent({ + const {component, context} = renderComponent({ componentConstructor,uiFunctions, htmlElement, anchor, - parentContext, componentProps}); + parentContext, initialProps, bb}); bind(component); - childComponents.push(component); + childComponents.push({component, context}); } return childComponents; diff --git a/packages/client/src/render/renderComponent.js b/packages/client/src/render/renderComponent.js index 3ed66ac517..fc921b391d 100644 --- a/packages/client/src/render/renderComponent.js +++ b/packages/client/src/render/renderComponent.js @@ -2,9 +2,9 @@ export const renderComponent = ({ componentConstructor, uiFunctions, htmlElement, anchor, parentContext, - componentProps}) => { + initialProps, bb}) => { - const func = componentProps._id + const func = initialProps._id ? uiFunctions[componentProps._id] : undefined; @@ -19,9 +19,11 @@ export const renderComponent = ({ componentContext = parentContext; } + initialProps._bb = bb(initialProps, componentContext); + component = new componentConstructor({ target: htmlElement, - props: componentProps, + props: initialProps, hydrate:false, anchor });