From f0734cfef4d70064dda37c5a468e4912c5d3f1d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= Date: Fri, 25 Oct 2024 15:04:41 +0200 Subject: [PATCH] variant block validation --- .../property-editor-ui-block-list.element.ts | 1 - ...y-validation-path-translator.controller.ts | 28 ------------------- ...-validation-path-translator.controller.ts} | 0 ...s-validation-path-translator.controller.ts | 17 +++++++++++ .../packages/block/block/validation/index.ts | 3 +- .../block/workspace/block-element-manager.ts | 4 +++ ...-workspace-view-edit-properties.element.ts | 26 +++++++++++++++++ ...data-path-property-value-query.function.ts | 4 +-- 8 files changed, 51 insertions(+), 32 deletions(-) delete mode 100644 src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-property-validation-path-translator.controller.ts rename src/Umbraco.Web.UI.Client/src/packages/block/block/validation/{block-data-validation-path-translator.controller.ts => block-element-data-validation-path-translator.controller.ts} (100%) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-values-validation-path-translator.controller.ts diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts index f86b7c72c3..0ceb5e7abf 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts @@ -117,7 +117,6 @@ export class UmbPropertyEditorUIBlockListElement /** * Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content. * @type {boolean} - * @attr * @default */ @property({ type: Boolean, reflect: true }) diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-property-validation-path-translator.controller.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-property-validation-path-translator.controller.ts deleted file mode 100644 index 096eec3967..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-property-validation-path-translator.controller.ts +++ /dev/null @@ -1,28 +0,0 @@ -import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; -import { - GetPropertyNameFromPath, - UmbDataPathPropertyValueQuery, - UmbValidationPathTranslatorBase, -} from '@umbraco-cms/backoffice/validation'; - -export class UmbBlockElementDataValidationPathTranslator extends UmbValidationPathTranslatorBase { - constructor(host: UmbControllerHost) { - super(host); - } - - translate(path: string) { - if (!this._context) return; - if (path.indexOf('$.') !== 0) { - // We do not handle this path. - return false; - } - - const rest = path.substring(2); - const key = GetPropertyNameFromPath(rest); - - const specificValue = { alias: key }; - // replace the values[ number ] with JSON-Path filter values[@.(...)], continues by the rest of the path: - //return '$.values' + UmbVariantValuesValidationPathTranslator(specificValue) + path.substring(path.indexOf(']')); - return '$.values[' + UmbDataPathPropertyValueQuery(specificValue) + '.value'; - } -} diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-validation-path-translator.controller.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-data-validation-path-translator.controller.ts similarity index 100% rename from src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-data-validation-path-translator.controller.ts rename to src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-data-validation-path-translator.controller.ts diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-values-validation-path-translator.controller.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-values-validation-path-translator.controller.ts new file mode 100644 index 0000000000..2c2b9da88c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/block-element-values-validation-path-translator.controller.ts @@ -0,0 +1,17 @@ +import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; +import { + UmbAbstractArrayValidationPathTranslator, + UmbDataPathPropertyValueQuery, +} from '@umbraco-cms/backoffice/validation'; + +export class UmbBlockElementValuesDataValidationPathTranslator extends UmbAbstractArrayValidationPathTranslator { + constructor(host: UmbControllerHost) { + super(host, '$.values[', UmbDataPathPropertyValueQuery); + } + + getDataFromIndex(index: number) { + if (!this._context) return; + const data = this._context.getTranslationData(); + return data.values[index]; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/index.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/index.ts index 331352a0d8..f2af316128 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/validation/index.ts @@ -1,2 +1,3 @@ -export * from './block-data-validation-path-translator.controller.js'; +export * from './block-element-values-validation-path-translator.controller.js'; +export * from './block-element-data-validation-path-translator.controller.js'; export * from './data-path-element-data-query.function.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-element-manager.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-element-manager.ts index 65af1b54db..a0b151ab9b 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-element-manager.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-element-manager.ts @@ -1,4 +1,5 @@ import type { UmbBlockDataModel, UmbBlockDataValueModel, UmbBlockLayoutBaseModel } from '../types.js'; +import { UmbBlockElementValuesDataValidationPathTranslator } from '../validation/block-element-values-validation-path-translator.controller.js'; import { UmbBlockElementPropertyDatasetContext } from './block-element-property-dataset.context.js'; import type { UmbBlockWorkspaceContext } from './block-workspace.context.js'; import type { UmbContentTypeModel, UmbPropertyTypeModel } from '@umbraco-cms/backoffice/content-type'; @@ -226,6 +227,9 @@ export class UmbBlockElementManager { this.#blockWorkspace = workspaceContext; this._ownerEntityType = this.#blockWorkspace.getEntityType(); + this.observe( + workspaceContext.variantId, + (variantId) => { + this.#variantId = variantId; + this.#generatePropertyDataPath(); + }, + 'observeVariantId', + ); this.#setStructureManager(); }); } @@ -61,10 +73,24 @@ export class UmbBlockWorkspaceViewEditPropertiesElement extends UmbLitElement { ); } + /* #generatePropertyDataPath() { if (!this._propertyStructure) return; this._dataPaths = this._propertyStructure.map((property) => `$.${property.alias}`); } + */ + + #generatePropertyDataPath() { + if (!this.#variantId || !this._propertyStructure) return; + this._dataPaths = this._propertyStructure.map( + (property) => + `$.values[${UmbDataPathPropertyValueQuery({ + alias: property.alias, + culture: property.variesByCulture ? this.#variantId!.culture : null, + segment: property.variesBySegment ? this.#variantId!.segment : null, + })}].value`, + ); + } override render() { return repeat( diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/validation/utils/data-path-property-value-query.function.ts b/src/Umbraco.Web.UI.Client/src/packages/core/validation/utils/data-path-property-value-query.function.ts index d184f6e205..438b6e2d6e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/validation/utils/data-path-property-value-query.function.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/validation/utils/data-path-property-value-query.function.ts @@ -5,8 +5,8 @@ import type { UmbVariantPropertyValueModel } from '@umbraco-cms/backoffice/varia * Validation Data Path Query generator for Property Value. * write a JSON-Path filter similar to `?(@.alias = 'myAlias' && @.culture == 'en-us' && @.segment == 'mySegment')` * where culture and segment are optional - * @param value - * @returns + * @param {UmbVariantPropertyValueModel} value - the object holding value and alias. + * @returns {string} - a JSON-path query */ export function UmbDataPathPropertyValueQuery( value: UmbPartialSome, 'culture' | 'segment'>,