From 277524b86ed8eccd3cfe2e8216769c64490b0fec Mon Sep 17 00:00:00 2001 From: Martin McKeaveney Date: Thu, 3 Dec 2020 17:31:38 +0000 Subject: [PATCH] accommodate login layout --- packages/builder/src/builderStore/index.js | 3 +- .../store/screenTemplates/utils/Screen.js | 1 + .../components/userInterface/Layout.svelte | 8 +- packages/builder/src/constants/index.js | 7 + .../server/src/api/controllers/application.js | 6 - packages/server/src/constants/layouts.js | 132 ++++++++---------- packages/server/src/constants/screens.js | 3 + packages/server/src/db/utils.js | 4 +- 8 files changed, 79 insertions(+), 85 deletions(-) diff --git a/packages/builder/src/builderStore/index.js b/packages/builder/src/builderStore/index.js index 41536d6205..0475a5c301 100644 --- a/packages/builder/src/builderStore/index.js +++ b/packages/builder/src/builderStore/index.js @@ -4,6 +4,7 @@ import { getAutomationStore } from "./store/automation/" import { getThemeStore } from "./store/theme" import { derived } from "svelte/store" import analytics from "analytics" +import { LAYOUT_NAMES } from "../constants" export const store = getFrontendStore() export const backendUiStore = getBackendUiStore() @@ -37,7 +38,7 @@ export const allScreens = derived(store, $store => { export const mainLayout = derived(store, $store => { return $store.layouts?.find( - layout => layout.props?._id === "private-master-layout" + layout => layout.props?._id === LAYOUT_NAMES.MASTER.PRIVATE ) }) diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js b/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js index 76df96ae0c..df727de9a1 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js @@ -5,6 +5,7 @@ export class Screen extends BaseStructure { super(true) this._json = { props: { + layoutId: "layout_private_master", _id: "", _component: "", _styles: { diff --git a/packages/builder/src/components/userInterface/Layout.svelte b/packages/builder/src/components/userInterface/Layout.svelte index 7f1f417609..7222ffd36a 100644 --- a/packages/builder/src/components/userInterface/Layout.svelte +++ b/packages/builder/src/components/userInterface/Layout.svelte @@ -15,9 +15,9 @@ const dragDropStore = initDragDropStore() - const setCurrentScreenToLayout = () => { - store.actions.selectAssetType(FrontendTypes.LAYOUT) - $goto("./layouts") + const selectLayout = () => { + store.actions.layouts.select(layout._id) + $goto(`./layouts/${layout._id}`) } @@ -28,7 +28,7 @@ withArrow selected={$store.currentComponentInfo?._id === layout.props._id} opened={$store.currentAssetId === layout._id} - on:click={setCurrentScreenToLayout} /> + on:click={selectLayout} /> {#if $store.currentAssetId === layout._id && layout.props._children} { let screensAndLayouts = [] for (let layout of BASE_LAYOUTS) { const cloned = cloneDeep(layout) - cloned._id = generateLayoutID() cloned.title = app.name screensAndLayouts.push(recurseMustache(cloned, app)) } const homeScreen = cloneDeep(HOME_SCREEN) homeScreen._id = generateScreenID() - // TODO: fix - could have multiple base layouts - homeScreen.props.layoutId = screensAndLayouts[0]._id screensAndLayouts.push(homeScreen) const loginScreen = cloneDeep(LOGIN_SCREEN) loginScreen._id = generateScreenID() - // TODO: fix - could have multiple base layouts - loginScreen.props.layoutId = screensAndLayouts[0]._id screensAndLayouts.push(loginScreen) await db.bulkDocs(screensAndLayouts) diff --git a/packages/server/src/constants/layouts.js b/packages/server/src/constants/layouts.js index 1a0768dc3f..4b1acabb55 100644 --- a/packages/server/src/constants/layouts.js +++ b/packages/server/src/constants/layouts.js @@ -1,10 +1,11 @@ const BASE_LAYOUT_PROP_IDS = { - PRIVATE: "private-master-layout", - PUBLIC: "public-master-layout", + PRIVATE: "layout_private_master", + PUBLIC: "layout_public_master", } const BASE_LAYOUTS = [ { + _id: BASE_LAYOUT_PROP_IDS.PRIVATE, componentLibraries: ["@budibase/standard-components"], title: "{{ name }}", favicon: "./_shared/favicon.png", @@ -145,76 +146,63 @@ const BASE_LAYOUTS = [ onLoad: [], }, }, - // // TODO: needs removed - // { - // componentLibraries: ["@budibase/standard-components"], - // title: "{{ name }}", - // favicon: "./_shared/favicon.png", - // stylesheets: [], - // name: "Unauthenticated", - // props: { - // _id: BASE_LAYOUT_PROP_IDS.PUBLIC, - // _component: "@budibase/standard-components/container", - // _children: [ - // { - // _id: "686c252d-dbf2-4e28-9078-414ba4719759", - // _component: "@budibase/standard-components/login", - // _styles: { - // normal: { - // padding: "64px", - // background: "rgba(255, 255, 255, 0.4)", - // "border-radius": "0.5rem", - // "margin-top": "0px", - // margin: "0px", - // "line-height": "1", - // "box-shadow": - // "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)", - // "font-size": "16px", - // "font-family": "Inter", - // flex: "0 1 auto", - // transform: "0", - // }, - // hover: {}, - // active: {}, - // selected: {}, - // }, - // _code: "", - // loginRedirect: "", - // usernameLabel: "Username", - // passwordLabel: "Password", - // loginButtonLabel: "Login", - // buttonClass: "", - // _instanceName: "Login", - // inputClass: "", - // _children: [], - // title: "Log in to {{ name }}", - // buttonText: "Log In", - // logo: - // "https://d33wubrfki0l68.cloudfront.net/aac32159d7207b5085e74a7ef67afbb7027786c5/2b1fd/img/logo/bb-emblem.svg", - // }, - // ], - // type: "div", - // _styles: { - // active: {}, - // hover: {}, - // normal: { - // display: "flex", - // "flex-direction": "column", - // "align-items": "center", - // "justify-content": "center", - // "margin-right": "auto", - // "margin-left": "auto", - // "min-height": "100%", - // "background-image": - // "linear-gradient(135deg, rgba(252,215,212,1) 20%, rgba(207,218,255,1) 100%);", - // }, - // selected: {}, - // }, - // _code: "", - // className: "", - // onLoad: [], - // }, - // }, + { + _id: BASE_LAYOUT_PROP_IDS.PUBLIC, + componentLibraries: ["@budibase/standard-components"], + title: "{{ name }}", + favicon: "./_shared/favicon.png", + stylesheets: [], + name: "Login", + props: { + _id: BASE_LAYOUT_PROP_IDS.PUBLIC, + _component: "@budibase/standard-components/container", + _children: [ + { + _id: "7fcf11e4-6f5b-4085-8e0d-9f3d44c98967", + _component: "##builtin/screenslot", + _styles: { + normal: { + flex: "1 1 auto", + display: "flex", + "flex-direction": "column", + "justify-content": "flex-start", + "align-items": "stretch", + "max-width": "100%", + "margin-left": "20px", + "margin-right": "20px", + width: "1400px", + padding: "20px", + }, + hover: {}, + active: {}, + selected: {}, + }, + _code: "", + _children: [], + }, + ], + type: "div", + _styles: { + active: {}, + hover: {}, + normal: { + display: "flex", + "flex-direction": "column", + "align-items": "center", + "justify-content": "center", + "margin-right": "auto", + "margin-left": "auto", + "min-height": "100%", + "background-image": + "linear-gradient(135deg, rgba(252,215,212,1) 20%, rgba(207,218,255,1) 100%);", + }, + selected: {}, + }, + _code: "", + className: "", + onLoad: [], + }, + }, ] module.exports = { diff --git a/packages/server/src/constants/screens.js b/packages/server/src/constants/screens.js index 4e7c9ed121..3ff3a68590 100644 --- a/packages/server/src/constants/screens.js +++ b/packages/server/src/constants/screens.js @@ -1,9 +1,11 @@ const { BUILTIN_ROLE_IDS } = require("../utilities/security/roles") +const { BASE_LAYOUT_PROP_IDS } = require("./layouts") exports.HOME_SCREEN = { description: "", url: "", props: { + layoutId: BASE_LAYOUT_PROP_IDS.PRIVATE, _id: "d834fea2-1b3e-4320-ab34-f9009f5ecc59", _component: "@budibase/standard-components/container", _styles: { @@ -103,6 +105,7 @@ exports.LOGIN_SCREEN = { description: "", url: "", props: { + layoutId: BASE_LAYOUT_PROP_IDS.PUBLIC, _id: "5beb4c7b-3c8b-49b2-b8b3-d447dc76dda7", _component: "@budibase/standard-components/container", _styles: { diff --git a/packages/server/src/db/utils.js b/packages/server/src/db/utils.js index 6f24872ba7..c44e080caa 100644 --- a/packages/server/src/db/utils.js +++ b/packages/server/src/db/utils.js @@ -187,8 +187,8 @@ exports.getRoleParams = (roleId = null, otherProps = {}) => { * Generates a new layout ID. * @returns {string} The new layout ID which the layout doc can be stored under. */ -exports.generateLayoutID = () => { - return `${DocumentTypes.LAYOUT}${SEPARATOR}${newid()}` +exports.generateLayoutID = id => { + return `${DocumentTypes.LAYOUT}${SEPARATOR}${id || newid()}` } /**