diff --git a/lerna.json b/lerna.json
index 386fbe425a..81b35e2a6e 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
{
- "version": "2.14.4",
+ "version": "2.14.5",
"npmClient": "yarn",
"packages": [
"packages/*",
diff --git a/packages/account-portal b/packages/account-portal
index bcd86d9034..b23fb3b179 160000
--- a/packages/account-portal
+++ b/packages/account-portal
@@ -1 +1 @@
-Subproject commit bcd86d9034ba954f013da4c10171bf495ab88189
+Subproject commit b23fb3b17961fb04badd9487913a683fcf26dbe6
diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index 2d62a0667e..b05b127b1c 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -85,7 +85,6 @@ const INITIAL_FRONTEND_STATE = {
selectedScreenId: null,
selectedComponentId: null,
selectedLayoutId: null,
- hoverComponentId: null,
// Client state
selectedComponentInstance: null,
@@ -93,6 +92,9 @@ const INITIAL_FRONTEND_STATE = {
// Onboarding
onboarding: false,
tourNodes: null,
+
+ // UI state
+ hoveredComponentId: null,
}
export const getFrontendStore = () => {
@@ -1413,6 +1415,18 @@ export const getFrontendStore = () => {
return state
})
},
+ hover: (componentId, notifyClient = true) => {
+ if (componentId === get(store).hoveredComponentId) {
+ return
+ }
+ store.update(state => {
+ state.hoveredComponentId = componentId
+ return state
+ })
+ if (notifyClient) {
+ store.actions.preview.sendEvent("hover-component", componentId)
+ }
+ },
},
links: {
save: async (url, title) => {
diff --git a/packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte b/packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte
index 15dd864168..9f7aaa68ce 100644
--- a/packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte
+++ b/packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte
@@ -152,7 +152,7 @@
{#if isDisabled && !syncAutomationsEnabled && action.stepId === ActionStepID.COLLECT}
- Business
+ Premium
{:else if isDisabled}
diff --git a/packages/builder/src/components/automation/SetupPanel/RowSelectorTypes.svelte b/packages/builder/src/components/automation/SetupPanel/RowSelectorTypes.svelte
index 851c5b39c9..937e3b6c69 100644
--- a/packages/builder/src/components/automation/SetupPanel/RowSelectorTypes.svelte
+++ b/packages/builder/src/components/automation/SetupPanel/RowSelectorTypes.svelte
@@ -41,7 +41,7 @@
{ label: "False", value: "false" },
]}
/>
-{:else if schema.type === "array"}
+{:else if schemaHasOptions(schema) && schema.type === "array"}
onChange(e, field)}
useLabel={false}
/>
-{:else if ["string", "number", "bigint", "barcodeqr"].includes(schema.type)}
+{:else if ["string", "number", "bigint", "barcodeqr", "array"].includes(schema.type)}
- import { currentAsset } from "builderStore"
- import { findClosestMatchingComponent } from "builderStore/componentUtils"
+ import { currentAsset, store } from "builderStore"
+ import {
+ findClosestMatchingComponent,
+ findComponent,
+ } from "builderStore/componentUtils"
import {
getDatasourceForProvider,
getSchemaForDatasource,
@@ -20,8 +23,23 @@
component => component._component.endsWith("/form")
)
+ const resolveDatasource = (currentAsset, componentInstance, form) => {
+ if (!form && componentInstance._id != $store.selectedComponentId) {
+ const block = findComponent(
+ currentAsset.props,
+ $store.selectedComponentId
+ )
+ const def = store.actions.components.getDefinition(block._component)
+ return def?.block === true
+ ? getDatasourceForProvider(currentAsset, block)
+ : {}
+ } else {
+ return getDatasourceForProvider(currentAsset, form)
+ }
+ }
+
// Get that form's schema
- $: datasource = getDatasourceForProvider($currentAsset, form)
+ $: datasource = resolveDatasource($currentAsset, componentInstance, form)
$: formSchema = getSchemaForDatasource($currentAsset, datasource)?.schema
// Get the schema for the relationship field that this picker is using
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
index 1d2a1b9617..9928f19a7f 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/ComponentSettingsPanel.svelte
@@ -108,6 +108,8 @@
{componentInstance}
{componentDefinition}
{bindings}
+ iconTooltip={componentName}
+ componentTitle={title}
/>
{/if}
{#if section == "conditions"}
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/CustomStylesSection.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/CustomStylesSection.svelte
index 59c1b5c620..d8508619f3 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/CustomStylesSection.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/CustomStylesSection.svelte
@@ -5,6 +5,9 @@
Drawer,
Button,
notifications,
+ AbsTooltip,
+ Icon,
+ Body,
} from "@budibase/bbui"
import { selectedScreen, store } from "builderStore"
import ClientBindingPanel from "components/common/bindings/ClientBindingPanel.svelte"
@@ -15,6 +18,9 @@
} from "builderStore/dataBinding"
export let componentInstance
+ export let componentDefinition
+ export let iconTooltip
+ export let componentTitle
let tempValue
let drawer
@@ -24,6 +30,8 @@
$store.selectedComponentId
)
+ $: icon = componentDefinition?.icon
+
const openDrawer = () => {
tempValue = runtimeToReadableBinding(
bindings,
@@ -54,7 +62,19 @@
{#key componentInstance?._id}
- Custom CSS overrides all other component styles.
+
{/key}
+
+
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 65ea172012..2127392bb9 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
@@ -36,14 +36,12 @@
// Determine selected component ID
$: selectedComponentId = $store.selectedComponentId
- $: hoverComponentId = $store.hoverComponentId
$: previewData = {
appId: $store.appId,
layout,
screen,
selectedComponentId,
- hoverComponentId,
theme: $store.theme,
customTheme: $store.customTheme,
previewDevice: $store.previewDevice,
@@ -119,8 +117,8 @@
error = event.error || "An unknown error occurred"
} else if (type === "select-component" && data.id) {
$store.selectedComponentId = data.id
- } else if (type === "hover-component" && data.id) {
- $store.hoverComponentId = data.id
+ } else if (type === "hover-component") {
+ store.actions.components.hover(data.id, false)
} else if (type === "update-prop") {
await store.actions.components.updateSetting(data.prop, data.value)
} else if (type === "update-styles") {
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/ComponentTree.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/ComponentTree.svelte
index 8d4d64e4be..315c0a331e 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/ComponentTree.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/ComponentTree.svelte
@@ -90,16 +90,7 @@
return findComponentPath($selectedComponent, component._id)?.length > 0
}
- const handleMouseover = componentId => {
- if ($store.hoverComponentId !== componentId) {
- $store.hoverComponentId = componentId
- }
- }
- const handleMouseout = componentId => {
- if ($store.hoverComponentId === componentId) {
- $store.hoverComponentId = null
- }
- }
+ const hover = store.actions.components.hover
@@ -120,9 +111,9 @@
on:dragover={dragover(component, index)}
on:iconClick={() => toggleNodeOpen(component._id)}
on:drop={onDrop}
- hovering={$store.hoverComponentId === component._id}
- on:mouseenter={() => handleMouseover(component._id)}
- on:mouseleave={() => handleMouseout(component._id)}
+ hovering={$store.hoveredComponentId === component._id}
+ on:mouseenter={() => hover(component._id)}
+ on:mouseleave={() => hover(null)}
text={getComponentText(component)}
icon={getComponentIcon(component)}
iconTooltip={getComponentName(component)}
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/index.svelte
index 1e2ea47e63..d2ffc5de74 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ComponentList/index.svelte
@@ -12,6 +12,9 @@
let scrolling = false
+ $: screenComponentId = `${$store.selectedScreenId}-screen`
+ $: navComponentId = `${$store.selectedScreenId}-navigation`
+
const toNewComponentRoute = () => {
if ($isActive(`./:componentId/new`)) {
$goto(`./:componentId`)
@@ -33,16 +36,7 @@
scrolling = e.target.scrollTop !== 0
}
- const handleMouseover = componentId => {
- if ($store.hoverComponentId !== componentId) {
- $store.hoverComponentId = componentId
- }
- }
- const handleMouseout = componentId => {
- if ($store.hoverComponentId === componentId) {
- $store.hoverComponentId = null
- }
- }
+ const hover = store.actions.components.hover
@@ -65,46 +59,31 @@
scrollable
icon="WebPage"
on:drop={onDrop}
- on:click={() => {
- $store.selectedComponentId = `${$store.selectedScreenId}-screen`
- }}
- hovering={$store.hoverComponentId ===
- `${$store.selectedScreenId}-screen`}
- on:mouseenter={() =>
- handleMouseover(`${$store.selectedScreenId}-screen`)}
- on:mouseleave={() =>
- handleMouseout(`${$store.selectedScreenId}-screen`)}
- id={`component-screen`}
- selectedBy={$userSelectedResourceMap[
- `${$store.selectedScreenId}-screen`
- ]}
+ on:click={() => ($store.selectedComponentId = screenComponentId)}
+ hovering={$store.hoveredComponentId === screenComponentId}
+ on:mouseenter={() => hover(screenComponentId)}
+ on:mouseleave={() => hover(null)}
+ id="component-screen"
+ selectedBy={$userSelectedResourceMap[screenComponentId]}
>
{
- $store.selectedComponentId = `${$store.selectedScreenId}-navigation`
- }}
- hovering={$store.hoverComponentId ===
- `${$store.selectedScreenId}-navigation`}
- on:mouseenter={() =>
- handleMouseover(`${$store.selectedScreenId}-navigation`)}
- on:mouseleave={() =>
- handleMouseout(`${$store.selectedScreenId}-navigation`)}
- id={`component-nav`}
- selectedBy={$userSelectedResourceMap[
- `${$store.selectedScreenId}-navigation`
- ]}
+ on:click={() => ($store.selectedComponentId = navComponentId)}
+ hovering={$store.hoveredComponentId === navComponentId}
+ on:mouseenter={() => hover(navComponentId)}
+ on:mouseleave={() => hover(null)}
+ id="component-nav"
+ selectedBy={$userSelectedResourceMap[navComponentId]}
/>
Branding
{#if !isCloud && !brandingEnabled}
- Business
+ Premium
{/if}
{#if isCloud && !brandingEnabled}
diff --git a/packages/builder/src/pages/builder/portal/users/groups/index.svelte b/packages/builder/src/pages/builder/portal/users/groups/index.svelte
index a82da5cf34..ab0a0eb938 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/index.svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/index.svelte
@@ -97,7 +97,7 @@
Groups
{#if !$licensing.groupsEnabled}
- Business
+ Enterpise
{/if}
diff --git a/packages/client/src/components/preview/HoverIndicator.svelte b/packages/client/src/components/preview/HoverIndicator.svelte
index ddef62ab74..164ec32ab4 100644
--- a/packages/client/src/components/preview/HoverIndicator.svelte
+++ b/packages/client/src/components/preview/HoverIndicator.svelte
@@ -1,9 +1,9 @@