Merge pull request #17804 from umbraco/v15/hotfix/rte-blocks

V15: RTE blocks do not work in an empty RTE editor
This commit is contained in:
Niels Lyngsø
2024-12-12 12:53:48 +01:00
committed by GitHub

View File

@@ -10,11 +10,10 @@ import type {
import {
UmbBlockRteEntriesContext,
UmbBlockRteManagerContext,
type UmbBlockRteLayoutModel,
type UmbBlockRteTypeModel,
} from '@umbraco-cms/backoffice/block-rte';
import { UMB_PROPERTY_CONTEXT, UMB_PROPERTY_DATASET_CONTEXT } from '@umbraco-cms/backoffice/property';
import type { UmbBlockValueType } from '@umbraco-cms/backoffice/block';
import { observeMultiple } from '@umbraco-cms/backoffice/observable-api';
// eslint-disable-next-line local-rules/enforce-element-suffix-on-element-class-name
export abstract class UmbPropertyEditorUiRteElementBase extends UmbLitElement implements UmbPropertyEditorUiElement {
@@ -39,7 +38,7 @@ export abstract class UmbPropertyEditorUiRteElementBase extends UmbLitElement im
public set value(value: UmbPropertyEditorUiValueType | undefined) {
if (!value) {
this._value = undefined;
this._markup = '';
this._markup = this._latestMarkup = '';
this.#managerContext.setLayouts([]);
this.#managerContext.setContents([]);
this.#managerContext.setSettings([]);
@@ -134,30 +133,38 @@ export abstract class UmbPropertyEditorUiRteElementBase extends UmbLitElement im
this.#managerContext.setLayouts(layouts);
});
// Observe the value of the property and update the editor value.
this.observe(this.#managerContext.layouts, (layouts) => {
const blocksValue =
this._value && layouts?.length > 0
? { ...this._value.blocks, layout: { [UMB_BLOCK_RTE_PROPERTY_EDITOR_SCHEMA_ALIAS]: layouts } }
: undefined;
this.observe(
observeMultiple([
this.#managerContext.layouts,
this.#managerContext.contents,
this.#managerContext.settings,
this.#managerContext.exposes,
]),
([layouts, contents, settings, exposes]) => {
if (layouts.length === 0) {
this._value = undefined;
} else {
this._value = {
markup: this._latestMarkup,
blocks: {
layout: { [UMB_BLOCK_RTE_PROPERTY_EDITOR_SCHEMA_ALIAS]: layouts },
contentData: contents,
settingsData: settings,
expose: exposes,
},
};
}
this.#setBlocksValue(blocksValue);
});
// If we don't have a value set from the outside or an internal value, we don't want to set the value.
// This is added to prevent the block list from setting an empty value on startup.
if (!this._latestMarkup && !this._value?.markup) {
return;
}
this.observe(this.#managerContext.contents, (contents) => {
const blocksValue = this._value ? { ...this._value.blocks, contentData: contents } : undefined;
this.#setBlocksValue(blocksValue);
});
this.observe(this.#managerContext.settings, (settings) => {
const blocksValue = this._value ? { ...this._value.blocks, settingsData: settings } : undefined;
this.#setBlocksValue(blocksValue);
});
this.observe(this.#managerContext.exposes, (exposes) => {
const blocksValue = this._value ? { ...this._value.blocks, expose: exposes } : undefined;
this.#setBlocksValue(blocksValue);
});
context.setValue(this._value);
},
'motherObserver',
);
});
this.consumeContext(UMB_PROPERTY_DATASET_CONTEXT, (context) => {
@@ -181,19 +188,6 @@ export abstract class UmbPropertyEditorUiRteElementBase extends UmbLitElement im
});
}
#setBlocksValue(blocksValue?: UmbBlockValueType<UmbBlockRteLayoutModel>) {
if (!blocksValue || !this._value) {
return;
}
this._value = {
...this._value,
blocks: blocksValue,
};
this._fireChangeEvent();
}
protected _fireChangeEvent() {
this.dispatchEvent(new UmbPropertyValueChangeEvent());
}