diff --git a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ValidateForm.svelte b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ValidateForm.svelte
index e572dc6c1c..e7f3d91ec8 100644
--- a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ValidateForm.svelte
+++ b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ValidateForm.svelte
@@ -1,5 +1,5 @@
+
+
+
+
+
+
+ {#each filtered as item}
+
{
+ select(item._id)
+ }}
+ style="padding-bottom: var(--spacing-m)"
+ class="selection"
+ >
+
+ {item[key]}
+
+
+ {#if selected.includes(item._id)}
+
+
+
+ {/if}
+
+ {/each}
+
+
+
+
diff --git a/packages/builder/src/components/start/AppRow.svelte b/packages/builder/src/components/start/AppRow.svelte
index 49f99c9f77..91920073bb 100644
--- a/packages/builder/src/components/start/AppRow.svelte
+++ b/packages/builder/src/components/start/AppRow.svelte
@@ -30,7 +30,7 @@
{/if}
diff --git a/packages/builder/src/components/start/CreateAppModal.svelte b/packages/builder/src/components/start/CreateAppModal.svelte
index 2cf1ce7f6c..23f9f3f80c 100644
--- a/packages/builder/src/components/start/CreateAppModal.svelte
+++ b/packages/builder/src/components/start/CreateAppModal.svelte
@@ -111,7 +111,6 @@
await admin.init()
// Create user
- await API.updateOwnMetadata({ roleId: $values.roleId })
await auth.setInitInfo({})
// Create a default home screen if no template was selected
diff --git a/packages/builder/src/helpers/data/utils.js b/packages/builder/src/helpers/data/utils.js
index 23aeb314a0..647c2be33e 100644
--- a/packages/builder/src/helpers/data/utils.js
+++ b/packages/builder/src/helpers/data/utils.js
@@ -150,12 +150,31 @@ export function flipHeaderState(headersActivity) {
return enabled
}
+export const parseToCsv = (headers, rows) => {
+ let csv = headers?.map(key => `"${key}"`)?.join(",") || ""
+
+ for (let row of rows) {
+ csv = `${csv}\n${headers
+ .map(header => {
+ let val = row[header]
+ val =
+ typeof val === "object" && !(val instanceof Date)
+ ? `"${JSON.stringify(val).replace(/"/g, "'")}"`
+ : `"${val}"`
+ return val.trim()
+ })
+ .join(",")}`
+ }
+ return csv
+}
+
export default {
breakQueryString,
buildQueryString,
fieldsToSchema,
flipHeaderState,
keyValueToQueryParameters,
+ parseToCsv,
queryParametersToKeyValue,
schemaToFields,
}
diff --git a/packages/builder/src/helpers/featureFlags.js b/packages/builder/src/helpers/featureFlags.js
index 9533abed7e..a0cda8d5fa 100644
--- a/packages/builder/src/helpers/featureFlags.js
+++ b/packages/builder/src/helpers/featureFlags.js
@@ -3,6 +3,7 @@ import { get } from "svelte/store"
export const FEATURE_FLAGS = {
LICENSING: "LICENSING",
+ USER_GROUPS: "USER_GROUPS",
}
export const isEnabled = featureFlag => {
diff --git a/packages/builder/src/main.js b/packages/builder/src/main.js
index bc5ec4f009..dc1e1cf1bf 100644
--- a/packages/builder/src/main.js
+++ b/packages/builder/src/main.js
@@ -5,6 +5,8 @@ import "@spectrum-css/vars/dist/spectrum-darkest.css"
import "@spectrum-css/vars/dist/spectrum-dark.css"
import "@spectrum-css/vars/dist/spectrum-light.css"
import "@spectrum-css/vars/dist/spectrum-lightest.css"
+import "@budibase/frontend-core/src/themes/nord.css"
+import "@budibase/frontend-core/src/themes/midnight.css"
import "@spectrum-css/page/dist/index-vars.css"
import "./global.css"
import { suppressWarnings } from "./helpers/warnings"
diff --git a/packages/builder/src/pages/builder/app/[application]/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/_layout.svelte
index df84277142..28c5fe18c6 100644
--- a/packages/builder/src/pages/builder/app/[application]/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/_layout.svelte
@@ -23,10 +23,6 @@
$layout.children.find(layout => $isActive(layout.path))?.title ?? "data"
)
- const previewApp = () => {
- window.open(`/${application}`)
- }
-
async function getPackage() {
try {
store.actions.reset()
@@ -108,14 +104,10 @@
@@ -183,4 +175,8 @@
align-items: center;
gap: var(--spacing-xl);
}
+
+ .version {
+ margin-right: var(--spacing-s);
+ }
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPanel.svelte
index 76118cc9c8..c4b80dcc3a 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPanel.svelte
@@ -1,10 +1,9 @@
@@ -15,24 +14,17 @@
options={$sortedScreens}
getOptionLabel={x => x.routing.route}
getOptionValue={x => x._id}
- getOptionIcon={x => (x.routing.homeScreen ? "Home" : "WebPage")}
getOptionColour={x => RoleUtils.getRoleColour(x.routing.roleId)}
value={$store.selectedScreenId}
on:change={e => store.actions.screens.select(e.detail)}
+ quiet
+ autoWidth
/>
@@ -59,6 +51,7 @@
justify-content: space-between;
align-items: flex-start;
gap: var(--spacing-l);
+ margin: 0 2px;
}
.header-left,
.header-right {
@@ -69,7 +62,8 @@
gap: var(--spacing-l);
}
.header-left :global(.spectrum-Picker) {
- width: 250px;
+ font-weight: 600;
+ color: var(--spectrum-global-color-gray-900);
}
.content {
flex: 1 1 auto;
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
index abb956c9d3..3c99c90d49 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte
@@ -3,6 +3,7 @@
import { onMount, onDestroy } from "svelte"
import {
store,
+ selectedComponent,
selectedScreen,
selectedLayout,
currentAsset,
@@ -14,6 +15,7 @@
Layout,
Heading,
Body,
+ Icon,
notifications,
} from "@budibase/bbui"
import ErrorSVG from "@budibase/frontend-core/assets/error.svg?raw"
@@ -96,6 +98,11 @@
$: json = JSON.stringify(previewData)
$: refreshContent(json)
+ // Determine if the add component menu is active
+ $: isAddingComponent = $isActive(
+ `./components/${$selectedComponent?._id}/new`
+ )
+
// Update the iframe with the builder info to render the correct preview
const refreshContent = message => {
if (iframe) {
@@ -179,7 +186,7 @@
$goto("./navigation")
}
} else if (type === "request-add-component") {
- $goto("./components/new")
+ $goto(`./components/${$selectedComponent?._id}/new`)
} else if (type === "highlight-setting") {
store.actions.settings.highlight(data.setting)
@@ -219,6 +226,16 @@
idToDelete = null
}
+ const toggleAddComponent = () => {
+ if (isAddingComponent) {
+ $goto(`../${$selectedScreen._id}/components/${$selectedComponent?._id}`)
+ } else {
+ $goto(
+ `../${$selectedScreen._id}/components/${$selectedComponent?._id}/new`
+ )
+ }
+ }
+
onMount(() => {
window.addEventListener("message", receiveMessage)
if (!$store.clientFeatures.messagePassing) {
@@ -282,6 +299,13 @@
class:tablet={$store.previewDevice === "tablet"}
class:mobile={$store.previewDevice === "mobile"}
/>
+
+ Component
+
+ 
+ 
+ 
+
+
+
