diff --git a/package.json b/package.json index 5ff26bfa91..d58e36517d 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "prettier-plugin-svelte": "^1.4.0", "rimraf": "^3.0.2", "rollup-plugin-replace": "^2.2.0", - "svelte": "^3.28.0" + "svelte": "^3.30.0" }, "scripts": { "bootstrap": "lerna bootstrap", @@ -26,7 +26,7 @@ "nuke": "rimraf ~/.budibase && npm run restore", "clean": "lerna clean", "kill-port": "kill-port 4001", - "dev": "npm run kill-port && node ./scripts/symlinkDev.js && lerna run --parallel dev:builder --concurrency 1", + "dev": "yarn run kill-port && node ./scripts/symlinkDev.js && lerna run --parallel dev:builder --concurrency 1", "test": "lerna run test", "lint": "eslint packages", "lint:fix": "eslint --fix packages", diff --git a/packages/builder/cypress/setup.js b/packages/builder/cypress/setup.js index f56374ea35..7f20eff88c 100644 --- a/packages/builder/cypress/setup.js +++ b/packages/builder/cypress/setup.js @@ -16,6 +16,9 @@ process.env.BUDIBASE_API_KEY = "6BE826CB-6B30-4AEC-8777-2E90464633DE" process.env.NODE_ENV = "cypress" process.env.ENABLE_ANALYTICS = "false" +// Stop info logs polluting test outputs +process.env.LOG_LEVEL = "error" + async function run(dir) { process.env.BUDIBASE_DIR = resolve(dir) require("dotenv").config({ path: resolve(dir, ".env") }) diff --git a/packages/builder/package.json b/packages/builder/package.json index 4254e3c7f6..b4ffcf7b66 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -81,8 +81,8 @@ "shortid": "^2.2.15", "svelte-loading-spinners": "^0.1.1", "svelte-portal": "^0.1.0", - "yup": "^0.29.2", - "uuid": "^8.3.1" + "uuid": "^8.3.1", + "yup": "^0.29.2" }, "devDependencies": { "@babel/core": "^7.5.5", @@ -90,6 +90,7 @@ "@babel/preset-env": "^7.5.5", "@babel/runtime": "^7.5.5", "@rollup/plugin-alias": "^3.0.1", + "@rollup/plugin-commonjs": "^16.0.0", "@rollup/plugin-json": "^4.0.3", "@sveltech/routify": "1.7.11", "@testing-library/jest-dom": "^5.11.0", @@ -104,7 +105,6 @@ "rimraf": "^3.0.2", "rollup": "^2.11.2", "rollup-plugin-alias": "^1.5.2", - "rollup-plugin-commonjs": "^10.0.0", "rollup-plugin-copy": "^3.0.0", "rollup-plugin-css-only": "^2.1.0", "rollup-plugin-livereload": "^1.0.0", @@ -115,7 +115,7 @@ "rollup-plugin-terser": "^7.0.2", "rollup-plugin-url": "^2.2.2", "start-server-and-test": "^1.11.0", - "svelte": "^3.29.0", + "svelte": "^3.30.0", "svelte-jester": "^1.0.6" }, "gitHead": "115189f72a850bfb52b65ec61d932531bf327072" diff --git a/packages/builder/rollup.config.js b/packages/builder/rollup.config.js index 93c36026e4..4afb8084bd 100644 --- a/packages/builder/rollup.config.js +++ b/packages/builder/rollup.config.js @@ -1,7 +1,7 @@ import alias from "@rollup/plugin-alias" import svelte from "rollup-plugin-svelte" import resolve from "rollup-plugin-node-resolve" -import commonjs from "rollup-plugin-commonjs" +import commonjs from "@rollup/plugin-commonjs" import url from "rollup-plugin-url" import livereload from "rollup-plugin-livereload" import { terser } from "rollup-plugin-terser" @@ -15,102 +15,7 @@ import json from "@rollup/plugin-json" import path from "path" const production = !process.env.ROLLUP_WATCH - -const lodash_fp_exports = [ - "flow", - "pipe", - "union", - "reduce", - "isUndefined", - "cloneDeep", - "split", - "some", - "map", - "filter", - "isEmpty", - "countBy", - "includes", - "last", - "find", - "constant", - "take", - "first", - "intersection", - "mapValues", - "isNull", - "has", - "isInteger", - "isNumber", - "isString", - "isBoolean", - "isDate", - "isArray", - "isObject", - "clone", - "values", - "keyBy", - "isNaN", - "keys", - "orderBy", - "concat", - "reverse", - "difference", - "merge", - "flatten", - "each", - "pull", - "join", - "defaultCase", - "uniqBy", - "every", - "uniqWith", - "isFunction", - "groupBy", - "differenceBy", - "intersectionBy", - "isEqual", - "max", - "sortBy", - "assign", - "uniq", - "trimChars", - "trimCharsStart", - "isObjectLike", - "flattenDeep", - "indexOf", - "isPlainObject", - "toNumber", - "takeRight", - "toPairs", - "remove", - "findIndex", - "compose", - "get", - "tap", -] - -const lodash_exports = [ - "flow", - "join", - "replace", - "trim", - "dropRight", - "takeRight", - "head", - "reduce", - "tail", - "startsWith", - "findIndex", - "merge", - "assign", - "each", - "find", - "orderBy", - "union", -] - const outputpath = "../server/builder" - const coreExternal = [ "lodash", "lodash/fp", @@ -224,13 +129,7 @@ export default { ) }, }), - commonjs({ - namedExports: { - "lodash/fp": lodash_fp_exports, - lodash: lodash_exports, - shortid: ["generate"], - }, - }), + commonjs(), url({ limit: 0, include: ["**/*.woff2", "**/*.png"], diff --git a/packages/builder/src/builderStore/fetchBindableProperties.js b/packages/builder/src/builderStore/fetchBindableProperties.js index 9a193112fb..962fb80ebf 100644 --- a/packages/builder/src/builderStore/fetchBindableProperties.js +++ b/packages/builder/src/builderStore/fetchBindableProperties.js @@ -24,7 +24,7 @@ import { cloneDeep, difference } from "lodash/fp" * @returns {Array.} */ export default function({ componentInstanceId, screen, components, tables }) { - const walkResult = walk({ + const result = walk({ // cloning so we are free to mutate props (e.g. by adding _contexts) instance: cloneDeep(screen.props), targetId: componentInstanceId, @@ -33,13 +33,10 @@ export default function({ componentInstanceId, screen, components, tables }) { }) return [ - ...walkResult.bindableInstances - .filter(isInstanceInSharedContext(walkResult)) - .map(componentInstanceToBindable(walkResult)), - - ...(walkResult.target?._contexts - .map(contextToBindables(tables, walkResult)) - .flat() ?? []), + ...result.bindableInstances + .filter(isInstanceInSharedContext(result)) + .map(componentInstanceToBindable), + ...(result.target?._contexts.map(contextToBindables(tables)).flat() ?? []), ] } @@ -53,26 +50,18 @@ const isInstanceInSharedContext = walkResult => i => // turns a component instance prop into binding expressions // used by the UI -const componentInstanceToBindable = walkResult => i => { - const lastContext = - i.instance._contexts.length && - i.instance._contexts[i.instance._contexts.length - 1] - const contextParentPath = lastContext - ? getParentPath(walkResult, lastContext) - : "" - +const componentInstanceToBindable = i => { return { type: "instance", instance: i.instance, // how the binding expression persists, and is used in the app at runtime - runtimeBinding: `${contextParentPath}${i.instance._id}.${i.prop}`, + runtimeBinding: `${i.instance._id}`, // how the binding exressions looks to the user of the builder readableBinding: `${i.instance._instanceName}`, } } -const contextToBindables = (tables, walkResult) => context => { - const contextParentPath = getParentPath(walkResult, context) +const contextToBindables = tables => context => { const tableId = context.table?.tableId ?? context.table const table = tables.find(table => table._id === tableId) let schema = @@ -98,7 +87,7 @@ const contextToBindables = (tables, walkResult) => context => { fieldSchema, instance: context.instance, // how the binding expression persists, and is used in the app at runtime - runtimeBinding: `${contextParentPath}data.${runtimeBoundKey}`, + runtimeBinding: `${context.instance._id}.${runtimeBoundKey}`, // how the binding expressions looks to the user of the builder readableBinding: `${context.instance._instanceName}.${table.name}.${key}`, // table / view info @@ -118,20 +107,6 @@ const contextToBindables = (tables, walkResult) => context => { ) } -const getParentPath = (walkResult, context) => { - // describes the number of "parent" in the path - // clone array first so original array is not mtated - const contextParentNumber = [...walkResult.target._contexts] - .reverse() - .indexOf(context) - - return ( - new Array(contextParentNumber).fill("parent").join(".") + - // trailing . if has parents - (contextParentNumber ? "." : "") - ) -} - const walk = ({ instance, targetId, components, tables, result }) => { if (!result) { result = { diff --git a/packages/builder/src/builderStore/replaceBindings.js b/packages/builder/src/builderStore/replaceBindings.js index aa57301261..0bf9f485c9 100644 --- a/packages/builder/src/builderStore/replaceBindings.js +++ b/packages/builder/src/builderStore/replaceBindings.js @@ -12,10 +12,7 @@ export function readableToRuntimeBinding(bindableProperties, textWithBindings) { return boundValue === `{{ ${readableBinding} }}` }) if (binding) { - result = textWithBindings.replace( - boundValue, - `{{ ${binding.runtimeBinding} }}` - ) + result = result.replace(boundValue, `{{ ${binding.runtimeBinding} }}`) } }) return result diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index 778c7f7be5..50c4347583 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -481,7 +481,7 @@ export const getFrontendStore = () => { // Try to extract a nav component from the master screen const nav = findChildComponentType( state.pages.main, - "@budibase/standard-components/Navigation" + "@budibase/standard-components/navigation" ) if (nav) { let newLink diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js b/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js index 0a40c62dc7..84de7e15ea 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js @@ -15,8 +15,6 @@ export class Component extends BaseStructure { selected: {}, }, _code: "", - className: "", - onLoad: [], type: "", _instanceName: "", _children: [], diff --git a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte index b3ec41b2a2..535b947f5f 100644 --- a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte +++ b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte @@ -1,140 +1,63 @@
- {#if hasComponent && $store.currentPreviewItem} + {#if $store.currentPreviewItem}