MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'develop' into feature/licensing

This commit is contained in:
Rory Powell 2022-04-20 14:59:36 +01:00
parent c92e7120de 282d2b73cc
commit d2a4e0a934
73 changed files with 1535 additions and 358 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
.github/ISSUE_TEMPLATE/bug_report.md vendored
View File

@ -7,6 +7,15 @@ assignees: ''
---
**Hosting**
<!-- Delete as appropriate -->
- Self
- Method: <method> <!-- One of: k8s, docker single image, docker compose, digital ocean: -->
- Budibase Version: <version> <!-- e.g. 1.0.105 -->
- App Version: <version> <!-- Indicate app version if bug is related to an application -->
- Cloud
- Tenant ID: <tenantId> <!-- shown in URL as <tenantID>.budibase.app -->
**Describe the bug**
A clear and concise description of what the bug is.

11
charts/budibase/templates/app-service-deployment.yaml
View File

@ -110,12 +110,23 @@ spec:
value: {{ .Values.globals.google.clientId | quote }}
- name: GOOGLE_CLIENT_SECRET
value: {{ .Values.globals.google.secret | quote }}
- name: AUTOMATION_MAX_ITERATIONS
value: {{ .Values.globals.automationMaxIterations | quote }}
image: budibase/apps:{{ .Values.globals.appVersion }}
imagePullPolicy: Always
name: bbapps
ports:
- containerPort: {{ .Values.services.apps.port }}
resources: {}
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
restartPolicy: Always
serviceAccountName: ""
status: {}

8
charts/budibase/templates/couchdb-backup.yaml
View File

@ -39,5 +39,13 @@ spec:
imagePullPolicy: Always
name: couchdb-backup
resources: {}
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
status: {}
{{- end }}

8
charts/budibase/templates/minio-service-deployment.yaml
View File

@ -60,6 +60,14 @@ spec:
volumeMounts:
- mountPath: /data
name: minio-data
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
restartPolicy: Always
serviceAccountName: ""
volumes:

8
charts/budibase/templates/proxy-service-deployment.yaml
View File

@ -32,6 +32,14 @@ spec:
- containerPort: {{ .Values.services.proxy.port }}
resources: {}
volumeMounts:
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
restartPolicy: Always
serviceAccountName: ""
volumes:

8
charts/budibase/templates/redis-service-deployment.yaml
View File

@ -39,6 +39,14 @@ spec:
volumeMounts:
- mountPath: /data
name: redis-data
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
restartPolicy: Always
serviceAccountName: ""
volumes:

8
charts/budibase/templates/worker-service-deployment.yaml
View File

@ -121,6 +121,14 @@ spec:
ports:
- containerPort: {{ .Values.services.worker.port }}
resources: {}
{{- with .Values.affinity }}
affinity:
{{- toYaml . | nindent 8 }}
{{- end }}
{{- with .Values.tolerations }}
tolerations:
{{- toYaml . | nindent 8 }}
{{- end }}
restartPolicy: Always
serviceAccountName: ""
status: {}

3
charts/budibase/values.yaml
View File

@ -101,6 +101,7 @@ globals:
google:
clientId: ""
secret: ""
automationMaxIterations: "500"
createSecrets: true # creates an internal API key, JWT secrets and redis password for you
@ -228,6 +229,8 @@ couchdb:
## Optional tolerations
tolerations: []
affinity: {}
service:
# annotations:
enabled: true

2
lerna.json
View File

@ -1,5 +1,5 @@
{
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"npmClient": "yarn",
"packages": [
"packages/*"

2
packages/backend-core/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@budibase/backend-core",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Budibase backend core libraries used in server and worker",
"main": "src/index.js",
"author": "Budibase",

1
packages/backend-core/src/constants.js
View File

@ -17,6 +17,7 @@ exports.Headers = {
API_VER: "x-budibase-api-version",
APP_ID: "x-budibase-app-id",
TYPE: "x-budibase-type",
PREVIEW_ROLE: "x-budibase-role",
TENANT_ID: "x-budibase-tenant-id",
TOKEN: "x-budibase-token",
CSRF_TOKEN: "x-csrf-token",

4
packages/bbui/package.json
View File

@ -1,7 +1,7 @@
{
"name": "@budibase/bbui",
"description": "A UI solution used in the different Budibase projects.",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"license": "MPL-2.0",
"svelte": "src/index.js",
"module": "dist/bbui.es.js",
@ -38,7 +38,7 @@
],
"dependencies": {
"@adobe/spectrum-css-workflow-icons": "^1.2.1",
"@budibase/string-templates": "^1.0.105-alpha.14",
"@budibase/string-templates": "^1.0.105-alpha.23",
"@spectrum-css/actionbutton": "^1.0.1",
"@spectrum-css/actiongroup": "^1.0.1",
"@spectrum-css/avatar": "^3.0.2",

8
packages/bbui/src/Layout/Layout.svelte
View File

@ -36,6 +36,10 @@
padding-left: var(--spacing-l);
padding-right: var(--spacing-l);
}
.paddingX-XL {
padding-left: var(--spacing-xl);
padding-right: var(--spacing-xl);
}
.paddingY-S {
padding-top: var(--spacing-s);
padding-bottom: var(--spacing-s);
@ -48,6 +52,10 @@
padding-top: var(--spacing-l);
padding-bottom: var(--spacing-l);
}
.paddingY-XL {
padding-top: var(--spacing-xl);
padding-bottom: var(--spacing-xl);
}
.gap-XXS {
grid-gap: var(--spacing-xs);
}

45
packages/bbui/src/Table/InternalRenderer.svelte
View File

@ -1,42 +1,21 @@
<script>
import Icon from "../Icon/Icon.svelte"
import { copyToClipboard } from "../helpers"
import { notifications } from "../Stores/notifications"
export let value
const onClick = e => {
const onClick = async e => {
e.stopPropagation()
copyToClipboard(value)
}
const copyToClipboard = value => {
return new Promise(res => {
if (navigator.clipboard && window.isSecureContext) {
// Try using the clipboard API first
navigator.clipboard.writeText(value).then(res)
} else {
// Fall back to the textarea hack
let textArea = document.createElement("textarea")
textArea.value = value
textArea.style.position = "fixed"
textArea.style.left = "-9999px"
textArea.style.top = "-9999px"
document.body.appendChild(textArea)
textArea.focus()
textArea.select()
document.execCommand("copy")
textArea.remove()
res()
}
})
.then(() => {
notifications.success("Copied to clipboard")
})
.catch(() => {
notifications.error(
"Failed to copy to clipboard. Check the dev console for the value."
)
console.warn("Failed to copy the value", value)
})
try {
await copyToClipboard(value)
notifications.success("Copied to clipboard")
} catch (error) {
notifications.error(
"Failed to copy to clipboard. Check the dev console for the value."
)
console.warn("Failed to copy the value", value)
}
}
</script>

2
packages/bbui/src/Tabs/Tabs.svelte
View File

@ -108,7 +108,7 @@
padding-left: var(--spacing-xl);
padding-right: var(--spacing-xl);
position: relative;
border-bottom: var(--border-light);
border-bottom: 1px solid var(--spectrum-global-color-gray-300);
}
.spectrum-Tabs-content {
margin-top: var(--spectrum-global-dimension-static-size-150);

26
packages/bbui/src/helpers.js
View File

@ -106,3 +106,29 @@ export const deepSet = (obj, key, value) => {
export const cloneDeep = obj => {
return JSON.parse(JSON.stringify(obj))
}
/**
* Copies a value to the clipboard
* @param value the value to copy
*/
export const copyToClipboard = value => {
return new Promise(res => {
if (navigator.clipboard && window.isSecureContext) {
// Try using the clipboard API first
navigator.clipboard.writeText(value).then(res)
} else {
// Fall back to the textarea hack
let textArea = document.createElement("textarea")
textArea.value = value
textArea.style.position = "fixed"
textArea.style.left = "-9999px"
textArea.style.top = "-9999px"
document.body.appendChild(textArea)
textArea.focus()
textArea.select()
document.execCommand("copy")
textArea.remove()
res()
}
})
}

6
packages/builder/cypress/integration/createAutomation.spec.js
View File

@ -20,7 +20,6 @@ filterTests(['smoke', 'all'], () => {
})
// Setup trigger
cy.contains("Setup").click()
cy.get(".spectrum-Picker-label").click()
cy.wait(500)
cy.contains("dog").click()
@ -32,12 +31,11 @@ filterTests(['smoke', 'all'], () => {
cy.contains("Create Row").trigger('mouseover').click().click()
cy.get(".spectrum-Button--cta").click()
})
cy.contains("Setup").click()
cy.get(".spectrum-Picker-label").eq(1).click()
cy.contains("dog").click()
cy.get(".spectrum-Textfield-input")
.first()
.type("{{ trigger.row.name }}", { parseSpecialCharSequences: false })
.first()
.type("{{ trigger.row.name }}", { parseSpecialCharSequences: false })
cy.get(".spectrum-Textfield-input")
.eq(1)
.type("11")

4
packages/builder/cypress/integration/createTable.spec.js
View File

@ -55,7 +55,7 @@ filterTests(["smoke", "all"], () => {
if (Cypress.env("TEST_ENV")) {
// No Pagination in CI - Test env only for the next two tests
it("Adds 15 rows and checks pagination", () => {
xit("Adds 15 rows and checks pagination", () => {
// 10 rows per page, 15 rows should create 2 pages within table
const totalRows = 16
for (let i = 1; i < totalRows; i++) {
@ -71,7 +71,7 @@ filterTests(["smoke", "all"], () => {
})
})
it("Deletes rows and checks pagination", () => {
xit("Deletes rows and checks pagination", () => {
// Delete rows, removing second page from table
cy.get(".spectrum-Checkbox-input").check({ force: true })
cy.get(".popovers").within(() => {

48
packages/builder/cypress/integration/datasources/mySql.spec.js
View File

@ -19,6 +19,7 @@ filterTests(["all"], () => {
cy.get(".spectrum-Button")
.contains("Save and fetch tables")
.click({ force: true })
cy.wait(500)
// Intercept Request after button click & apply assertions
cy.wait("@datasource")
cy.get("@datasource")
@ -31,6 +32,7 @@ filterTests(["all"], () => {
cy.get("@datasource")
.its("response.body")
.should("have.property", "status", 500)
cy.get(".spectrum-Button").contains("Skip table fetch").click({ force: true })
})
it("should add MySQL data source and fetch tables", () => {
@ -72,10 +74,13 @@ filterTests(["all"], () => {
cy.get(".spectrum-Popover").contains("COUNTRIES").click()
cy.get(".spectrum-Picker").eq(4).click()
cy.get(".spectrum-Popover").contains("REGION_ID").click()
// Save relationship & reload page
cy.get(".spectrum-Button").contains("Save").click({ force: true })
cy.reload()
})
// Save relationship & reload page
cy.get(".spectrum-ButtonGroup").within(() => {
cy.get(".spectrum-Button").contains("Save").click({ force: true })
})
cy.reload()
// Confirm table length & column name
cy.get(".spectrum-Table")
.eq(1)
@ -131,7 +136,7 @@ filterTests(["all"], () => {
cy.get(".spectrum-Table")
.eq(1)
.within(() => {
cy.get(".spectrum-Table-row").eq(0).click()
cy.get(".spectrum-Table-row").eq(0).click({ force: true })
cy.wait(500)
})
cy.get(".spectrum-Dialog-grid").within(() => {
@ -175,11 +180,12 @@ filterTests(["all"], () => {
})
it("should duplicate a query", () => {
// Get last nav item - The query
/// Get query nav item - QueryName
cy.get(".nav-item")
.last()
.contains(queryName)
.parent()
.within(() => {
cy.get(".icon").eq(1).click({ force: true })
cy.get(".spectrum-Icon").eq(1).click({ force: true })
})
// Select and confirm duplication
cy.get(".spectrum-Menu").contains("Duplicate").click()
@ -199,23 +205,21 @@ filterTests(["all"], () => {
})
it("should delete a query", () => {
// Get last nav item - The query
for (let i = 0; i < 2; i++) {
cy.get(".nav-item")
.last()
.within(() => {
cy.get(".icon").eq(1).click({ force: true })
})
// Select Delete
cy.get(".spectrum-Menu").contains("Delete").click()
cy.get(".spectrum-Button")
.contains("Delete Query")
.click({ force: true })
cy.wait(1000)
}
// Get query nav item - QueryName
cy.get(".nav-item")
.contains(queryName)
.parent()
.within(() => {
cy.get(".spectrum-Icon").eq(1).click({ force: true })
})
// Select Delete
cy.get(".spectrum-Menu").contains("Delete").click()
cy.get(".spectrum-Button")
.contains("Delete Query")
.click({ force: true })
cy.wait(1000)
// Confirm deletion
cy.get(".nav-item").should("not.contain", queryName)
cy.get(".nav-item").should("not.contain", queryRename)
})
}
})

17
packages/builder/cypress/integration/datasources/oracle.spec.js
View File

@ -46,9 +46,10 @@ filterTests(["all"], () => {
cy.get("@datasource")
.its("response.body")
.should("have.property", "status", 500)
cy.get(".spectrum-Button").contains("Skip table fetch").click({ force: true })
})
it("should add Oracle data source and fetch tables", () => {
xit("should add Oracle data source and fetch tables", () => {
// Add & configure Oracle data source
cy.selectExternalDatasource(datasource)
cy.intercept("**/datasources").as("datasource")
@ -64,7 +65,7 @@ filterTests(["all"], () => {
.should("be.gt", 0)
})
it("should define a One relationship type", () => {
xit("should define a One relationship type", () => {
// Select relationship type & configure
cy.get(".spectrum-Button")
.contains("Define relationship")
@ -93,7 +94,7 @@ filterTests(["all"], () => {
cy.get(".spectrum-Table-cell").should("contain", "COUNTRIES to REGIONS")
})
it("should define a Many relationship type", () => {
xit("should define a Many relationship type", () => {
// Select relationship type & configure
cy.get(".spectrum-Button")
.contains("Define relationship")
@ -127,7 +128,7 @@ filterTests(["all"], () => {
)
})
it("should delete relationships", () => {
xit("should delete relationships", () => {
// Delete both relationships
cy.get(".spectrum-Table")
.eq(1)
@ -156,7 +157,7 @@ filterTests(["all"], () => {
})
})
it("should add a query", () => {
xit("should add a query", () => {
// Add query
cy.get(".spectrum-Button").contains("Add query").click({ force: true })
cy.get(".spectrum-Form-item")
@ -181,7 +182,7 @@ filterTests(["all"], () => {
cy.get(".nav-item").should("contain", queryName)
})
it("should duplicate a query", () => {
xit("should duplicate a query", () => {
// Get query nav item
cy.get(".nav-item")
.contains(queryName)
@ -194,7 +195,7 @@ filterTests(["all"], () => {
cy.get(".nav-item").should("contain", queryName + " (1)")
})
it("should edit a query name", () => {
xit("should edit a query name", () => {
// Rename query
cy.get(".spectrum-Form-item")
.eq(0)
@ -206,7 +207,7 @@ filterTests(["all"], () => {
cy.get(".nav-item").should("contain", queryRename)
})
it("should delete a query", () => {
xit("should delete a query", () => {
// Get query nav item - QueryName
cy.get(".nav-item")
.contains(queryName)

49
packages/builder/cypress/integration/datasources/postgreSql.spec.js
View File

@ -21,16 +21,10 @@ filterTests(["all"], () => {
.click({ force: true })
// Intercept Request after button click & apply assertions
cy.wait("@datasource")
cy.get("@datasource")
.its("response.body")
.should(
"have.property",
"message",
"connect ECONNREFUSED 127.0.0.1:5432"
)
cy.get("@datasource")
.its("response.body")
.should("have.property", "status", 500)
cy.get(".spectrum-Button").contains("Skip table fetch").click({ force: true })
})
it("should add PostgreSQL data source and fetch tables", () => {
@ -113,13 +107,13 @@ filterTests(["all"], () => {
})
it("should delete a relationship", () => {
cy.get(".hierarchy-items-container").contains(datasource).click()
cy.get(".hierarchy-items-container").contains("PostgreSQL-2").click()
cy.reload()
// Delete one relationship
cy.get(".spectrum-Table")
.eq(1)
.within(() => {
cy.get(".spectrum-Table-row").eq(0).click()
cy.get(".spectrum-Table-row").eq(0).click({ force: true })
cy.wait(500)
})
cy.get(".spectrum-Dialog-grid").within(() => {
@ -161,7 +155,7 @@ filterTests(["all"], () => {
it("should switch to schema with no tables", () => {
// Switch Schema - To one without any tables
cy.get(".hierarchy-items-container").contains(datasource).click()
cy.get(".hierarchy-items-container").contains("PostgreSQL-2").click()
switchSchema("randomText")
// No tables displayed
@ -208,11 +202,12 @@ filterTests(["all"], () => {
})
it("should duplicate a query", () => {
// Get last nav item - The query
// Locate previously created query
cy.get(".nav-item")
.last()
.contains(queryName)
.siblings(".actions")
.within(() => {
cy.get(".icon").eq(1).click({ force: true })
cy.get(".icon").click({ force: true })
})
// Select and confirm duplication
cy.get(".spectrum-Menu").contains("Duplicate").click()
@ -240,23 +235,21 @@ filterTests(["all"], () => {
})
it("should delete a query", () => {
// Get last nav item - The query
for (let i = 0; i < 2; i++) {
cy.get(".nav-item")
.last()
.within(() => {
cy.get(".icon").eq(1).click({ force: true })
})
// Select Delete
cy.get(".spectrum-Menu").contains("Delete").click()
cy.get(".spectrum-Button")
.contains("Delete Query")
.click({ force: true })
cy.wait(1000)
}
// Get query nav item - QueryName
cy.get(".nav-item")
.contains(queryName)
.parent()
.within(() => {
cy.get(".spectrum-Icon").eq(1).click({ force: true })
})
// Select Delete
cy.get(".spectrum-Menu").contains("Delete").click()
cy.get(".spectrum-Button")
.contains("Delete Query")
.click({ force: true })
cy.wait(1000)
// Confirm deletion
cy.get(".nav-item").should("not.contain", queryName)
cy.get(".nav-item").should("not.contain", queryRename)
})
const switchSchema = schema => {

4
packages/builder/cypress/support/commands.js
View File

@ -415,7 +415,9 @@ Cypress.Commands.add("addDatasourceConfig", (datasource, skipFetch) => {
if (datasource == "Oracle") {
cy.get("input").clear().type(Cypress.env("oracle").HOST)
} else {
cy.get("input").clear().type(Cypress.env("HOST_IP"))
cy.get("input")
.clear({ force: true })
.type(Cypress.env("mysql").HOST, { force: true })
}
})
})

10
packages/builder/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@budibase/builder",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"license": "GPL-3.0",
"private": true,
"scripts": {
@ -65,10 +65,10 @@
}
},
"dependencies": {
"@budibase/bbui": "^1.0.105-alpha.14",
"@budibase/client": "^1.0.105-alpha.14",
"@budibase/frontend-core": "^1.0.105-alpha.14",
"@budibase/string-templates": "^1.0.105-alpha.14",
"@budibase/bbui": "^1.0.105-alpha.23",
"@budibase/client": "^1.0.105-alpha.23",
"@budibase/frontend-core": "^1.0.105-alpha.23",
"@budibase/string-templates": "^1.0.105-alpha.23",
"@sentry/browser": "5.19.1",
"@spectrum-css/page": "^3.0.1",
"@spectrum-css/vars": "^3.0.1",

1
packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte
View File

@ -39,6 +39,7 @@
if (v.internal) {
acc[k] = v
}
delete acc.LOOP
return acc
}, {})

4
packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte
View File

@ -72,7 +72,9 @@
animate:flip={{ duration: 500 }}
in:fly|local={{ x: 500, duration: 1500 }}
>
<FlowItem {testDataModal} {block} />
{#if block.stepId !== "LOOP"}
<FlowItem {testDataModal} {block} />
{/if}
</div>
{/each}
</div>

211
packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItem.svelte
View File

@ -9,8 +9,8 @@
Modal,
Button,
StatusLight,
ActionButton,
Select,
ActionButton,
notifications,
} from "@budibase/bbui"
import AutomationBlockSetup from "../../SetupPanel/AutomationBlockSetup.svelte"
@ -25,8 +25,8 @@
let webhookModal
let actionModal
let resultsModal
let setupToggled
let blockComplete
let showLooping = false
$: rowControl = $automationStore.selectedAutomation.automation.rowControl
$: showBindingPicker =
@ -52,8 +52,21 @@
block.schema?.inputs?.properties || {}
).every(x => block?.inputs[x])
$: loopingSelected =
$automationStore.selectedAutomation?.automation.definition.steps.find(
x => x.blockToLoop === block.id
)
async function deleteStep() {
let loopBlock =
$automationStore.selectedAutomation?.automation.definition.steps.find(
x => x.blockToLoop === block.id
)
try {
if (loopBlock) {
automationStore.actions.deleteAutomationBlock(loopBlock)
}
automationStore.actions.deleteAutomationBlock(block)
await automationStore.actions.save(
$automationStore.selectedAutomation?.automation
@ -76,6 +89,23 @@
)
}
async function addLooping() {
loopingSelected = true
const loopDefinition = $automationStore.blockDefinitions.ACTION.LOOP
const loopBlock = $automationStore.selectedAutomation.constructBlock(
"ACTION",
"LOOP",
loopDefinition
)
loopBlock.blockToLoop = block.id
block.loopBlock = loopBlock.id
automationStore.actions.addBlockToAutomation(loopBlock, blockIdx)
await automationStore.actions.save(
$automationStore.selectedAutomation?.automation
)
}
async function onSelect(block) {
await automationStore.update(state => {
state.selectedBlock = block
@ -84,13 +114,68 @@
}
</script>
<div
class={`block ${block.type} hoverable`}
class:selected
on:click={() => {
onSelect(block)
}}
>
<div class={`block ${block.type} hoverable`} class:selected on:click={() => {}}>
{#if loopingSelected}
<div class="blockSection">
<div
on:click={() => {
showLooping = !showLooping
}}
class="splitHeader"
>
<div class="center-items">
<svg
width="28px"
height="28px"
class="spectrum-Icon"
style="color:grey;"
focusable="false"
>
<use xlink:href="#spectrum-icon-18-Reuse" />
</svg>
<div class="iconAlign">
<Detail size="S">Looping</Detail>
</div>
</div>
<div class="blockTitle">
<div
style="margin-left: 10px;"
on:click={() => {
onSelect(block)
}}
>
<Icon name={showLooping ? "ChevronDown" : "ChevronUp"} />
</div>
</div>
</div>
</div>
<Divider noMargin />
{#if !showLooping}
<div class="blockSection">
<div class="block-options">
<div class="delete-padding" on:click={() => deleteStep()}>
<Icon name="DeleteOutline" />
</div>
</div>
<Layout noPadding gap="S">
<AutomationBlockSetup
schemaProperties={Object.entries(
$automationStore.blockDefinitions.ACTION.LOOP.schema.inputs
.properties
)}
block={$automationStore.selectedAutomation?.automation.definition.steps.find(
x => x.blockToLoop === block.id
)}
{webhookModal}
/>
</Layout>
</div>
<Divider noMargin />
{/if}
{/if}
<div class="blockSection">
<div
on:click={() => {
@ -127,65 +212,66 @@
<Detail size="S">{block?.name?.toUpperCase() || ""}</Detail>
</div>
</div>
{#if testResult && testResult[0]}
<span on:click={() => resultsModal.show()}>
<StatusLight
positive={isTrigger || testResult[0].outputs?.success}
negative={!testResult[0].outputs?.success}
><Body size="XS">View response</Body></StatusLight
>
</span>
{/if}
<div class="blockTitle">
{#if testResult && testResult[0]}
<div style="float: right;" on:click={() => resultsModal.show()}>
<StatusLight
positive={isTrigger || testResult[0].outputs?.success}
negative={!testResult[0].outputs?.success}
><Body size="XS">View response</Body></StatusLight
>
</div>
{/if}
<div
style="margin-left: 10px;"
on:click={() => {
onSelect(block)
}}
>
<Icon name={blockComplete ? "ChevronDown" : "ChevronUp"} />
</div>
</div>
</div>
</div>
{#if !blockComplete}
<Divider noMargin />
<div class="blockSection">
<Layout noPadding gap="S">
<div class="splitHeader">
<ActionButton
on:click={() => {
onSelect(block)
setupToggled = !setupToggled
}}
quiet
icon={setupToggled ? "ChevronDown" : "ChevronRight"}
>
<Detail size="S">Setup</Detail>
</ActionButton>
{#if !isTrigger}
{#if !isTrigger}
<div>
<div class="block-options">
{#if showBindingPicker}
<div>
<Select
on:change={toggleFieldControl}
quiet
defaultValue="Use values"
autoWidth
value={rowControl ? "Use bindings" : "Use values"}
options={["Use values", "Use bindings"]}
placeholder={null}
/>
</div>
{#if !loopingSelected}
<ActionButton on:click={() => addLooping()} icon="Reuse"
>Add Looping</ActionButton
>
{/if}
<div class="delete-padding" on:click={() => deleteStep()}>
<Icon name="DeleteOutline" />
</div>
{#if showBindingPicker}
<Select
on:change={toggleFieldControl}
defaultValue="Use values"
autoWidth
value={rowControl ? "Use bindings" : "Use values"}
options={["Use values", "Use bindings"]}
placeholder={null}
/>
{/if}
<ActionButton
on:click={() => deleteStep()}
icon="DeleteOutline"
/>
</div>
{/if}
</div>
</div>
{/if}
{#if setupToggled}
<AutomationBlockSetup
schemaProperties={Object.entries(block.schema.inputs.properties)}
{block}
{webhookModal}
/>
{#if lastStep}
<Button on:click={() => testDataModal.show()} cta
>Finish and test automation</Button
>
{/if}
<AutomationBlockSetup
schemaProperties={Object.entries(block.schema.inputs.properties)}
{block}
{webhookModal}
/>
{#if lastStep}
<Button on:click={() => testDataModal.show()} cta
>Finish and test automation</Button
>
{/if}
</Layout>
</div>
@ -220,8 +306,10 @@
padding-left: 30px;
}
.block-options {
display: flex;
justify-content: flex-end;
align-items: center;
display: flex;
gap: var(--spacing-m);
}
.center-items {
display: flex;
@ -256,4 +344,9 @@
/* center horizontally */
align-self: center;
}
.blockTitle {
display: flex;
align-items: center;
}
</style>

17
packages/builder/src/components/automation/AutomationBuilder/FlowChart/ResultsModal.svelte
View File

@ -1,5 +1,5 @@
<script>
import { ModalContent, Icon, Detail, TextArea } from "@budibase/bbui"
import { ModalContent, Icon, Detail, TextArea, Label } from "@budibase/bbui"
export let testResult
export let isTrigger
@ -10,7 +10,7 @@
<ModalContent
showCloseIcon={false}
showConfirmButton={false}
title="Test Automation"
title="Test Results"
cancelText="Close"
>
<div slot="header">
@ -26,7 +26,18 @@
{/if}
</div>
</div>
<span>
{#if testResult[0].outputs.iterations}
<div style="display: flex;">
<Icon name="Reuse" />
<div style="margin-left: 10px;">
<Label>
This loop ran {testResult[0].outputs.iterations} times.</Label
>
</div>
</div>
{/if}
</span>
<div
on:click={() => {
inputToggled = !inputToggled

56
packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte
View File

@ -88,33 +88,65 @@
if (!block || !automation) {
return []
}
// Find previous steps to the selected one
let allSteps = [...automation.steps]
if (automation.trigger) {
allSteps = [automation.trigger, ...allSteps]
}
const blockIdx = allSteps.findIndex(step => step.id === block.id)
let blockIdx = allSteps.findIndex(step => step.id === block.id)
// Extract all outputs from all previous steps as available bindings
// Extract all outputs from all previous steps as available bindins
let bindings = []
for (let idx = 0; idx < blockIdx; idx++) {
const outputs = Object.entries(
allSteps[idx].schema?.outputs?.properties ?? {}
)
let wasLoopBlock = allSteps[idx]?.stepId === "LOOP"
let isLoopBlock =
allSteps[idx]?.stepId === "LOOP" &&
allSteps.find(x => x.blockToLoop === block.id)
// If the previous block was a loop block, decerement the index so the following
// steps are in the correct order
if (wasLoopBlock) {
blockIdx--
}
let schema = allSteps[idx]?.schema?.outputs?.properties ?? {}
// If its a Loop Block, we need to add this custom schema
if (isLoopBlock) {
schema = {
currentItem: {
type: "string",
description: "the item currently being executed",
},
}
}
const outputs = Object.entries(schema)
bindings = bindings.concat(
outputs.map(([name, value]) => {
const runtime = idx === 0 ? `trigger.${name}` : `steps.${idx}.${name}`
let runtimeName = isLoopBlock
? `loop.${name}`
: block.name.startsWith("JS")
? `steps[${idx}].${name}`
: `steps.${idx}.${name}`
const runtime = idx === 0 ? `trigger.${name}` : runtimeName
return {
label: runtime,
type: value.type,
description: value.description,
category: idx === 0 ? "Trigger outputs" : `Step ${idx} outputs`,
category:
idx === 0
? "Trigger outputs"
: isLoopBlock
? "Loop Outputs"
: `Step ${idx} outputs`,
path: runtime,
}
})
)
}
return bindings
}
@ -261,6 +293,14 @@
value={inputData[key]}
/>
</CodeEditorModal>
{:else if value.customType === "loopOption"}
<Select
on:change={e => onChange(e, key)}
autoWidth
value={inputData[key]}
options={["Array", "String"]}
defaultValue={"Array"}
/>
{:else if value.type === "string" || value.type === "number" || value.type === "integer"}
{#if isTestModal}
<ModalBindableInput

8
packages/builder/src/components/design/PropertiesPanel/PropertyControls/ButtonActionEditor/actions/DeleteRow.svelte
View File

@ -26,14 +26,6 @@
on:change={value => (parameters.rowId = value.detail)}
/>
<Label small>Row Rev</Label>
<DrawerBindableInput
{bindings}
title="Row rev to delete"
value={parameters.revId}
on:change={value => (parameters.revId = value.detail)}
/>
<Label small />
<Checkbox text="Require confirmation" bind:value={parameters.confirm} />

2
packages/cli/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@budibase/cli",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Budibase CLI, for developers, self hosting and migrations.",
"main": "src/index.js",
"bin": {

8
packages/client/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@budibase/client",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"license": "MPL-2.0",
"module": "dist/budibase-client.js",
"main": "dist/budibase-client.js",
@ -19,9 +19,9 @@
"dev:builder": "rollup -cw"
},
"dependencies": {
"@budibase/bbui": "^1.0.105-alpha.14",
"@budibase/frontend-core": "^1.0.105-alpha.14",
"@budibase/string-templates": "^1.0.105-alpha.14",
"@budibase/bbui": "^1.0.105-alpha.23",
"@budibase/frontend-core": "^1.0.105-alpha.23",
"@budibase/string-templates": "^1.0.105-alpha.23",
"@spectrum-css/button": "^3.0.3",
"@spectrum-css/card": "^3.0.3",
"@spectrum-css/divider": "^1.0.3",

8
packages/client/src/api/api.js
View File

@ -1,5 +1,5 @@
import { createAPIClient } from "@budibase/frontend-core"
import { notificationStore, authStore } from "../stores"
import { notificationStore, authStore, devToolsStore } from "../stores"
import { get } from "svelte/store"
export const API = createAPIClient({
@ -21,6 +21,12 @@ export const API = createAPIClient({
if (auth?.csrfToken) {
headers["x-csrf-token"] = auth.csrfToken
}
// Add role header
const role = get(devToolsStore).role
if (role) {
headers["x-budibase-role"] = role
}
},
// Show an error notification for all API failures.

106
packages/client/src/components/ClientApp.svelte
View File

@ -14,6 +14,8 @@
routeStore,
builderStore,
themeStore,
appStore,
devToolsStore,
} from "stores"
import NotificationDisplay from "components/overlay/NotificationDisplay.svelte"
import ConfirmationDisplay from "components/overlay/ConfirmationDisplay.svelte"
@ -28,6 +30,8 @@
import CustomThemeWrapper from "./CustomThemeWrapper.svelte"
import DNDHandler from "components/preview/DNDHandler.svelte"
import KeyboardManager from "components/preview/KeyboardManager.svelte"
import DevToolsHeader from "components/devtools/DevToolsHeader.svelte"
import DevTools from "components/devtools/DevTools.svelte"
// Provide contexts
setContext("sdk", SDK)
@ -55,8 +59,22 @@
if ($authStore) {
// There is a logged in user, so handle them
if ($screenStore.screens.length) {
let firstRoute
// If using devtools, find the first screen matching our role
if ($devToolsStore.role) {
const roleRoutes = $screenStore.screens.filter(
screen => screen.routing?.roleId === $devToolsStore.role
)
firstRoute = roleRoutes[0]?.routing?.route || "/"
}
// Otherwise just use the first route
else {
firstRoute = $screenStore.screens[0]?.routing?.route ?? "/"
}
// Screens exist so navigate back to the home screen
const firstRoute = $screenStore.screens[0].routing?.route ?? "/"
routeStore.actions.navigate(firstRoute)
} else {
// No screens likely means the user has no permissions to view this app
@ -70,6 +88,8 @@
}
}
}
$: isDevPreview = $appStore.isDevApp && !$builderStore.inBuilder
</script>
{#if dataLoaded}
@ -109,39 +129,49 @@
>
<!-- Actual app -->
<div id="app-root">
<CustomThemeWrapper>
{#key `${$screenStore.activeLayout._id}-${$builderStore.previewType}`}
<Component
isLayout
instance={$screenStore.activeLayout.props}
/>
{/key}
{#if isDevPreview}
<DevToolsHeader />
{/if}
<!--
Flatpickr needs to be inside the theme wrapper.
It also needs its own container because otherwise it hijacks
key events on the whole page. It is painful to work with.
-->
<div id="flatpickr-root" />
<div id="app-body">
<CustomThemeWrapper>
{#key `${$screenStore.activeLayout._id}-${$builderStore.previewType}`}
<Component
isLayout
instance={$screenStore.activeLayout.props}
/>
{/key}
<!-- Modal container to ensure they sit on top -->
<div class="modal-container" />
<!--
Flatpickr needs to be inside the theme wrapper.
It also needs its own container because otherwise it hijacks
key events on the whole page. It is painful to work with.
-->
<div id="flatpickr-root" />
<!-- Layers on top of app -->
<NotificationDisplay />
<ConfirmationDisplay />
<PeekScreenDisplay />
</CustomThemeWrapper>
<!-- Modal container to ensure they sit on top -->
<div class="modal-container" />
<!-- Layers on top of app -->
<NotificationDisplay />
<ConfirmationDisplay />
<PeekScreenDisplay />
</CustomThemeWrapper>
{#if $appStore.isDevApp && !$builderStore.inBuilder}
<DevTools />
{/if}
</div>
</div>
<!-- Selection indicators should be bounded by device -->
<!--
We don't want to key these by componentID as they control their own
re-mounting to avoid flashes.
-->
{#if $builderStore.inBuilder}
<!-- Preview and dev tools utilities -->
{#if $appStore.isDevApp}
<SelectionIndicator />
{/if}
{#if $builderStore.inBuilder || $devToolsStore.allowSelection}
<HoverIndicator />
{/if}
{#if $builderStore.inBuilder}
<DNDHandler />
{/if}
</div>
@ -167,6 +197,7 @@
justify-content: center;
align-items: center;
}
#clip-root {
max-width: 100%;
max-height: 100%;
@ -176,10 +207,24 @@
overflow: hidden;
background-color: transparent;
}
#app-root {
overflow: hidden;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
}
#app-body {
flex: 1 1 auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: stretch;
overflow: hidden;
}
.error {
@ -192,19 +237,23 @@
text-align: center;
padding: 20px;
}
.error :global(svg) {
fill: var(--spectrum-global-color-gray-500);
width: 80px;
height: 80px;
}
.error :global(h1),
.error :global(p) {
color: var(--spectrum-global-color-gray-800);
}
.error :global(p) {
font-style: italic;
margin-top: -0.5em;
}
.error :global(h1) {
font-weight: 400;
}
@ -214,14 +263,17 @@
#clip-root.preview {
padding: 2px;
}
#clip-root.tablet-preview {
width: calc(1024px + 6px);
height: calc(768px + 6px);
}
#clip-root.mobile-preview {
width: calc(390px + 6px);
height: calc(844px + 6px);
}
.preview #app-root {
border: 1px solid var(--spectrum-global-color-gray-300);
border-radius: 4px;

63
packages/client/src/components/Component.svelte
View File

@ -9,12 +9,16 @@
</script>
<script>
import { getContext, setContext } from "svelte"
import { getContext, setContext, onMount, onDestroy } from "svelte"
import { writable, get } from "svelte/store"
import * as AppComponents from "components/app"
import Router from "./Router.svelte"
import { enrichProps, propsAreSame } from "utils/componentProps"
import { builderStore } from "stores"
import {
enrichProps,
propsAreSame,
getSettingsDefinition,
} from "utils/componentProps"
import { builderStore, devToolsStore, componentStore, appStore } from "stores"
import { Helpers } from "@budibase/bbui"
import Manifest from "manifest.json"
import { getActiveConditions, reduceConditionActions } from "utils/conditions"
@ -30,8 +34,8 @@
const insideScreenslot = !!getContext("screenslot")
// Create component context
const componentStore = writable({})
setContext("component", componentStore)
const store = writable({})
setContext("component", store)
// Ref to the svelte component
let ref
@ -90,7 +94,7 @@
// leading to the selected component
$: selected =
$builderStore.inBuilder && $builderStore.selectedComponentId === id
$: inSelectedPath = $builderStore.selectedComponentPath?.includes(id)
$: inSelectedPath = $componentStore.selectedComponentPath?.includes(id)
$: inDragPath = inSelectedPath && $builderStore.editMode
// Derive definition properties which can all be optional, so need to be
@ -101,10 +105,12 @@
// Interactive components can be selected, dragged and highlighted inside
// the builder preview
$: interactive =
$: builderInteractive =
$builderStore.inBuilder &&
($builderStore.previewType === "layout" || insideScreenslot) &&
!isBlock
$: devToolsInteractive = $devToolsStore.allowSelection && !isBlock
$: interactive = builderInteractive || devToolsInteractive
$: editing = editable && selected && $builderStore.editMode
$: draggable =
!inDragPath &&
@ -133,7 +139,7 @@
$: applySettings(staticSettings, enrichedSettings, conditionalSettings)
// Update component context
$: componentStore.set({
$: store.set({
id,
children: children.length,
styles: {
@ -217,22 +223,6 @@
return type ? Manifest[type] : null
}
// Gets the definition of this component's settings from the manifest
const getSettingsDefinition = definition => {
if (!definition) {
return []
}
let settings = []
definition.settings?.forEach(setting => {
if (setting.section) {
settings = settings.concat(setting.settings || [])
} else {
settings.push(setting)
}
})
return settings
}
const getSettingsDefinitionMap = settingsDefinition => {
let map = {}
settingsDefinition?.forEach(setting => {
@ -385,6 +375,28 @@
})
}
}
onMount(() => {
if (
$appStore.isDevApp &&
!componentStore.actions.isComponentRegistered(id)
) {
componentStore.actions.registerInstance(id, {
getSettings: () => cachedSettings,
getRawSettings: () => ({ ...staticSettings, ...dynamicSettings }),
getDataContext: () => get(context),
})
}
})
onDestroy(() => {
if (
$appStore.isDevApp &&
componentStore.actions.isComponentRegistered(id)
) {
componentStore.actions.unregisterInstance(id)
}
})
</script>
{#if constructor && initialSettings && (visible || inSelectedPath)}
@ -419,12 +431,15 @@
.component {
display: contents;
}
.interactive :global(*:hover) {
cursor: pointer;
}
.draggable :global(*:hover) {
cursor: grab;
}
.editing :global(*:hover) {
cursor: auto;
}

1
packages/client/src/components/app/Layout.svelte
View File

@ -179,6 +179,7 @@
justify-content: flex-start;
align-items: stretch;
height: 100%;
flex: 1 1 auto;
overflow: auto;
overflow-x: hidden;
position: relative;

4
packages/client/src/components/app/forms/FormStep.svelte
View File

@ -5,7 +5,7 @@
export let step = 1
const { styleable, builderStore } = getContext("sdk")
const { styleable, builderStore, componentStore } = getContext("sdk")
const component = getContext("component")
const formContext = getContext("form")
@ -22,7 +22,7 @@
if (
formContext &&
$builderStore.inBuilder &&
$builderStore.selectedComponentPath?.includes($component.id)
$componentStore.selectedComponentPath?.includes($component.id)
) {
formContext.formApi.setStep(step)
}

8
packages/client/src/components/context/UserBindingsProvider.svelte
View File

@ -1,6 +1,6 @@
<script>
import Provider from "./Provider.svelte"
import { authStore } from "stores"
import { authStore, devToolsStore } from "stores"
import { ActionTypes } from "constants"
import { Constants } from "@budibase/frontend-core"
@ -17,6 +17,10 @@
]
</script>
<Provider key="user" data={$authStore} {actions}>
<Provider
key="user"
data={{ ...$authStore, roleId: $devToolsStore.role || $authStore?.roleId }}
{actions}
>
<slot />
</Provider>

69
packages/client/src/components/devtools/DevTools.svelte Normal file
View File

@ -0,0 +1,69 @@
<script>
import { getContext } from "svelte"
import { Layout, Heading, Tabs, Tab, Icon } from "@budibase/bbui"
import DevToolsStatsTab from "./DevToolsStatsTab.svelte"
import DevToolsComponentTab from "./DevToolsComponentTab.svelte"
import { devToolsStore } from "stores"
const context = getContext("context")
</script>
<div
class="devtools"
class:hidden={!$devToolsStore.visible}
class:mobile={$context.device.mobile}
>
{#if $devToolsStore.visible}
<Layout noPadding gap="XS">
<div class="header">
<Heading size="XS">Budibase DevTools</Heading>
<Icon
hoverable
name="Close"
on:click={() => devToolsStore.actions.setVisible(false)}
/>
</div>
<Tabs selected="Application">
<Tab title="Application">
<div class="tab-content">
<DevToolsStatsTab />
</div>
</Tab>
<Tab title="Components">
<div class="tab-content">
<DevToolsComponentTab />
</div>
</Tab>
</Tabs>
</Layout>
{/if}
</div>
<style>
.devtools {
background: var(--spectrum-alias-background-color-primary);
flex: 0 0 320px;
border-left: 1px solid var(--spectrum-global-color-gray-300);
overflow: auto;
transition: margin-right 300ms ease;
margin-right: 0;
}
.devtools.hidden {
margin-right: -320px;
}
.devtools.mobile {
display: none;
}
.header {
padding: var(--spacing-xl) var(--spacing-xl) 0 var(--spacing-xl);
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.tab-content {
padding: 0 var(--spacing-xl);
}
</style>

113
packages/client/src/components/devtools/DevToolsComponentContextTab.svelte Normal file
View File

@ -0,0 +1,113 @@
<script>
import { Layout, Select, Body } from "@budibase/bbui"
import { componentStore } from "stores/index.js"
import DevToolsStat from "./DevToolsStat.svelte"
const ReadableBindingMap = {
user: "Current user",
state: "State",
url: "URL",
device: "Device",
rowSelection: "Selected rows",
}
let category
$: selectedInstance = $componentStore.selectedComponentInstance
$: context = selectedInstance?.getDataContext()
$: bindingCategories = getContextProviders(context)
$: bindings = Object.entries(context?.[category] || {})
const getContextProviders = context => {
const filteredContext = { ...context }
// Remove some keys from context
delete filteredContext.key
delete filteredContext.closestComponentId
delete filteredContext.user_RefreshDataSource
// Keep track of encountered IDs so we can find actions
let actions = []
let encounteredCategories = []
// Create readable bindings
let categories = []
Object.keys(filteredContext)
.sort()
.forEach(category => {
let isAction = false
for (let cat of encounteredCategories) {
if (category.startsWith(`${cat}_`)) {
isAction = true
break
}
}
if (isAction) {
actions.push(category)
return
}
// Mark category as encountered so we can find any matching actions
encounteredCategories.push(category)
// Map any static categories to pretty names
if (ReadableBindingMap[category]) {
categories.push({
label: ReadableBindingMap[category],
value: category,
})
} else {
const component = componentStore.actions.getComponentById(category)
if (component) {
categories.push({
label: component._instanceName,
value: category,
})
} else {
// Check if its a block
if (category.includes("-")) {
const split = category.split("-")
const potentialId = split[0]
const component =
componentStore.actions.getComponentById(potentialId)
if (component) {
categories.push({
label: `${component._instanceName} (${split[1]})`,
value: category,
})
return
}
}
// Otherwise we don't know
categories.push({
label: "Unknown - " + category,
value: category,
})
}
}
})
return categories
}
</script>
<Layout noPadding gap="S">
<Body size="S">
Choose a category to see the value of all its available bindings.
</Body>
<Select bind:value={category} label="Category" options={bindingCategories} />
{#if bindings?.length}
<Layout noPadding gap="XS">
{#each bindings as binding}
<DevToolsStat
copyable
label={binding[0]}
value={JSON.stringify(binding[1])}
/>
{/each}
</Layout>
{:else if category}
<Body size="XS">There aren't any bindings available in this category.</Body>
{/if}
</Layout>

13
packages/client/src/components/devtools/DevToolsComponentSetting.svelte Normal file
View File

@ -0,0 +1,13 @@
<script>
import DevToolsStat from "./DevToolsStat.svelte"
export let name
export let value
export let settingsMap
$: prettyName = settingsMap?.[name]?.label
</script>
{#if prettyName}
<DevToolsStat label={prettyName} value={JSON.stringify(value)} />
{/if}

30
packages/client/src/components/devtools/DevToolsComponentSettingsTab.svelte Normal file
View File

@ -0,0 +1,30 @@
<script>
import { Layout, Toggle } from "@budibase/bbui"
import DevToolsStat from "./DevToolsStat.svelte"
import { componentStore } from "stores/index.js"
import { getSettingsDefinition } from "utils/componentProps.js"
let showEnrichedSettings = true
$: selectedInstance = $componentStore.selectedComponentInstance
$: settingsDefinition = getSettingsDefinition(
$componentStore.selectedComponentDefinition
)
$: rawSettings = selectedInstance?.getRawSettings()
$: settings = selectedInstance?.getSettings()
</script>
<Layout noPadding gap="S">
<Toggle text="Show enriched settings" bind:value={showEnrichedSettings} />
<Layout noPadding gap="XS">
{#each settingsDefinition as setting}
<DevToolsStat
copyable
label={setting.label}
value={JSON.stringify(
(showEnrichedSettings ? settings : rawSettings)?.[setting.key]
)}
/>
{/each}
</Layout>
</Layout>

102
packages/client/src/components/devtools/DevToolsComponentTab.svelte Normal file
View File

@ -0,0 +1,102 @@
<script>
import { Body, Layout, Heading, Button, Tabs, Tab } from "@budibase/bbui"
import { builderStore, devToolsStore, componentStore } from "stores"
import DevToolsStat from "./DevToolsStat.svelte"
import DevToolsComponentSettingsTab from "./DevToolsComponentSettingsTab.svelte"
import DevToolsComponentContextTab from "./DevToolsComponentContextTab.svelte"
$: {
// Reset selection store if we can't find a matching instance
if (!$componentStore.selectedComponentInstance) {
builderStore.actions.selectComponent(null)
}
}
</script>
{#if !$builderStore.selectedComponentId}
<Layout noPadding gap="S">
<Heading size="XS">Please choose a component</Heading>
<Body size="S">
Press the button below to enable component selection, then click a
component in your app to view its settings and available data bindings.
</Body>
<div>
<Button
cta
on:click={() => devToolsStore.actions.setAllowSelection(true)}
>
Choose component
</Button>
</div>
</Layout>
{:else}
<Layout noPadding gap="S">
<Heading size="XS">
{$componentStore.selectedComponent?._instanceName}
</Heading>
<Layout noPadding gap="XS">
<DevToolsStat
label="Type"
value={$componentStore.selectedComponentDefinition?.name}
/>
<DevToolsStat
copyable
label="Component ID"
value={$componentStore.selectedComponent?._id}
/>
</Layout>
<div class="buttons">
<Button
cta
on:click={() => devToolsStore.actions.setAllowSelection(true)}
>
Change component
</Button>
<Button
quiet
secondary
on:click={() => builderStore.actions.selectComponent(null)}
>
Reset
</Button>
</div>
<div class="data">
<Layout noPadding gap="XS">
<Tabs selected="Settings">
<Tab title="Settings">
<div class="tab-content">
<DevToolsComponentSettingsTab />
</div>
</Tab>
<Tab title="Bindings">
<div class="tab-content">
<DevToolsComponentContextTab />
</div>
</Tab>
</Tabs>
</Layout>
</div>
</Layout>
{/if}
<style>
.buttons {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
gap: var(--spacing-xs);
}
.data {
margin: 0 calc(-1 * var(--spacing-xl));
}
.data :global(.spectrum-Textfield-input) {
min-height: 200px !important;
white-space: pre;
font-size: var(--font-size-s);
}
.tab-content {
padding: 0 var(--spacing-xl);
}
</style>

74
packages/client/src/components/devtools/DevToolsHeader.svelte Normal file
View File

@ -0,0 +1,74 @@
<script>
import { Heading, Button, Select } from "@budibase/bbui"
import { devToolsStore } from "../../stores"
import { getContext } from "svelte"
const context = getContext("context")
$: previewOptions = [
{
label: "View as yourself",
value: "self",
},
{
label: "View as public user",
value: "PUBLIC",
},
{
label: "View as basic user",
value: "BASIC",
},
{
label: "View as power user",
value: "POWER",
},
{
label: "View as admin user",
value: "ADMIN",
},
]
</script>
<div class="dev-preview-header" class:mobile={$context.device.mobile}>
<Heading size="XS">Budibase App Preview</Heading>
<Select
quiet
options={previewOptions}
value={$devToolsStore.role || "self"}
placeholder={null}
autoWidth
on:change={e => devToolsStore.actions.changeRole(e.detail)}
/>
{#if !$context.device.mobile}
<Button
quiet
overBackground
icon="Code"
on:click={() => devToolsStore.actions.setVisible(!$devToolsStore.visible)}
>
{$devToolsStore.visible ? "Close" : "Open"} DevTools
</Button>
{/if}
</div>
<style>
.dev-preview-header {
flex: 0 0 50px;
height: 50px;
display: grid;
align-items: center;
background-color: var(--spectrum-global-color-blue-400);
padding: 0 var(--spacing-xl);
grid-template-columns: 1fr auto auto;
grid-gap: var(--spacing-xl);
}
.dev-preview-header.mobile {
flex: 0 0 50px;
grid-template-columns: 1fr auto;
}
.dev-preview-header :global(.spectrum-Heading),
.dev-preview-header :global(.spectrum-Picker-menuIcon),
.dev-preview-header :global(.spectrum-Picker-label) {
color: white !important;
}
</style>

75
packages/client/src/components/devtools/DevToolsStat.svelte Normal file
View File

@ -0,0 +1,75 @@
<script>
import { Helpers } from "@budibase/bbui"
import { notificationStore } from "stores"
export let label
export let value
export let copyable = false
$: prettyLabel = label == null ? "-" : label
$: prettyValue = value == null ? "-" : value
$: empty = value == null
$: canCopy = copyable && !empty
const copyValue = async () => {
try {
await Helpers.copyToClipboard(value)
notificationStore.actions.success("Copied to clipboard")
} catch (error) {
notificationStore.actions.error(
"Failed to copy to clipboard. Check the dev console for the value."
)
console.warn("Failed to copy the value", value)
}
}
</script>
<div class="stat">
<div class="stat-label" title={prettyLabel}>{prettyLabel}</div>
<div
class="stat-value"
class:copyable={canCopy}
class:empty
title={prettyValue}
on:click={canCopy ? copyValue : null}
>
{prettyValue}
</div>
</div>
<style>
.stat {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: var(--spacing-xl);
}
.stat-label {
font-size: var(--font-size-xs);
color: var(--spectrum-global-color-gray-600);
text-transform: uppercase;
flex: 0 0 auto;
width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.stat-value {
flex: 1 1 auto;
width: 0;
text-align: right;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
transition: color var(--spectrum-global-animation-duration-100, 130ms)
ease-in-out;
}
.stat-value.empty {
color: var(--spectrum-global-color-gray-500);
}
.stat-value.copyable:hover {
color: var(--spectrum-global-color-blue-600);
cursor: pointer;
}
</style>

27
packages/client/src/components/devtools/DevToolsStatsTab.svelte Normal file
View File

@ -0,0 +1,27 @@
<script>
import { Layout } from "@budibase/bbui"
import { authStore, appStore, screenStore, componentStore } from "stores"
import DevToolsStat from "./DevToolsStat.svelte"
</script>
<Layout noPadding gap="XS">
<DevToolsStat label="App" value={$appStore.application?.name} />
<DevToolsStat label="Tenant" value={$appStore.application?.tenantId} />
<DevToolsStat label="Version" value={$appStore.application?.version} />
{#if $appStore.clientLoadTime}
<DevToolsStat
label="Client load time"
value={`${$appStore.clientLoadTime} ms`}
/>
{/if}
<DevToolsStat label="App layouts" value={$screenStore.layouts?.length || 0} />
<DevToolsStat label="Active layout" value={$screenStore.activeLayout?.name} />
<DevToolsStat label="App screens" value={$screenStore.screens?.length || 0} />
<DevToolsStat
label="Active screen"
value={$screenStore.activeScreen?.routing.route}
/>
<DevToolsStat label="Components" value={$componentStore.mountedComponents} />
<DevToolsStat label="User" value={$authStore.email} />
<DevToolsStat label="Role" value={$authStore.roleId} />
</Layout>

6
packages/client/src/components/preview/IndicatorSet.svelte
View File

@ -2,6 +2,7 @@
import { onMount, onDestroy } from "svelte"
import Indicator from "./Indicator.svelte"
import { domDebounce } from "utils/domDebounce"
import { builderStore } from "stores"
export let componentId
export let color
@ -13,6 +14,7 @@
let interval
let text
$: visibleIndicators = indicators.filter(x => x.visible)
$: offset = $builderStore.inBuilder ? 0 : 2
let updating = false
let observers = []
@ -88,8 +90,8 @@
const elBounds = child.getBoundingClientRect()
nextIndicators.push({
top: elBounds.top + scrollY - deviceBounds.top,
left: elBounds.left + scrollX - deviceBounds.left,
top: elBounds.top + scrollY - deviceBounds.top - offset,
left: elBounds.left + scrollX - deviceBounds.left - offset,
width: elBounds.width + 4,
height: elBounds.height + 4,
visible: false,

10
packages/client/src/components/preview/SettingsBar.svelte
View File

@ -3,7 +3,7 @@
import SettingsButton from "./SettingsButton.svelte"
import SettingsColorPicker from "./SettingsColorPicker.svelte"
import SettingsPicker from "./SettingsPicker.svelte"
import { builderStore } from "stores"
import { builderStore, componentStore } from "stores"
import { domDebounce } from "utils/domDebounce"
const verticalOffset = 28
@ -15,7 +15,7 @@
let self
let measured = false
$: definition = $builderStore.selectedComponentDefinition
$: definition = $componentStore.selectedComponentDefinition
$: showBar = definition?.showSettingsBar && !$builderStore.isDragging
$: settings = getBarSettings(definition)
@ -67,7 +67,7 @@
}
//If element is at the very top of the screen, put the bar below the element
if (elBounds.top < elBounds.height) {
if (elBounds.top < elBounds.height && elBounds.height < 80) {
newTop = elBounds.bottom + verticalOffset
}
@ -163,9 +163,7 @@
<SettingsButton
icon="Delete"
on:click={() => {
builderStore.actions.deleteComponent(
$builderStore.selectedComponent._id
)
builderStore.actions.deleteComponent($builderStore.selectedComponentId)
}}
title="Delete component"
/>

4
packages/client/src/components/preview/SettingsButton.svelte
View File

@ -1,6 +1,6 @@
<script>
import { Icon } from "@budibase/bbui"
import { builderStore } from "stores"
import { builderStore, componentStore } from "stores"
import { createEventDispatcher } from "svelte"
export let prop
@ -11,7 +11,7 @@
export let bool = false
const dispatch = createEventDispatcher()
$: currentValue = $builderStore.selectedComponent?.[prop]
$: currentValue = $componentStore.selectedComponent?.[prop]
$: active = prop && (bool ? !!currentValue : currentValue === value)
</script>

4
packages/client/src/components/preview/SettingsColorPicker.svelte
View File

@ -1,10 +1,10 @@
<script>
import { ColorPicker } from "@budibase/bbui"
import { builderStore } from "stores"
import { builderStore, componentStore } from "stores"
export let prop
$: currentValue = $builderStore.selectedComponent?.[prop]
$: currentValue = $componentStore.selectedComponent?.[prop]
</script>
<div>

4
packages/client/src/components/preview/SettingsPicker.svelte
View File

@ -1,12 +1,12 @@
<script>
import { Select } from "@budibase/bbui"
import { builderStore } from "stores"
import { builderStore, componentStore } from "stores"
export let prop
export let options
export let label
$: currentValue = $builderStore.selectedComponent?.[prop]
$: currentValue = $componentStore.selectedComponent?.[prop]
</script>
<div>

12
packages/client/src/stores/app.js
View File

@ -1,8 +1,14 @@
import { API } from "api"
import { get, writable } from "svelte/store"
const initialState = {
appId: null,
isDevApp: false,
clientLoadTime: window.INIT_TIME ? Date.now() - window.INIT_TIME : null,
}
const createAppStore = () => {
const store = writable(null)
const store = writable(initialState)
// Fetches the app definition including screens, layouts and theme
const fetchAppDefinition = async () => {
@ -13,11 +19,13 @@ const createAppStore = () => {
try {
const appDefinition = await API.fetchAppPackage(appId)
store.set({
...initialState,
...appDefinition,
appId: appDefinition?.application?.appId,
isDevApp: appId.startsWith("app_dev"),
})
} catch (error) {
store.set(null)
store.set(initialState)
}
}

56
packages/client/src/stores/builder.js
View File

@ -1,7 +1,6 @@
import { writable, derived, get } from "svelte/store"
import Manifest from "manifest.json"
import { findComponentById, findComponentPathById } from "../utils/components"
import { writable, get } from "svelte/store"
import { API } from "api"
import { devToolsStore } from "./devTools.js"
const dispatchEvent = (type, data = {}) => {
window.parent.postMessage({ type, data })
@ -22,38 +21,18 @@ const createBuilderStore = () => {
previewDevice: "desktop",
isDragging: false,
}
const writableStore = writable(initialState)
const derivedStore = derived(writableStore, $state => {
// Avoid any of this logic if we aren't in the builder preview
if (!$state.inBuilder) {
return $state
}
// Derive the selected component instance and definition
const { layout, screen, previewType, selectedComponentId } = $state
const asset = previewType === "layout" ? layout : screen
const component = findComponentById(asset?.props, selectedComponentId)
const prefix = "@budibase/standard-components/"
const type = component?._component?.replace(prefix, "")
const definition = type ? Manifest[type] : null
// Derive the selected component path
const path = findComponentPathById(asset.props, selectedComponentId) || []
return {
...$state,
selectedComponent: component,
selectedComponentDefinition: definition,
selectedComponentPath: path?.map(component => component._id),
}
})
const store = writable(initialState)
const actions = {
selectComponent: id => {
if (id === get(writableStore).selectedComponentId) {
if (id === get(store).selectedComponentId) {
return
}
writableStore.update(state => ({ ...state, editMode: false }))
store.update(state => ({
...state,
editMode: false,
selectedComponentId: id,
}))
devToolsStore.actions.setAllowSelection(false)
dispatchEvent("select-component", { id })
},
updateProp: (prop, value) => {
@ -76,7 +55,7 @@ const createBuilderStore = () => {
}
},
setSelectedPath: path => {
writableStore.update(state => ({ ...state, selectedPath: path }))
store.update(state => ({ ...state, selectedPath: path }))
},
moveComponent: (componentId, destinationComponentId, mode) => {
dispatchEvent("move-component", {
@ -86,22 +65,21 @@ const createBuilderStore = () => {
})
},
setDragging: dragging => {
if (dragging === get(writableStore).isDragging) {
if (dragging === get(store).isDragging) {
return
}
writableStore.update(state => ({ ...state, isDragging: dragging }))
store.update(state => ({ ...state, isDragging: dragging }))
},
setEditMode: enabled => {
if (enabled === get(writableStore).editMode) {
if (enabled === get(store).editMode) {
return
}
writableStore.update(state => ({ ...state, editMode: enabled }))
store.update(state => ({ ...state, editMode: enabled }))
},
}
return {
...writableStore,
set: state => writableStore.set({ ...initialState, ...state }),
subscribe: derivedStore.subscribe,
...store,
set: state => store.set({ ...initialState, ...state }),
actions,
}
}

81
packages/client/src/stores/components.js Normal file
View File

@ -0,0 +1,81 @@
import { get, writable, derived } from "svelte/store"
import Manifest from "manifest.json"
import { findComponentById, findComponentPathById } from "../utils/components"
import { devToolsStore } from "./devTools"
import { screenStore } from "./screens"
import { builderStore } from "./builder"
const createComponentStore = () => {
const store = writable({})
const derivedStore = derived(
[store, builderStore, devToolsStore, screenStore],
([$store, $builderState, $devToolsState, $screenState]) => {
// Avoid any of this logic if we aren't in the builder preview
if (!$builderState.inBuilder && !$devToolsState.visible) {
return {}
}
// Derive the selected component instance and definition
let asset
const { layout, screen, previewType, selectedComponentId } = $builderState
if ($builderState.inBuilder) {
asset = previewType === "layout" ? layout : screen
} else {
asset = $screenState.activeScreen
}
const component = findComponentById(asset?.props, selectedComponentId)
const prefix = "@budibase/standard-components/"
const type = component?._component?.replace(prefix, "")
const definition = type ? Manifest[type] : null
// Derive the selected component path
const path =
findComponentPathById(asset?.props, selectedComponentId) || []
return {
selectedComponentInstance: $store[selectedComponentId],
selectedComponent: component,
selectedComponentDefinition: definition,
selectedComponentPath: path?.map(component => component._id),
mountedComponents: Object.keys($store).length,
currentAsset: asset,
}
}
)
const registerInstance = (id, instance) => {
store.update(state => ({
...state,
[id]: instance,
}))
}
const unregisterInstance = id => {
store.update(state => {
delete state[id]
return state
})
}
const isComponentRegistered = id => {
return get(store)[id] != null
}
const getComponentById = id => {
const asset = get(derivedStore).currentAsset
return findComponentById(asset?.props, id)
}
return {
...derivedStore,
actions: {
registerInstance,
unregisterInstance,
isComponentRegistered,
getComponentById,
},
}
}
export const componentStore = createComponentStore()

47
packages/client/src/stores/devTools.js Normal file
View File

@ -0,0 +1,47 @@
import { get } from "svelte/store"
import { createLocalStorageStore } from "@budibase/frontend-core"
import { appStore } from "./app"
import { initialise } from "./initialise"
import { authStore } from "./auth"
const initialState = {
visible: false,
allowSelection: false,
role: null,
}
const createDevToolStore = () => {
const localStorageKey = `${get(appStore).appId}.devTools`
const store = createLocalStorageStore(localStorageKey, initialState)
const setVisible = visible => {
store.update(state => ({
...state,
visible: visible,
}))
}
const setAllowSelection = allowSelection => {
store.update(state => ({
...state,
allowSelection,
}))
}
const changeRole = async role => {
store.update(state => ({
...state,
role: role === "self" ? null : role,
}))
// location.reload()
await authStore.actions.fetchUser()
await initialise()
}
return {
subscribe: store.subscribe,
actions: { setVisible, setAllowSelection, changeRole },
}
}
export const devToolsStore = createDevToolStore()

2
packages/client/src/stores/index.js
View File

@ -9,6 +9,8 @@ export { confirmationStore } from "./confirmation"
export { peekStore } from "./peek"
export { stateStore } from "./state"
export { themeStore } from "./theme"
export { devToolsStore } from "./devTools"
export { componentStore } from "./components"
export { uploadStore } from "./uploads.js"
export { rowSelectionStore } from "./rowSelection.js"
// Context stores are layered and duplicated, so it is not a singleton

1
packages/client/src/stores/screens.js
View File

@ -66,7 +66,6 @@ const createScreenStore = () => {
}
let children = []
findChildrenByType(component, type, children)
console.log(children)
return children
},
}

2
packages/client/src/utils/buttonActions.js
View File

@ -81,7 +81,7 @@ const duplicateRowHandler = async (action, context) => {
const deleteRowHandler = async action => {
const { tableId, revId, rowId } = action.parameters
if (tableId && revId && rowId) {
if (tableId && rowId) {
try {
await API.deleteRow({ tableId, rowId, revId })
notificationStore.actions.success("Row deleted")

18
packages/client/src/utils/componentProps.js
View File

@ -107,3 +107,21 @@ export const propsUseBinding = (props, bindingKey) => {
}
return false
}
/**
* Gets the definition of this component's settings from the manifest
*/
export const getSettingsDefinition = definition => {
if (!definition) {
return []
}
let settings = []
definition.settings?.forEach(setting => {
if (setting.section) {
settings = settings.concat(setting.settings || [])
} else {
settings.push(setting)
}
})
return settings
}

4
packages/frontend-core/package.json
View File

@ -1,12 +1,12 @@
{
"name": "@budibase/frontend-core",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Budibase frontend core libraries used in builder and client",
"author": "Budibase",
"license": "MPL-2.0",
"svelte": "src/index.js",
"dependencies": {
"@budibase/bbui": "^1.0.105-alpha.14",
"@budibase/bbui": "^1.0.105-alpha.23",
"lodash": "^4.17.21",
"svelte": "^3.46.2"
}

2
packages/frontend-core/src/api/rows.js
View File

@ -35,7 +35,7 @@ export const buildRowEndpoints = API => ({
* @param revId the rev of the row to delete
*/
deleteRow: async ({ tableId, rowId, revId }) => {
if (!tableId || !rowId || !revId) {
if (!tableId || !rowId) {
return
}
return await API.delete({

8
packages/server/package.json
View File

@ -1,7 +1,7 @@
{
"name": "@budibase/server",
"email": "hi@budibase.com",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Budibase Web Server",
"main": "src/index.ts",
"repository": {
@ -68,9 +68,9 @@
"license": "GPL-3.0",
"dependencies": {
"@apidevtools/swagger-parser": "^10.0.3",
"@budibase/backend-core": "^1.0.105-alpha.14",
"@budibase/client": "^1.0.105-alpha.14",
"@budibase/string-templates": "^1.0.105-alpha.14",
"@budibase/backend-core": "^1.0.105-alpha.23",
"@budibase/client": "^1.0.105-alpha.23",
"@budibase/string-templates": "^1.0.105-alpha.23",
"@bull-board/api": "^3.7.0",
"@bull-board/koa": "^3.7.0",
"@elastic/elasticsearch": "7.10.0",

3
packages/server/src/api/controllers/row/internal.js
View File

@ -259,8 +259,9 @@ exports.find = async ctx => {
exports.destroy = async function (ctx) {
const db = getAppDB()
const { _id, _rev } = ctx.request.body
const { _id } = ctx.request.body
let row = await db.get(_id)
let _rev = ctx.request.body._rev || row._rev
if (row.tableId !== ctx.params.tableId) {
throw "Supplied tableId doesn't match the row's tableId"

3
packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
View File

@ -78,6 +78,9 @@
app.
</h2>
</div>
<script type="application/javascript">
window.INIT_TIME = Date.now()
</script>
<script type="application/javascript" src={clientLibPath}>
</script>
<script type="application/javascript">

3
packages/server/src/automations/actions.js
View File

@ -13,6 +13,7 @@ const integromat = require("./steps/integromat")
let filter = require("./steps/filter")
let delay = require("./steps/delay")
let queryRow = require("./steps/queryRows")
let loop = require("./steps/loop")
const env = require("../environment")
const ACTION_IMPLS = {
@ -27,6 +28,7 @@ const ACTION_IMPLS = {
DELAY: delay.run,
FILTER: filter.run,
QUERY_ROWS: queryRow.run,
LOOP: loop.run,
// these used to be lowercase step IDs, maintain for backwards compat
discord: discord.run,
slack: slack.run,
@ -45,6 +47,7 @@ const ACTION_DEFINITIONS = {
DELAY: delay.definition,
FILTER: filter.definition,
QUERY_ROWS: queryRow.definition,
LOOP: loop.definition,
// these used to be lowercase step IDs, maintain for backwards compat
discord: discord.definition,
slack: slack.definition,

12
packages/server/src/automations/automationUtils.js
View File

@ -1,4 +1,5 @@
const { getTable } = require("../api/controllers/table/utils")
const { findHBSBlocks } = require("@budibase/string-templates")
/**
* When values are input to the system generally they will be of type string as this is required for template strings.
@ -74,3 +75,14 @@ exports.getError = err => {
}
return typeof err !== "string" ? err.toString() : err
}
exports.substituteLoopStep = (hbsString, substitute) => {
let blocks = findHBSBlocks(hbsString)
for (let block of blocks) {
let oldBlock = block
block = block.replace(/loop/, substitute)
hbsString = hbsString.replace(new RegExp(oldBlock, "g"), block)
}
return hbsString
}

8
packages/server/src/automations/steps/deleteRow.ts
View File

@ -23,12 +23,8 @@ export const definition = {
type: "string",
title: "Row ID",
},
revision: {
type: "string",
title: "Row Revision",
},
},
required: ["tableId", "id", "revision"],
required: ["tableId", "id"],
},
outputs: {
properties: {
@ -52,7 +48,7 @@ export const definition = {
}
export async function run({ inputs, appId, emitter }: any) {
if (inputs.id == null || inputs.revision == null) {
if (inputs.id == null) {
return {
success: false,
response: {

50
packages/server/src/automations/steps/loop.js Normal file
View File

@ -0,0 +1,50 @@
exports.definition = {
name: "Looping",
icon: "Reuse",
tagline: "Loop the block",
description: "Loop",
stepId: "LOOP",
internal: true,
inputs: {},
schema: {
inputs: {
properties: {
option: {
customType: "loopOption",
title: "Input type",
},
binding: {
type: "string",
title: "Binding / Value",
},
iterations: {
type: "number",
title: "Max loop iterations",
},
failure: {
type: "string",
title: "Failure Condition",
},
},
required: ["type", "value", "iterations", "failure"],
},
outputs: {
properties: {
items: {
customType: "item",
description: "The item currently being executed",
},
success: {
type: "boolean",
description: "Whether the message loop was successfully",
},
iterations: {
type: "number",
descriptions: "The amount of times the block ran",
},
},
required: ["success", "items", "iterations"],
},
},
type: "LOGIC",
}

6
packages/server/src/constants/index.js
View File

@ -190,5 +190,11 @@ exports.WebhookType = {
AUTOMATION: "automation",
}
exports.AutomationErrors = {
INCORRECT_TYPE: "INCORRECT_TYPE",
MAX_ITERATIONS: "MAX_ITERATIONS_REACHED",
FAILURE_CONDITION: "FAILURE_CONDITION_MET",
}
// pass through the list from the auth/core lib
exports.ObjectStoreBuckets = ObjectStoreBuckets

1
packages/server/src/environment.js
View File

@ -57,6 +57,7 @@ module.exports = {
LOG_LEVEL: process.env.LOG_LEVEL,
AUTOMATION_DIRECTORY: process.env.AUTOMATION_DIRECTORY,
AUTOMATION_BUCKET: process.env.AUTOMATION_BUCKET,
AUTOMATION_MAX_ITERATIONS: process.env.AUTOMATION_MAX_ITERATIONS,
SENDGRID_API_KEY: process.env.SENDGRID_API_KEY,
DYNAMO_ENDPOINT: process.env.DYNAMO_ENDPOINT,
POSTHOG_TOKEN: process.env.POSTHOG_TOKEN,

17
packages/server/src/middleware/currentapp.js
View File

@ -4,7 +4,7 @@ const {
getCookie,
clearCookie,
} = require("@budibase/backend-core/utils")
const { Cookies } = require("@budibase/backend-core/constants")
const { Cookies, Headers } = require("@budibase/backend-core/constants")
const { getRole } = require("@budibase/backend-core/roles")
const { BUILTIN_ROLE_IDS } = require("@budibase/backend-core/roles")
const { generateUserMetadataID, isDevAppID } = require("../db/utils")
@ -63,6 +63,21 @@ module.exports = async (ctx, next) => {
appId = requestAppId
// retrieving global user gets the right role
roleId = globalUser.roleId || roleId
// Allow builders to specify their role via a header
const isBuilder =
globalUser && globalUser.builder && globalUser.builder.global
const isDevApp = appId && isDevAppID(appId)
const roleHeader = ctx.request && ctx.request.headers[Headers.PREVIEW_ROLE]
if (isBuilder && isDevApp && roleHeader) {
// Ensure the role is valid by ensuring a definition exists
try {
await getRole(roleHeader)
roleId = roleHeader
} catch (error) {
// Swallow error and do nothing
}
}
}
// nothing more to do

230
packages/server/src/threads/automation.js
View File

@ -8,10 +8,14 @@ const { DocumentTypes } = require("../db/utils")
const { doInTenant } = require("@budibase/backend-core/tenancy")
const { definitions: triggerDefs } = require("../automations/triggerInfo")
const { doInAppContext, getAppDB } = require("@budibase/backend-core/context")
const { AutomationErrors } = require("../constants")
const FILTER_STEP_ID = actions.ACTION_DEFINITIONS.FILTER.stepId
const LOOP_STEP_ID = actions.ACTION_DEFINITIONS.LOOP.stepId
const CRON_STEP_ID = triggerDefs.CRON.stepId
const STOPPED_STATUS = { success: false, status: "STOPPED" }
const { cloneDeep } = require("lodash/fp")
const env = require("../environment")
/**
* The automation orchestrator is a class responsible for executing automations.
@ -74,50 +78,208 @@ class Orchestrator {
this.executionOutput.steps.push(stepObj)
}
updateContextAndOutput(loopStepNumber, step, output, result) {
this.executionOutput.steps.splice(loopStepNumber, 0, {
id: step.id,
stepId: step.stepId,
outputs: {
...output,
success: result.success,
status: result.status,
},
inputs: step.inputs,
})
this._context.steps.splice(loopStepNumber, 0, {
...output,
success: result.success,
status: result.status,
})
}
async execute() {
let automation = this._automation
const app = await this.getApp()
let stopped = false
let loopStep
let stepCount = 0
let loopStepNumber
let loopSteps = []
for (let step of automation.definition.steps) {
// execution stopped, record state for that
if (stopped) {
this.updateExecutionOutput(step.id, step.stepId, {}, STOPPED_STATUS)
stepCount++
let input
if (step.stepId === LOOP_STEP_ID) {
loopStep = step
loopStepNumber = stepCount
continue
}
let stepFn = await this.getStepFunctionality(step.stepId)
step.inputs = await processObject(step.inputs, this._context)
step.inputs = automationUtils.cleanInputValues(
step.inputs,
step.schema.inputs
)
// appId is always passed
try {
let tenantId = app.tenantId || DEFAULT_TENANT_ID
const outputs = await doInTenant(tenantId, () => {
return stepFn({
inputs: step.inputs,
appId: this._appId,
emitter: this._emitter,
context: this._context,
})
})
this._context.steps.push(outputs)
// if filter causes us to stop execution don't break the loop, set a var
// so that we can finish iterating through the steps and record that it stopped
if (step.stepId === FILTER_STEP_ID && !outputs.success) {
stopped = true
this.updateExecutionOutput(step.id, step.stepId, step.inputs, {
...outputs,
...STOPPED_STATUS,
})
if (loopStep) {
input = await processObject(loopStep.inputs, this._context)
}
let iterations = loopStep ? input.binding.length : 1
let iterationCount = 0
for (let index = 0; index < iterations; index++) {
let originalStepInput = cloneDeep(step.inputs)
// Handle if the user has set a max iteration count or if it reaches the max limit set by us
if (loopStep) {
// lets first of all handle the input
// if the input is array then use it, if it is a string then split it on every new line
let newInput = await processObject(
loopStep.inputs,
cloneDeep(this._context)
)
newInput = automationUtils.cleanInputValues(
newInput,
loopStep.schema.inputs
)
this._context.steps[loopStepNumber] = {
currentItem: newInput.binding[index],
}
let tempOutput = { items: loopSteps, iterations: iterationCount }
if (
(loopStep.inputs.option === "Array" &&
!Array.isArray(newInput.binding)) ||
(loopStep.inputs.option === "String" &&
typeof newInput.binding !== "string")
) {
this.updateContextAndOutput(loopStepNumber, step, tempOutput, {
status: AutomationErrors.INCORRECT_TYPE,
success: false,
})
loopSteps = null
loopStep = null
break
}
// The "Loop" binding in the front end is "fake", so replace it here so the context can understand it
// Pretty hacky because we need to account for the row object
for (let [key, value] of Object.entries(originalStepInput)) {
if (typeof value === "object") {
for (let [innerKey, innerValue] of Object.entries(
originalStepInput[key]
)) {
if (typeof innerValue === "string") {
originalStepInput[key][innerKey] =
automationUtils.substituteLoopStep(
innerValue,
`steps.${loopStepNumber}`
)
}
}
} else {
if (typeof value === "string") {
originalStepInput[key] = automationUtils.substituteLoopStep(
value,
`steps.${loopStepNumber}`
)
}
}
}
if (
index === parseInt(env.AUTOMATION_MAX_ITERATIONS) ||
index === loopStep.inputs.iterations
) {
this.updateContextAndOutput(loopStepNumber, step, tempOutput, {
status: AutomationErrors.MAX_ITERATIONS,
success: true,
})
loopSteps = null
loopStep = null
break
}
if (
this._context.steps[loopStepNumber]?.currentItem ===
loopStep.inputs.failure
) {
this.updateContextAndOutput(loopStepNumber, step, tempOutput, {
status: AutomationErrors.FAILURE_CONDITION,
success: false,
})
loopSteps = null
loopStep = null
break
}
}
// execution stopped, record state for that
if (stopped) {
this.updateExecutionOutput(step.id, step.stepId, {}, STOPPED_STATUS)
continue
}
this.updateExecutionOutput(step.id, step.stepId, step.inputs, outputs)
} catch (err) {
console.error(`Automation error - ${step.stepId} - ${err}`)
return err
// If it's a loop step, we need to manually add the bindings to the context
let stepFn = await this.getStepFunctionality(step.stepId)
let inputs = await processObject(originalStepInput, this._context)
inputs = automationUtils.cleanInputValues(inputs, step.schema.inputs)
try {
// appId is always passed
let tenantId = app.tenantId || DEFAULT_TENANT_ID
const outputs = await doInTenant(tenantId, () => {
return stepFn({
inputs: inputs,
appId: this._appId,
emitter: this._emitter,
context: this._context,
})
})
this._context.steps[stepCount] = outputs
// if filter causes us to stop execution don't break the loop, set a var
// so that we can finish iterating through the steps and record that it stopped
if (step.stepId === FILTER_STEP_ID && !outputs.success) {
stopped = true
this.updateExecutionOutput(step.id, step.stepId, step.inputs, {
...outputs,
...STOPPED_STATUS,
})
continue
}
if (loopStep && loopSteps) {
loopSteps.push(outputs)
} else {
this.updateExecutionOutput(
step.id,
step.stepId,
step.inputs,
outputs
)
}
} catch (err) {
console.error(`Automation error - ${step.stepId} - ${err}`)
return err
}
if (loopStep) {
iterationCount++
if (index === iterations - 1) {
loopStep = null
this._context.steps.splice(loopStepNumber, 1)
break
}
}
}
if (loopSteps && loopSteps.length) {
let tempOutput = {
success: true,
items: loopSteps,
iterations: iterationCount,
}
this.executionOutput.steps.splice(loopStepNumber + 1, 0, {
id: step.id,
stepId: step.stepId,
outputs: tempOutput,
inputs: step.inputs,
})
this._context.steps.splice(loopStepNumber, 0, tempOutput)
loopSteps = null
}
}
return this.executionOutput
}
}

2
packages/string-templates/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@budibase/string-templates",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Handlebars wrapper for Budibase templating.",
"main": "src/index.cjs",
"module": "dist/bundle.mjs",

6
packages/worker/package.json
View File

@ -1,7 +1,7 @@
{
"name": "@budibase/worker",
"email": "hi@budibase.com",
"version": "1.0.105-alpha.14",
"version": "1.0.105-alpha.23",
"description": "Budibase background service",
"main": "src/index.ts",
"repository": {
@ -31,8 +31,8 @@
"author": "Budibase",
"license": "GPL-3.0",
"dependencies": {
"@budibase/backend-core": "^1.0.105-alpha.14",
"@budibase/string-templates": "^1.0.105-alpha.14",
"@budibase/backend-core": "^1.0.105-alpha.23",
"@budibase/string-templates": "^1.0.105-alpha.23",
"@koa/router": "^8.0.0",
"@sentry/node": "6.17.7",
"@techpass/passport-openidconnect": "^0.3.0",