From d85665d21c43c4a4e07ddec3f3e21ed194cc2196 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Wed, 3 Feb 2021 14:53:13 +0000 Subject: [PATCH] Allow forms to generate query schemas. Fix query execution action --- .../store/screenTemplates/newRowScreen.js | 4 +- .../store/screenTemplates/rowDetailScreen.js | 4 +- .../screenTemplates/utils/commonComponents.js | 42 +++++++++---------- .../SetupPanel/GenericBindingPopover.svelte | 1 - .../PropertiesPanel/SettingsView.svelte | 11 +++-- packages/client/src/api/queries.js | 4 +- packages/client/src/utils/buttonActions.js | 6 +-- packages/client/src/utils/componentProps.js | 5 +-- .../standard-components/src/forms/Form.svelte | 7 +--- 9 files changed, 40 insertions(+), 44 deletions(-) diff --git a/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js b/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js index 21754256cd..5c32144190 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/newRowScreen.js @@ -6,7 +6,7 @@ import { makeMainForm, makeTitleContainer, makeSaveButton, - makeSchemaFormComponents, + makeTableFormComponents, } from "./utils/commonComponents" export default function(tables) { @@ -51,7 +51,7 @@ const createScreen = table => { }) // Add all form fields from this schema to the field group - makeSchemaFormComponents(table._id).forEach(component => { + makeTableFormComponents(table._id).forEach(component => { fieldGroup.addChild(component) }) diff --git a/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js b/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js index dc629d057f..f15f188681 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js +++ b/packages/builder/src/builderStore/store/screenTemplates/rowDetailScreen.js @@ -7,7 +7,7 @@ import { makeBreadcrumbContainer, makeTitleContainer, makeSaveButton, - makeSchemaFormComponents, + makeTableFormComponents, makeMainForm, } from "./utils/commonComponents" @@ -106,7 +106,7 @@ const createScreen = table => { }) // Add all form fields from this schema to the field group - makeSchemaFormComponents(table._id).forEach(component => { + makeTableFormComponents(table._id).forEach(component => { fieldGroup.addChild(component) }) diff --git a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js index f777c12334..d2757ec054 100644 --- a/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js +++ b/packages/builder/src/builderStore/store/screenTemplates/utils/commonComponents.js @@ -43,25 +43,6 @@ export function makeMainForm() { .instanceName("Form") } -export function makeMainContainer() { - return new Component("@budibase/standard-components/container") - .type("div") - .normalStyle({ - width: "700px", - padding: "0px", - "border-radius": "0.5rem", - "box-shadow": "0 1px 2px 0 rgba(0, 0, 0, 0.05)", - margin: "auto", - "margin-top": "20px", - "padding-top": "48px", - "padding-bottom": "48px", - "padding-right": "48px", - "padding-left": "48px", - "margin-bottom": "20px", - }) - .instanceName("Form") -} - export function makeBreadcrumbContainer(tableName, text, capitalise = false) { const link = makeLinkComponent(tableName).instanceName("Back Link") @@ -180,11 +161,30 @@ const fieldTypeToComponentMap = { link: "relationshipfield", } -export function makeSchemaFormComponents(tableId) { +export function makeTableFormComponents(tableId) { const tables = get(backendUiStore).tables const schema = tables.find(table => table._id === tableId)?.schema ?? {} + return makeSchemaFormComponents(schema) +} + +export function makeQueryFormComponents(queryId) { + const queries = get(backendUiStore).queries + const schema = queries.find(query => query._id === queryId)?.schema ?? [] + return makeSchemaFormComponents(schema) +} + +export function makeDatasourceFormComponents(datasource) { + if (!datasource) { + return [] + } + return datasource.type === "table" + ? makeTableFormComponents(datasource.tableId) + : makeQueryFormComponents(datasource._id) +} + +function makeSchemaFormComponents(schema) { let components = [] - let fields = Object.keys(schema) + let fields = Object.keys(schema || {}) fields.forEach(field => { const fieldSchema = schema[field] const componentType = fieldTypeToComponentMap[fieldSchema.type] diff --git a/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte b/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte index 3956e765ee..2a58255e57 100644 --- a/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte +++ b/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte @@ -2,7 +2,6 @@ import groupBy from "lodash/fp/groupBy" import { TextArea, - Label, Input, Heading, Body, diff --git a/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte b/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte index fb8ebbf8e4..9f16578ce5 100644 --- a/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte +++ b/packages/builder/src/components/design/PropertiesPanel/SettingsView.svelte @@ -5,7 +5,7 @@ import ConfirmDialog from "components/common/ConfirmDialog.svelte" import { currentAsset } from "builderStore" import { findClosestMatchingComponent } from "builderStore/storeUtils" - import { makeSchemaFormComponents } from "builderStore/store/screenTemplates/utils/commonComponents" + import { makeDatasourceFormComponents } from "builderStore/store/screenTemplates/utils/commonComponents" import PropertyControl from "./PropertyControls/PropertyControl.svelte" import Input from "./PropertyControls/Input.svelte" import LayoutSelect from "./PropertyControls/LayoutSelect.svelte" @@ -106,9 +106,12 @@ componentInstance._id, component => component._component.endsWith("/form") ) - const tableId = form?.datasource?.tableId - const fields = makeSchemaFormComponents(tableId).map(field => field.json()) - onChange("_children", fields) + const datasource = form?.datasource + const fields = makeDatasourceFormComponents(datasource) + onChange( + "_children", + fields.map(field => field.json()) + ) } diff --git a/packages/client/src/api/queries.js b/packages/client/src/api/queries.js index 4e89921bb6..9b213d5c46 100644 --- a/packages/client/src/api/queries.js +++ b/packages/client/src/api/queries.js @@ -4,7 +4,7 @@ import API from "./api" /** * Executes a query against an external data connector. */ -export const executeQuery = async ({ queryId, parameters }) => { +export const executeQuery = async ({ queryId, parameters, notify = false }) => { const res = await API.post({ url: `/api/queries/${queryId}`, body: { @@ -13,6 +13,8 @@ export const executeQuery = async ({ queryId, parameters }) => { }) if (res.error) { notificationStore.danger("An error has occurred") + } else if (notify) { + notificationStore.success("Query executed successfully") } return res } diff --git a/packages/client/src/utils/buttonActions.js b/packages/client/src/utils/buttonActions.js index fdeb65ffb0..4b12823d2b 100644 --- a/packages/client/src/utils/buttonActions.js +++ b/packages/client/src/utils/buttonActions.js @@ -50,13 +50,13 @@ const navigationHandler = action => { } } -const queryExecutionHandler = async (action, context) => { +const queryExecutionHandler = async action => { const { datasourceId, queryId, queryParams } = action.parameters - const enrichedQueryParameters = enrichDataBindings(queryParams || {}, context) await executeQuery({ datasourceId, queryId, - parameters: enrichedQueryParameters, + parameters: queryParams, + notify: true, }) } diff --git a/packages/client/src/utils/componentProps.js b/packages/client/src/utils/componentProps.js index 42bb6e624a..938ed59ac1 100644 --- a/packages/client/src/utils/componentProps.js +++ b/packages/client/src/utils/componentProps.js @@ -46,10 +46,7 @@ export const enrichProps = async (props, context, user) => { // Enrich button actions if they exist if (props._component.endsWith("/button") && enrichedProps.onClick) { - enrichedProps.onClick = enrichButtonActions( - enrichedProps.onClick, - totalContext - ) + enrichedProps.onClick = enrichButtonActions(enrichedProps.onClick) } return enrichedProps diff --git a/packages/standard-components/src/forms/Form.svelte b/packages/standard-components/src/forms/Form.svelte index 276323d3b0..31623d30f6 100644 --- a/packages/standard-components/src/forms/Form.svelte +++ b/packages/standard-components/src/forms/Form.svelte @@ -133,12 +133,7 @@ } else { table = await API.fetchTableDefinition(datasource?.tableId) if (table) { - if (datasource.type === "query") { - console.log("No implementation for queries yet") - schema = {} - } else { - schema = table.schema || {} - } + schema = table.schema || {} } } loaded = true