From 2a2466fbda9d8088624b2c12c603fe7764b9a784 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Thu, 19 Jan 2023 16:09:40 +0000 Subject: [PATCH] More fixes (#9387) * Mark filters as nested settings to support persisting bindings post block ejection * Add support for searching on linked fields in blocks * Fix multi-select pickers closing on every click * Target spectrum root element by default when rendering popovers, and allow customisation via context for client library * Don't send up invalid HBS expressions when filtering on dates in blocks with empty date value * Move profile above theme in user dropdown --- packages/bbui/src/Form/Core/Picker.svelte | 12 ++++--- packages/bbui/src/Popover/Popover.svelte | 5 ++- packages/bbui/src/context.js | 1 + .../portal/_components/UserDropdown.svelte | 6 ++-- packages/client/manifest.json | 12 ++++--- .../src/components/CustomThemeWrapper.svelte | 4 +++ .../components/app/blocks/CardsBlock.svelte | 5 ++- .../components/app/blocks/TableBlock.svelte | 5 ++- packages/client/src/utils/blocks.js | 31 ++++++++++++++++--- 9 files changed, 62 insertions(+), 19 deletions(-) diff --git a/packages/bbui/src/Form/Core/Picker.svelte b/packages/bbui/src/Form/Core/Picker.svelte index 81348452c7..32cfcf3310 100644 --- a/packages/bbui/src/Form/Core/Picker.svelte +++ b/packages/bbui/src/Form/Core/Picker.svelte @@ -45,7 +45,9 @@ getOptionLabel ) - const onClick = () => { + const onClick = e => { + e.preventDefault() + e.stopPropagation() dispatch("click") if (readonly) { return @@ -88,7 +90,6 @@ class:is-open={open} aria-haspopup="listbox" on:click={onClick} - use:clickOutside={() => (open = false)} bind:this={button} > {#if fieldIcon} @@ -130,14 +131,17 @@ (open = false)} useAnchorWidth={!autoWidth} maxWidth={autoWidth ? 400 : null} > -
+
(open = false)} + > {#if autocomplete} { dispatch("open") @@ -61,7 +64,7 @@ {#if open} - +
- themeModal.show()} dataCy="theme"> - Theme - profileModal.show()} @@ -36,6 +33,9 @@ > My profile + themeModal.show()} dataCy="theme"> + Theme + updatePasswordModal.show()}> Update password diff --git a/packages/client/manifest.json b/packages/client/manifest.json index 9d50c13bb6..d1898a82c1 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -4019,7 +4019,8 @@ { "type": "filter", "label": "Filtering", - "key": "filter" + "key": "filter", + "nested": true }, { "type": "field", @@ -4535,7 +4536,8 @@ { "type": "filter", "label": "Filtering", - "key": "filter" + "key": "filter", + "nested": true }, { "type": "searchfield", @@ -4665,7 +4667,8 @@ { "type": "filter", "label": "Filtering", - "key": "filter" + "key": "filter", + "nested": true }, { "type": "field/sortable", @@ -4831,7 +4834,8 @@ { "type": "filter", "label": "Filtering", - "key": "filter" + "key": "filter", + "nested": true }, { "type": "field/sortable", diff --git a/packages/client/src/components/CustomThemeWrapper.svelte b/packages/client/src/components/CustomThemeWrapper.svelte index 20dae01ce0..c9ab9c9dc1 100644 --- a/packages/client/src/components/CustomThemeWrapper.svelte +++ b/packages/client/src/components/CustomThemeWrapper.svelte @@ -1,5 +1,9 @@
diff --git a/packages/client/src/components/app/blocks/CardsBlock.svelte b/packages/client/src/components/app/blocks/CardsBlock.svelte index 5098a3acf4..795e62eb31 100644 --- a/packages/client/src/components/app/blocks/CardsBlock.svelte +++ b/packages/client/src/components/app/blocks/CardsBlock.svelte @@ -36,9 +36,12 @@ let dataProviderId let repeaterId let schema + let enrichedSearchColumns $: fetchSchema(dataSource) - $: enrichedSearchColumns = enrichSearchColumns(searchColumns, schema) + $: enrichSearchColumns(searchColumns, schema).then( + val => (enrichedSearchColumns = val) + ) $: enrichedFilter = enrichFilter(filter, enrichedSearchColumns, formId) $: cardWidth = cardHorizontal ? 420 : 300 $: fullCardURL = buildFullCardUrl( diff --git a/packages/client/src/components/app/blocks/TableBlock.svelte b/packages/client/src/components/app/blocks/TableBlock.svelte index 0984c901a3..91c266b434 100644 --- a/packages/client/src/components/app/blocks/TableBlock.svelte +++ b/packages/client/src/components/app/blocks/TableBlock.svelte @@ -36,9 +36,12 @@ let newRowSidePanelId let schema let primaryDisplay + let enrichedSearchColumns $: fetchSchema(dataSource) - $: enrichedSearchColumns = enrichSearchColumns(searchColumns, schema) + $: enrichSearchColumns(searchColumns, schema).then( + val => (enrichedSearchColumns = val) + ) $: enrichedFilter = enrichFilter(filter, enrichedSearchColumns, formId) $: editTitle = getEditTitle(detailsFormBlockId, primaryDisplay) $: normalFields = getNormalFields(schema) diff --git a/packages/client/src/utils/blocks.js b/packages/client/src/utils/blocks.js index 61cd640bbc..214b48a4d2 100644 --- a/packages/client/src/utils/blocks.js +++ b/packages/client/src/utils/blocks.js @@ -1,4 +1,5 @@ import { makePropSafe as safe } from "@budibase/string-templates" +import { API } from "../api/index.js" // Map of data types to component types for search fields inside blocks const schemaComponentMap = { @@ -15,10 +16,28 @@ const schemaComponentMap = { * @param searchColumns the search columns to use * @param schema the datasource schema */ -export const enrichSearchColumns = (searchColumns, schema) => { +export const enrichSearchColumns = async (searchColumns, schema) => { + if (!searchColumns?.length || !schema) { + return [] + } let enrichedColumns = [] - searchColumns?.forEach(column => { - const schemaType = schema?.[column]?.type + for (let column of searchColumns) { + let schemaType = schema[column]?.type + + // Check if this is a field in another related table. The only way we can + // check this is checking for a "." inside the column, then checking if we + // have a link field named the same as that field prefix. + if (column.includes(".")) { + const split = column.split(".") + const sourceField = split[0] + const linkField = split.slice(1).join(".") + const linkSchema = schema[sourceField] + if (linkSchema?.type === "link") { + const linkedDef = await API.fetchTableDefinition(linkSchema.tableId) + schemaType = linkedDef?.schema?.[linkField]?.type + } + } + const componentType = schemaComponentMap[schemaType] if (componentType) { enrichedColumns.push({ @@ -27,7 +46,7 @@ export const enrichSearchColumns = (searchColumns, schema) => { type: schemaType, }) } - }) + } return enrichedColumns.slice(0, 5) } @@ -57,12 +76,14 @@ export const enrichFilter = (filter, columns, formId) => { value: `{{ ${binding} }}`, }) const format = "YYYY-MM-DDTHH:mm:ss.SSSZ" + let hbs = `{{ date (add (date ${binding} "x") 86399999) "${format}" }}` + hbs = `{{#if ${binding} }}${hbs}{{/if}}` enrichedFilter.push({ field: column.name, type: column.type, operator: "rangeHigh", valueType: "Binding", - value: `{{ date (add (date ${binding} "x") 86399999) "${format}" }}`, + value: hbs, }) }