From bc51c7f60394c44f064f77ade8d106f07850cb8d Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 11:05:31 +0000 Subject: [PATCH 01/11] buxfix - recordForm template maxlength incorrect --- packages/materialdesign-components/src/Templates/recordForm.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/materialdesign-components/src/Templates/recordForm.js b/packages/materialdesign-components/src/Templates/recordForm.js index afb33b19e5..46ac6479b8 100644 --- a/packages/materialdesign-components/src/Templates/recordForm.js +++ b/packages/materialdesign-components/src/Templates/recordForm.js @@ -33,7 +33,7 @@ const textField = (record, f) => ({ disabled: false, fullwidth: false, colour: "primary", - maxLength: f.typeOptions && f.typeOptions.maxLength ? f.typeOptions : 0, + maxLength: f.typeOptions && f.typeOptions.maxLength ? f.typeOptions.maxLength : 0, placeholder: f.label, value: fieldValueBinding(record, f), }) From 264eb6da5a2dbee47265f38d55c5389f3a33248c Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 11:05:52 +0000 Subject: [PATCH 02/11] bugfix - css not sent for all screens --- packages/builder/src/builderStore/store.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/builder/src/builderStore/store.js b/packages/builder/src/builderStore/store.js index 7749098945..332d8c497c 100644 --- a/packages/builder/src/builderStore/store.js +++ b/packages/builder/src/builderStore/store.js @@ -709,6 +709,10 @@ const setCurrentPage = store => pageName => { s.currentPreviewItem.props, ]) + for (let screen of s.screens) { + screen._css = generate_screen_css([screen.props]) + } + setCurrentScreenFunctions(s) return s }) From 1657beb8fce845fe79edcba44520bbd5e8a98352 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 11:15:08 +0000 Subject: [PATCH 03/11] bugfix - client - approotPath not passed correctly --- packages/client/src/createApp.js | 2 ++ packages/client/src/state/stateManager.js | 4 ++-- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/client/src/createApp.js b/packages/client/src/createApp.js index ff409b36ed..f43a6d4c34 100644 --- a/packages/client/src/createApp.js +++ b/packages/client/src/createApp.js @@ -32,6 +32,7 @@ export const createApp = ( uiFunctions, onScreenSlotRendered: () => {}, routeTo, + appRootPath: frontendDefinition.appRootPath, }) const getAttchChildrenParams = attachChildrenParams(stateManager) screenSlotNode.props._children = [screen.props] @@ -78,6 +79,7 @@ export const createApp = ( componentLibraries, uiFunctions, onScreenSlotRendered, + appRootPath: frontendDefinition.appRootPath, // seems weird, but the routeTo variable may not be available at this point routeTo: url => routeTo(url), }) diff --git a/packages/client/src/state/stateManager.js b/packages/client/src/state/stateManager.js index 71bcbe33b5..07b3d80ded 100644 --- a/packages/client/src/state/stateManager.js +++ b/packages/client/src/state/stateManager.js @@ -23,14 +23,14 @@ const isMetaProp = propName => export const createStateManager = ({ store, coreApi, - rootPath, + appRootPath, frontendDefinition, componentLibraries, uiFunctions, onScreenSlotRendered, routeTo, }) => { - let handlerTypes = eventHandlers(store, coreApi, rootPath, routeTo) + let handlerTypes = eventHandlers(store, coreApi, appRootPath, routeTo) let currentState // any nodes that have props that are bound to the store From d1a48ec3a6705854f15f09ef400dbfd2ab8f9168 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:56:11 +0000 Subject: [PATCH 04/11] bugfix: custom code not getting attached poperly --- .../src/builderStore/buildCodeForScreens.js | 2 +- .../src/builderStore/insertCodeMetadata.js | 2 +- packages/builder/src/builderStore/store.js | 18 ++++++++---------- 3 files changed, 10 insertions(+), 12 deletions(-) diff --git a/packages/builder/src/builderStore/buildCodeForScreens.js b/packages/builder/src/builderStore/buildCodeForScreens.js index af8a930c93..037a85d0bb 100644 --- a/packages/builder/src/builderStore/buildCodeForScreens.js +++ b/packages/builder/src/builderStore/buildCodeForScreens.js @@ -23,7 +23,7 @@ export const buildCodeForScreens = screens => { allfunctions += buildCodeForSingleScreen(screen) } - return `return ({ ${allfunctions} });` + return `({ ${allfunctions} });` } const buildComponentCode = componentProps => diff --git a/packages/builder/src/builderStore/insertCodeMetadata.js b/packages/builder/src/builderStore/insertCodeMetadata.js index 00c18901b5..9093c4003d 100644 --- a/packages/builder/src/builderStore/insertCodeMetadata.js +++ b/packages/builder/src/builderStore/insertCodeMetadata.js @@ -12,6 +12,6 @@ export const insertCodeMetadata = props => { const codeMetaData = code => { return { - dependsOnStore: RegExp(/(store.)/g).test(code), + dependsOnStore: RegExp(/(state.)/g).test(code), } } diff --git a/packages/builder/src/builderStore/store.js b/packages/builder/src/builderStore/store.js index 332d8c497c..01a7ebe565 100644 --- a/packages/builder/src/builderStore/store.js +++ b/packages/builder/src/builderStore/store.js @@ -517,7 +517,7 @@ const setCurrentScreen = store => screenName => { getContainerComponent(s.components), screen.props ) - setCurrentScreenFunctions(s) + setCurrentPageFunctions(s) return s }) } @@ -675,7 +675,7 @@ const _savePage = async s => { await api.post(`/_builder/api/${appname}/pages/${s.currentPageName}`, { page: { componentLibraries: s.pages.componentLibraries, ...page }, - uiFunctions: "{'1234':() => 'test return'}", + uiFunctions: s.currentPageFunctions, screens: page._screens, }) } @@ -713,7 +713,7 @@ const setCurrentPage = store => pageName => { screen._css = generate_screen_css([screen.props]) } - setCurrentScreenFunctions(s) + setCurrentPageFunctions(s) return s }) } @@ -823,7 +823,7 @@ const setComponentCode = store => code => { store.update(s => { s.currentComponentInfo._code = code - setCurrentScreenFunctions(s) + setCurrentPageFunctions(s) // save without messing with the store _saveScreenApi(s.currentPreviewItem, s) @@ -831,15 +831,13 @@ const setComponentCode = store => code => { }) } -const setCurrentScreenFunctions = s => { - s.currentScreenFunctions = - s.currentPreviewItem === "screen" - ? buildCodeForScreens([s.currentPreviewItem]) - : "({});" - +const setCurrentPageFunctions = s => { + s.currentPageFunctions = buildPageCode(s.screens, s.pages[s.currentPageName]) insertCodeMetadata(s.currentPreviewItem.props) } +const buildPageCode = (screens, page) => buildCodeForScreens([page, ...screens]) + const setScreenType = store => type => { store.update(s => { s.currentFrontEndType = type From be600919168235bdc32f355dfc6e4b299263590c Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:56:49 +0000 Subject: [PATCH 05/11] typo: UIFunctions attached to page not screen --- packages/builder/src/userInterface/CurrentItemPreview.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/builder/src/userInterface/CurrentItemPreview.svelte b/packages/builder/src/userInterface/CurrentItemPreview.svelte index fb8a2ff255..7b27a6cb75 100644 --- a/packages/builder/src/userInterface/CurrentItemPreview.svelte +++ b/packages/builder/src/userInterface/CurrentItemPreview.svelte @@ -111,7 +111,7 @@ <\script> window["##BUDIBASE_FRONTEND_DEFINITION##"] = ${JSON.stringify(frontendDefinition)}; window["##BUDIBASE_BACKEND_DEFINITION##"] = ${JSON.stringify(backendDefinition)}; - window["##BUDIBASE_FRONTEND_FUNCTIONS##"] = ${$store.currentScreenFunctions}; + window["##BUDIBASE_FRONTEND_FUNCTIONS##"] = ${$store.currentPageFunctions}; import('/_builder/budibase-client.esm.mjs') .then(module => { From 35d5ae9ed8e7732294e0aeda7ae5675a0b8f4f95 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:57:05 +0000 Subject: [PATCH 06/11] random bug - client setState --- packages/client/src/state/setState.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/state/setState.js b/packages/client/src/state/setState.js index 49e7780ff8..7c23efe8eb 100644 --- a/packages/client/src/state/setState.js +++ b/packages/client/src/state/setState.js @@ -17,7 +17,7 @@ export const setState = (store, path, value) => { if ( state[currentKey] === null || state[currentKey] === undefined || - !isObject(obj[currentKey]) + !isObject(state[currentKey]) ) { state[currentKey] = {} } From f68ac7577e582c5931edce89c1fdd0159dd5d1f3 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:57:34 +0000 Subject: [PATCH 07/11] router not properly matching parameterized route --- packages/client/src/render/screenRouter.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/render/screenRouter.js b/packages/client/src/render/screenRouter.js index 0ca8a25cab..58db7e982a 100644 --- a/packages/client/src/render/screenRouter.js +++ b/packages/client/src/render/screenRouter.js @@ -25,7 +25,7 @@ export const screenRouter = (screens, onScreenSelected, appRootPath) => { const params = {} if (current === -1) { - routes.forEach(([p], i) => { + routes.forEach((p, i) => { const pm = regexparam(p) const matches = pm.pattern.exec(_url) From d3f8dec449835ba35408df7225df3063f89c8e6b Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:57:56 +0000 Subject: [PATCH 08/11] some MD component changes --- .../src/Common/Ripple.js | 2 +- .../src/Templates/indexDatatable.js | 6 +---- .../src/Templates/recordForm.js | 22 ++++++++++++++----- .../src/Textfield/Textfield.svelte | 15 ++++++++----- 4 files changed, 27 insertions(+), 18 deletions(-) diff --git a/packages/materialdesign-components/src/Common/Ripple.js b/packages/materialdesign-components/src/Common/Ripple.js index 6dc9cc96a7..2553bbca65 100644 --- a/packages/materialdesign-components/src/Common/Ripple.js +++ b/packages/materialdesign-components/src/Common/Ripple.js @@ -5,7 +5,7 @@ export default function ripple( props = { colour: "primary", unbounded: false } ) { node.classList.add("mdc-ripple-surface") - const component = new MDCRipple(node) + let component = new MDCRipple(node) component.unbounded = props.unbounded if (props.colour === "secondary") { diff --git a/packages/materialdesign-components/src/Templates/indexDatatable.js b/packages/materialdesign-components/src/Templates/indexDatatable.js index ac0cfe79ea..e6eee2f2bf 100644 --- a/packages/materialdesign-components/src/Templates/indexDatatable.js +++ b/packages/materialdesign-components/src/Templates/indexDatatable.js @@ -55,11 +55,7 @@ const dataCells = (index, indexSchema) => { _component: "@budibase/standard-components/text", type: "none", - text: { - "##bbstate": `${dataItem(index)}.${col.name}`, - "##bbstatefallback": "", - "##bbsource": "context", - }, + text: `context.${dataItem(index)}.${col.name}`, }, ], })) diff --git a/packages/materialdesign-components/src/Templates/recordForm.js b/packages/materialdesign-components/src/Templates/recordForm.js index 46ac6479b8..25a040470c 100644 --- a/packages/materialdesign-components/src/Templates/recordForm.js +++ b/packages/materialdesign-components/src/Templates/recordForm.js @@ -7,8 +7,17 @@ export default ({ records }) => const outerContainer = record => ({ _component: "@budibase/standard-components/container", _code: "", - onLoad: [], type: "div", + onLoad: [ + { + "##eventHandlerType": "Get New Record", + parameters: { + collectionKey: record.collectionKey, + childRecordType: record.name, + statePath: record.name, + }, + }, + ], _children: [ heading(record), ...record.fields.map(f => field(record, f)), @@ -33,7 +42,8 @@ const textField = (record, f) => ({ disabled: false, fullwidth: false, colour: "primary", - maxLength: f.typeOptions && f.typeOptions.maxLength ? f.typeOptions.maxLength : 0, + maxLength: + f.typeOptions && f.typeOptions.maxLength ? f.typeOptions.maxLength : 0, placeholder: f.label, value: fieldValueBinding(record, f), }) @@ -57,15 +67,15 @@ const buttons = record => ({ position: { column: ["", ""], row: ["", ""], - margin: ["","","",""], - padding: ["30px","","",""], + margin: ["", "", "", ""], + padding: ["30px", "", "", ""], height: [""], width: [""], - zindex: [""] + zindex: [""], }, layout: { templaterows: [""], - templatecolumns: [""] + templatecolumns: [""], }, }, _children: [ diff --git a/packages/materialdesign-components/src/Textfield/Textfield.svelte b/packages/materialdesign-components/src/Textfield/Textfield.svelte index 6592c88024..bd6cf9a0c2 100644 --- a/packages/materialdesign-components/src/Textfield/Textfield.svelte +++ b/packages/materialdesign-components/src/Textfield/Textfield.svelte @@ -18,7 +18,7 @@ onMount(() => { if (!!tf) tfInstance = new MDCTextField(tf) return () => { - !!tfInstance && tf.tfInstance.destroy() + !!tfInstance && tf.tfInstance && tf.tfInstance.destroy() tf = null } }) @@ -79,6 +79,7 @@ $: useNotchedOutline = variant == "outlined" || textarea $: renderLeadingIcon = useIcon && !trailingIcon $: renderTrailingIcon = useIcon && trailingIcon + $: safeMaxLength = maxLength <= 0 ? undefined : maxLength let props = { modifiers, customs } const blockClasses = cb.build({ props }) @@ -91,10 +92,12 @@ } function changed(e) { + const val = e.target.value + value = val if (_bb.isBound(_bb.props.value)) { - _bb.setStateFromBinding(_bb.props.value, e.target.value) + _bb.setStateFromBinding(_bb.props.value, val) } - _bb.call(onChange, e.target.value) + _bb.call(onChange, val) } @@ -116,7 +119,7 @@ TODO:Needs error handling - this will depend on how Budibase handles errors {required} {placeholder} {minLength} - {maxLength} + maxLength={safeMaxLength} value={value} on:change={changed} /> {:else} @@ -131,11 +134,11 @@ TODO:Needs error handling - this will depend on how Budibase handles errors {required} placeholder={!!label && fullwidth ? label : placeholder} {minLength} - {maxLength} + maxLength={safeMaxLength} value={value} aria-label={`Textfield ${variant}`} on:focus={focus} - on:change={changed} /> + on:input={changed} /> {#if renderTrailingIcon} {/if} From 0cb9312e7562704b14f32464071f34786d55b828 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 14:59:23 +0000 Subject: [PATCH 09/11] Datatable - swallow exceptions on desroy --- .../src/Datatable/Datatable.svelte | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/materialdesign-components/src/Datatable/Datatable.svelte b/packages/materialdesign-components/src/Datatable/Datatable.svelte index 74ce2ef653..a355e23b46 100644 --- a/packages/materialdesign-components/src/Datatable/Datatable.svelte +++ b/packages/materialdesign-components/src/Datatable/Datatable.svelte @@ -30,7 +30,11 @@ onMount(() => { return () => { - !!instance && instance.destroy() + try { + !!instance && instance.destroy() + } catch(e) { + console.log(e) + } instance = null } }) From e9ccf25eb8dc8bd05a5c8c76eb9fe14cda7756e1 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Mon, 24 Feb 2020 15:59:54 +0000 Subject: [PATCH 10/11] MD - Datatable - stopped using setContext --- .../materialdesign-components/src/Datatable/Datatable.svelte | 5 +++-- .../src/Datatable/DatatableBody.svelte | 2 +- .../src/Datatable/DatatableCell.svelte | 5 +++-- .../src/Datatable/DatatableHead.svelte | 4 ++++ .../src/Datatable/DatatableRow.svelte | 5 +++-- 5 files changed, 14 insertions(+), 7 deletions(-) diff --git a/packages/materialdesign-components/src/Datatable/Datatable.svelte b/packages/materialdesign-components/src/Datatable/Datatable.svelte index a355e23b46..3e7e2c7b11 100644 --- a/packages/materialdesign-components/src/Datatable/Datatable.svelte +++ b/packages/materialdesign-components/src/Datatable/Datatable.svelte @@ -1,5 +1,5 @@