From 2ec4272558f516c3dba693d0779b94021630d2a9 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Tue, 19 Jan 2021 18:51:51 +0000 Subject: [PATCH] Update screen templates to work with latest bindings --- .../store/screenTemplates/index.js | 12 ------- .../store/screenTemplates/newRowScreen.js | 31 +++++++++-------- .../store/screenTemplates/rowDetailScreen.js | 33 ++++++++++--------- .../store/screenTemplates/utils/Component.js | 4 +-- .../store/screenTemplates/utils/Screen.js | 3 +- .../screenTemplates/utils/commonComponents.js | 5 ++- .../EventsEditor/actions/SaveRow.svelte | 12 +++---- packages/standard-components/manifest.json | 2 ++ 8 files changed, 48 insertions(+), 54 deletions(-) diff --git a/packages/builder/src/builderStore/store/screenTemplates/index.js b/packages/builder/src/builderStore/store/screenTemplates/index.js index 9258feb57e..6feb91f17c 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/index.js +++ b/packages/builder/src/builderStore/store/screenTemplates/index.js @@ -15,21 +15,9 @@ const allTemplates = tables => [ emptyRowDetailScreen, ] -// Recurses through a component tree and generates new unique ID's -const makeUniqueIds = component => { - if (!component) { - return - } - component._id = uuid() - if (component._children) { - component._children.forEach(makeUniqueIds) - } -} - // Allows us to apply common behaviour to all create() functions const createTemplateOverride = (frontendState, create) => () => { const screen = create() - makeUniqueIds(screen.props) screen.name = screen.props._id screen.routing.route = screen.routing.route.toLowerCase() return screen diff --git a/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js b/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js index 74f9b55fc8..2790a68677 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js @@ -21,26 +21,29 @@ export default function(tables) { export const newRowUrl = table => sanitizeUrl(`/${table.name}/new/row`) export const NEW_ROW_TEMPLATE = "NEW_ROW_TEMPLATE" -function generateTitleContainer(table) { - return makeTitleContainer("New Row").addChild(makeSaveButton(table)) +function generateTitleContainer(table, providerId) { + return makeTitleContainer("New Row").addChild( + makeSaveButton(table, providerId) + ) } const createScreen = table => { - const dataform = new Component( - "@budibase/standard-components/dataformwide" - ).instanceName("Form") - - const container = makeMainContainer() - .addChild(makeBreadcrumbContainer(table.name, "New")) - .addChild(generateTitleContainer(table)) - .addChild(dataform) - - return new Screen() + const screen = new Screen() .component("@budibase/standard-components/newrow") .table(table._id) .route(newRowUrl(table)) .instanceName(`${table.name} - New`) .name("") - .addChild(container) - .json() + + const dataform = new Component( + "@budibase/standard-components/dataformwide" + ).instanceName("Form") + + const providerId = screen._json.props._id + const container = makeMainContainer() + .addChild(makeBreadcrumbContainer(table.name, "New")) + .addChild(generateTitleContainer(table, providerId)) + .addChild(dataform) + + return screen.addChild(container).json() } diff --git a/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js b/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js index 526f457f3e..0a9148eaf8 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js @@ -25,9 +25,9 @@ export default function(tables) { export const ROW_DETAIL_TEMPLATE = "ROW_DETAIL_TEMPLATE" export const rowDetailUrl = table => sanitizeUrl(`/${table.name}/:id`) -function generateTitleContainer(table, title) { +function generateTitleContainer(table, title, providerId) { // have to override style for this, its missing margin - const saveButton = makeSaveButton(table).normalStyle({ + const saveButton = makeSaveButton(table, providerId).normalStyle({ background: "#000000", "border-width": "0", "border-style": "None", @@ -60,8 +60,8 @@ function generateTitleContainer(table, title) { onClick: [ { parameters: { - rowId: "{{ data._id }}", - revId: "{{ data._rev }}", + rowId: `{{ ${providerId}._id }}`, + revId: `{{ ${providerId}._rev }}`, tableId: table._id, }, "##eventHandlerType": "Delete Row", @@ -82,21 +82,22 @@ function generateTitleContainer(table, title) { } const createScreen = (table, heading) => { - const dataform = new Component( - "@budibase/standard-components/dataformwide" - ).instanceName("Form") - - const container = makeMainContainer() - .addChild(makeBreadcrumbContainer(table.name, heading || "Edit")) - .addChild(generateTitleContainer(table, heading || "Edit Row")) - .addChild(dataform) - - return new Screen() + const screen = new Screen() .component("@budibase/standard-components/rowdetail") .table(table._id) .instanceName(`${table.name} - Detail`) .route(rowDetailUrl(table)) .name("") - .addChild(container) - .json() + + const dataform = new Component( + "@budibase/standard-components/dataformwide" + ).instanceName("Form") + + const providerId = screen._json.props._id + const container = makeMainContainer() + .addChild(makeBreadcrumbContainer(table.name, heading || "Edit")) + .addChild(generateTitleContainer(table, heading || "Edit Row", providerId)) + .addChild(dataform) + + return screen.addChild(container).json() } diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js b/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js index bd03fc7cdc..a74ea526f7 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/Component.js @@ -1,4 +1,4 @@ -import { v4 } from "uuid" +import { uuid } from "builderStore/uuid" import { BaseStructure } from "./BaseStructure" export class Component extends BaseStructure { @@ -6,7 +6,7 @@ export class Component extends BaseStructure { super(false) this._children = [] this._json = { - _id: v4(), + _id: uuid(), _component: name, _styles: { normal: {}, diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js b/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js index 00bd43ec2c..79e1632ad2 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/Screen.js @@ -1,4 +1,5 @@ import { BaseStructure } from "./BaseStructure" +import { uuid } from "builderStore/uuid" export class Screen extends BaseStructure { constructor() { @@ -6,7 +7,7 @@ export class Screen extends BaseStructure { this._json = { layoutId: "layout_private_master", props: { - _id: "", + _id: uuid(), _component: "", _styles: { normal: {}, diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js index 89e08cecdb..a00f66f828 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js @@ -78,7 +78,7 @@ export function makeBreadcrumbContainer(tableName, text, capitalise = false) { .addChild(identifierText) } -export function makeSaveButton(table) { +export function makeSaveButton(table, providerId) { return new Component("@budibase/standard-components/button") .normalStyle({ background: "#000000", @@ -100,8 +100,7 @@ export function makeSaveButton(table) { onClick: [ { parameters: { - contextPath: "data", - tableId: table._id, + providerId, }, "##eventHandlerType": "Save Row", }, diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte index 4eef700ad0..9811ba1734 100644 --- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte +++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/SaveRow.svelte @@ -44,13 +44,13 @@ {/each} - {/if} - {#if parameters.contextPath} - + {#if parameters.providerId} + + {/if} {/if} diff --git a/packages/standard-components/manifest.json b/packages/standard-components/manifest.json index 214580cdca..0fceea4deb 100644 --- a/packages/standard-components/manifest.json +++ b/packages/standard-components/manifest.json @@ -426,6 +426,8 @@ "icon": "ri-profile-line", "hasChildren": true, "styleable": true, + "dataProvider": true, + "datasourceSetting": "table", "settings": [ { "type": "table",