From 3996f93075bd66c246162a365f17d51e8e1f10b8 Mon Sep 17 00:00:00 2001 From: Jonathan Adeline Date: Wed, 10 Dec 2025 15:31:54 +0400 Subject: [PATCH] Fix data node usage in HTML content (#4379) --- ...lainputfield_display_with_mixed_content.json | 9 +++++++++ .../components/formula/FormulaInputContext.vue | 17 +++++++++++++++-- .../components/formula/FormulaInputField.vue | 13 ++++++++++++- web-frontend/modules/core/formula/constants.js | 1 + .../modules/core/runtimeFormulaTypes.js | 7 ++++++- .../services/CoreHTTPRequestServiceForm.vue | 9 +++++++++ .../services/CoreSMTPEmailServiceForm.vue | 9 +++++++++ 7 files changed, 61 insertions(+), 4 deletions(-) create mode 100644 changelog/entries/unreleased/bug/4377_fix_formulainputfield_display_with_mixed_content.json create mode 100644 web-frontend/modules/core/formula/constants.js diff --git a/changelog/entries/unreleased/bug/4377_fix_formulainputfield_display_with_mixed_content.json b/changelog/entries/unreleased/bug/4377_fix_formulainputfield_display_with_mixed_content.json new file mode 100644 index 0000000000..47c3fab535 --- /dev/null +++ b/changelog/entries/unreleased/bug/4377_fix_formulainputfield_display_with_mixed_content.json @@ -0,0 +1,9 @@ +{ + "type": "bug", + "message": "Resolved a bug which prevented formula fields from working correctly with HTML content.", + "issue_origin": "github", + "issue_number": 4377, + "domain": "core", + "bullet_points": [], + "created_at": "2025-12-03" +} diff --git a/web-frontend/modules/core/components/formula/FormulaInputContext.vue b/web-frontend/modules/core/components/formula/FormulaInputContext.vue index 5dcc91ed19..2faf541d86 100644 --- a/web-frontend/modules/core/components/formula/FormulaInputContext.vue +++ b/web-frontend/modules/core/components/formula/FormulaInputContext.vue @@ -14,7 +14,7 @@ @node-selected="$emit('node-selected', $event)" @node-unselected="$emit('node-unselected')" /> -
+
import context from '@baserow/modules/core/mixins/context' import NodeExplorer from '@baserow/modules/core/components/nodeExplorer/NodeExplorer' +import { BASEROW_FORMULA_MODES } from '@baserow/modules/core/formula/constants' export default { name: 'FormulaInputContext', @@ -87,7 +88,7 @@ export default { required: false, default: 'advanced', validator: (value) => { - return ['advanced', 'simple'].includes(value) + return BASEROW_FORMULA_MODES.includes(value) }, }, /** @@ -105,6 +106,15 @@ export default { required: false, default: false, }, + /** + * An array of Baserow formula modes which the parent formula input + * component allows to be used. By default, in `FormulaInputField`, + * we will allow all modes. + */ + enabledModes: { + type: Array, + required: true, + }, }, data() { return { @@ -118,6 +128,9 @@ export default { } }, computed: { + advancedModeEnabled() { + return this.enabledModes.includes('advanced') + }, isAdvancedMode() { return this.mode === 'advanced' }, diff --git a/web-frontend/modules/core/components/formula/FormulaInputField.vue b/web-frontend/modules/core/components/formula/FormulaInputField.vue index ca751a38d9..6b7a2df0a6 100644 --- a/web-frontend/modules/core/components/formula/FormulaInputField.vue +++ b/web-frontend/modules/core/components/formula/FormulaInputField.vue @@ -22,6 +22,7 @@ :has-value="value.length > 0" :allow-node-selection="allowNodeSelection" :nodes-hierarchy="nodesHierarchy" + :enabled-modes="enabledModes" @node-selected="handleNodeSelected" @node-unselected="unSelectNode" @mode-changed="handleModeChange" @@ -75,6 +76,7 @@ import FormulaInputContext from '@baserow/modules/core/components/formula/Formul import { isFormulaValid } from '@baserow/modules/core/formula' import NodeHelpTooltip from '@baserow/modules/core/components/nodeExplorer/NodeHelpTooltip' import { fixPropertyReactivityForProvide } from '@baserow/modules/core/utils/object' +import { BASEROW_FORMULA_MODES } from '@baserow/modules/core/formula/constants' export default { name: 'FormulaInputField', @@ -139,7 +141,7 @@ export default { required: false, default: 'simple', validator: (value) => { - return ['advanced', 'simple', 'raw'].includes(value) + return BASEROW_FORMULA_MODES.includes(value) }, }, contextPosition: { @@ -150,6 +152,15 @@ export default { return ['bottom', 'left', 'right'].includes(value) }, }, + /** + * An array of Baserow formula modes which the parent formula input + * component allows to be used. By default, we will allow all modes. + */ + enabledModes: { + type: Array, + required: false, + default: () => BASEROW_FORMULA_MODES, + }, }, data() { return { diff --git a/web-frontend/modules/core/formula/constants.js b/web-frontend/modules/core/formula/constants.js new file mode 100644 index 0000000000..300c11cd3f --- /dev/null +++ b/web-frontend/modules/core/formula/constants.js @@ -0,0 +1 @@ +export const BASEROW_FORMULA_MODES = ['raw', 'simple', 'advanced'] diff --git a/web-frontend/modules/core/runtimeFormulaTypes.js b/web-frontend/modules/core/runtimeFormulaTypes.js index 2a74268426..5b3f31a544 100644 --- a/web-frontend/modules/core/runtimeFormulaTypes.js +++ b/web-frontend/modules/core/runtimeFormulaTypes.js @@ -227,7 +227,12 @@ export class RuntimeConcat extends RuntimeFormulaFunction { if (args.every((arg, index) => index % 2 === 0 || arg.type === 'newLine')) { return args .filter((arg, index) => index % 2 === 0) // Remove the new lines elements - .map((arg) => ({ type: 'wrapper', content: [arg].flat() })) + .map((arg) => { + // If arg is already a wrapper, extract its content; otherwise wrap it + const content = + arg?.type === 'wrapper' && arg.content ? arg.content : [arg].flat() + return { type: 'wrapper', content } + }) } return { type: 'wrapper', content: args } } diff --git a/web-frontend/modules/integrations/core/components/services/CoreHTTPRequestServiceForm.vue b/web-frontend/modules/integrations/core/components/services/CoreHTTPRequestServiceForm.vue index 7ff3ea2732..0638b369b4 100644 --- a/web-frontend/modules/integrations/core/components/services/CoreHTTPRequestServiceForm.vue +++ b/web-frontend/modules/integrations/core/components/services/CoreHTTPRequestServiceForm.vue @@ -168,6 +168,11 @@ > @@ -261,6 +266,7 @@ import { helpers, } from '@vuelidate/validators' import { uuid } from '@baserow/modules/core/utils/string' +import { BASEROW_FORMULA_MODES } from '@baserow/modules/core/formula/constants' export default { name: 'CoreHTTPRequestService', @@ -295,6 +301,9 @@ export default { } }, computed: { + BASEROW_FORMULA_MODES() { + return BASEROW_FORMULA_MODES + }, methods() { return [ { name: 'GET', value: 'GET' }, diff --git a/web-frontend/modules/integrations/core/components/services/CoreSMTPEmailServiceForm.vue b/web-frontend/modules/integrations/core/components/services/CoreSMTPEmailServiceForm.vue index 7df40bd482..77d6344136 100644 --- a/web-frontend/modules/integrations/core/components/services/CoreSMTPEmailServiceForm.vue +++ b/web-frontend/modules/integrations/core/components/services/CoreSMTPEmailServiceForm.vue @@ -101,6 +101,11 @@ > @@ -113,6 +118,7 @@ import form from '@baserow/modules/core/mixins/form' import InjectedFormulaInput from '@baserow/modules/core/components/formula/InjectedFormulaInput' import IntegrationDropdown from '@baserow/modules/core/components/integrations/IntegrationDropdown' import { SMTPIntegrationType } from '@baserow/modules/integrations/core/integrationTypes' +import { BASEROW_FORMULA_MODES } from '@baserow/modules/core/formula/constants' export default { name: 'CoreSMTPEmailServiceForm', @@ -160,6 +166,9 @@ export default { } }, computed: { + BASEROW_FORMULA_MODES() { + return BASEROW_FORMULA_MODES + }, integrations() { if (!this.application) { return []