diff --git a/packages/builder/src/builderStore/store/index.js b/packages/builder/src/builderStore/store/index.js index 806bab8c8..9d06ca901 100644 --- a/packages/builder/src/builderStore/store/index.js +++ b/packages/builder/src/builderStore/store/index.js @@ -105,16 +105,11 @@ const setPackage = (store, initial) => async (pkg) => { initial.libraries = await fetchComponentLibModules(pkg.application) // TODO: Rename to componentDefinitions initial.components = await fetchComponentLibDefinitions(pkg.clientId, pkg.application._id); - initial.loadLibraryUrls = pageName => { - const libs = libUrlsForPreview(pkg, pageName) - return libs - } initial.appname = pkg.application.name initial.appId = pkg.application._id initial.pages = pkg.pages initial.hasAppPackage = true initial.screens = values(pkg.screens) - // initial.templates = pkg.components.templates initial.builtins = [getBuiltin("##builtin/screenslot")] initial.appInstances = pkg.application.instances initial.appId = pkg.application._id diff --git a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte index c77efe067..194e4eb8d 100644 --- a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte +++ b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte @@ -42,7 +42,8 @@ $: screensExist = $store.currentPreviewItem._screens && $store.currentPreviewItem._screens.length > 0 $: frontendDefinition = { - libraries: $store.libraries, + appId: $store.appId, + libraries: Object.keys($store.libraries), page: $store.currentPreviewItem, screens: screensExist ? $store.currentPreviewItem._screens : [{ name: "Screen Placeholder", diff --git a/packages/builder/src/components/userInterface/ComponentSelector.svelte b/packages/builder/src/components/userInterface/ComponentSelector.svelte deleted file mode 100644 index ec7355a97..000000000 --- a/packages/builder/src/components/userInterface/ComponentSelector.svelte +++ /dev/null @@ -1,138 +0,0 @@ - - -{#each componentLibraries as lib} -
{lib.libName}
- -
- - {#if allowGenerators} -
Generators
- - {#each lib.generators as generator} -
onGeneratorChosen(generator)}> -
{splitName(generator.name).componentName}
-
{generator.description}
-
- {/each} - {/if} - -
Components
- - {#each lib.components as component} -
onComponentChosen(component)}> -
{splitName(component.name).componentName}
-
{component.description}
-
- {/each} - -
-{/each} - -
My Components
- -
- - {#each screens as component} -
onComponentChosen(component)}> -
{component.name}
-
{component.description}
-
- {/each} - -
- - diff --git a/packages/client/package.json b/packages/client/package.json index bee0c348a..9ee7e3285 100644 --- a/packages/client/package.json +++ b/packages/client/package.json @@ -34,8 +34,6 @@ ] }, "dependencies": { - "@budibase/materialdesign-components": "^0.0.32", - "@budibase/standard-components": "^0.0.32", "@nx-js/compiler-util": "^2.0.0", "bcryptjs": "^2.4.3", "deep-equal": "^2.0.1", diff --git a/packages/client/src/index.js b/packages/client/src/index.js index 3155974d0..425e90007 100644 --- a/packages/client/src/index.js +++ b/packages/client/src/index.js @@ -1,15 +1,14 @@ import { createApp } from "./createApp" import { trimSlash } from "./common/trimSlash" import { builtins, builtinLibName } from "./render/builtinComponents" -import * as standardComponents from "../../standard-components/dist"; -import * as materialDesignComponents from "../../materialdesign-components/dist"; +// import * as standardComponents from "../../standard-components/dist"; +// import * as materialDesignComponents from "../../materialdesign-components/dist"; /** * create a web application from static budibase definition files. * @param {object} opts - configuration options for budibase client libary */ export const loadBudibase = async opts => { - let componentLibraries = opts && opts.componentLibraries const _window = (opts && opts.window) || window const _localStorage = (opts && opts.localStorage) || localStorage @@ -30,24 +29,20 @@ export const loadBudibase = async opts => { let { appRootPath } = frontendDefinition; appRootPath = appRootPath === "" ? "" : "/" + trimSlash(appRootPath) - // if (!componentLibraries) componentLibraries = {}; - componentLibraries = { - "@budibase/standard-components": standardComponents, - "@budibase/materialdesign-components": materialDesignComponents + const componentLibraryModules = {}; + const libraries = frontendDefinition.libraries || [ + "@budibase/standard-components", + "@budibase/materialdesign-components", + ]; + for (let library of libraries) { + // fetch the JavaScript for the component libraries from the server + componentLibraryModules[library] = await import( + `/${frontendDefinition.appId}/componentlibrary?library=${encodeURI(library)}` + ); }; - // if (!componentLibraries) { - // componentLibraries = {} - - // for (let lib of frontendDefinition.componentLibraries) { - // componentLibraries[lib.libName] = await import( - // `${frontendDefinition.appRootPath}/${trimSlash(lib.importPath)}` - // ) - // } - // } - - componentLibraries[builtinLibName] = builtins(_window) + componentLibraryModules[builtinLibName] = builtins(_window) const { initialisePage, @@ -56,7 +51,7 @@ export const loadBudibase = async opts => { routeTo, rootNode, } = createApp( - componentLibraries, + componentLibraryModules, frontendDefinition, user, uiFunctions || {}, diff --git a/packages/server/api/controllers/static.js b/packages/server/api/controllers/static.js index 328994d4c..1877a5ca5 100644 --- a/packages/server/api/controllers/static.js +++ b/packages/server/api/controllers/static.js @@ -2,18 +2,13 @@ const send = require("koa-send"); const { resolve, join } = require("path") const { homedir } = require("os"); -const isProduction = process.env.NODE_ENV === "production"; - exports.serveBuilder = async function(ctx) { - const builderPath = resolve(process.cwd(), "builder") - await send(ctx, ctx.file, { root: builderPath }) + let builderPath = resolve(process.cwd(), "builder") + + await send(ctx, ctx.file, { root: ctx.devPath || builderPath }) } exports.serveApp = async function(ctx) { - - // ONLY RELEVANT FOR THE CLIENT LIB - // const devPath = join("/tmp", ".budibase", ctx.params.appId); - // TODO: update homedir stuff to wherever budi is run // default to homedir const appPath = resolve( @@ -24,26 +19,25 @@ exports.serveApp = async function(ctx) { ctx.isAuthenticated ? "main" : "unauthenticated" ); - await send(ctx, ctx.file, { root: appPath }) + await send(ctx, ctx.file, { root: ctx.devPath || appPath }) } exports.serveComponentLibrary = async function(ctx) { - - let componentLibraryPath = join( - "/tmp", - ".budibase", + // TODO: update homedir stuff to wherever budi is run + // default to homedir + let componentLibraryPath = resolve( + homedir(), + ".budibase", + ctx.params.appId, + "node_modules", decodeURI(ctx.query.library), "dist" ); - if (isProduction) { - // TODO: update homedir stuff to wherever budi is run - // default to homedir - componentLibraryPath = resolve( - homedir(), - ".budibase", - ctx.params.appId, - "node_modules", + if (ctx.isDev) { + componentLibraryPath = join( + "/tmp", + ".budibase", decodeURI(ctx.query.library), "dist" ); diff --git a/packages/server/api/index.js b/packages/server/api/index.js index 2df19a1d1..a56062e77 100644 --- a/packages/server/api/index.js +++ b/packages/server/api/index.js @@ -40,6 +40,7 @@ module.exports = app => { latestPackagesFolder: resolve(homedir(), ".budibase"), secret: "foo" } + ctx.isDev = process.env.NODE_ENV !== "production"; await next(); }); diff --git a/packages/server/api/routes/static.js b/packages/server/api/routes/static.js index 056ee0325..20e5a07dc 100644 --- a/packages/server/api/routes/static.js +++ b/packages/server/api/routes/static.js @@ -6,6 +6,12 @@ const router = Router(); router .param("file", async (file, ctx, next) => { ctx.file = file && file.includes(".") ? file : "index.html"; + + // Serving the latest client library in dev + if (ctx.isDev && ctx.file.startsWith("budibase-client")) { + ctx.devPath = "/tmp/.budibase"; + } + await next(); }) .get("/_builder/:file*", controller.serveBuilder) diff --git a/packages/server/package.json b/packages/server/package.json index 40f711f37..2fe00ba00 100644 --- a/packages/server/package.json +++ b/packages/server/package.json @@ -10,7 +10,7 @@ "build": "", "initialise": "node ../cli/bin/budi init ./myapps -b local -q", "budi": "node ../cli/bin/budi", - "dev:builder": "node index --enable-source-maps" + "dev:builder": "nodemon index" }, "keywords": [ "budibase" diff --git a/packages/standard-components/components.json b/packages/standard-components/components.json index cd4a6d73a..05221aac9 100644 --- a/packages/standard-components/components.json +++ b/packages/standard-components/components.json @@ -263,17 +263,15 @@ } }, "datatable": { - "description": "Other thingwy", + "description": "an HTML table that fetches data from a model or view and displays it.", "props": { "_viewName": "string", "_instanceId": "string", "model": { - "store": true, "type": "options", "default": "", "options": [ - "something", - "something" + "all_6dc86335-83b7-462c-90ca-1fe7feb08942" ] } }