diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/property/property/property.context.ts b/src/Umbraco.Web.UI.Client/src/packages/core/property/property/property.context.ts index 06a55cd665..cbcc12c283 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/property/property/property.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/property/property/property.context.ts @@ -1,29 +1,35 @@ import { UmbPropertyEditorUiElement } from '../../extension-registry/interfaces/property-editor-ui-element.interface.js'; -import { type WorkspacePropertyData } from '../../workspace/types/workspace-property-data.type.js'; import { UMB_PROPERTY_DATASET_CONTEXT } from '@umbraco-cms/backoffice/property'; import { UmbVariantId } from '@umbraco-cms/backoffice/variant'; import { type UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api'; import { UmbBaseController } from '@umbraco-cms/backoffice/class-api'; import { + UmbArrayState, UmbBasicState, UmbClassState, - UmbObjectState, + UmbDeepState, UmbObserverController, UmbStringState, } from '@umbraco-cms/backoffice/observable-api'; import { UmbContextProviderController, UmbContextToken } from '@umbraco-cms/backoffice/context-api'; -import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; +import { + UmbPropertyEditorConfigCollection, + UmbPropertyEditorConfigProperty, +} from '@umbraco-cms/backoffice/property-editor'; export class UmbPropertyContext extends UmbBaseController { private _providerController: UmbContextProviderController; - #data = new UmbObjectState>({}); - - public readonly alias = this.#data.asObservablePart((data) => data.alias); - public readonly label = this.#data.asObservablePart((data) => data.label); - public readonly description = this.#data.asObservablePart((data) => data.description); - public readonly value = this.#data.asObservablePart((data) => data.value); - public readonly configValues = this.#data.asObservablePart((data) => data.config); + #alias = new UmbStringState(undefined); + public readonly alias = this.#alias.asObservable(); + #label = new UmbStringState(undefined); + public readonly label = this.#label.asObservable(); + #description = new UmbStringState(undefined); + public readonly description = this.#description.asObservable(); + #value = new UmbDeepState(undefined); + public readonly value = this.#value.asObservable(); + #configValues = new UmbArrayState([], (x) => x.alias); + public readonly configValues = this.#configValues.asObservable(); #configCollection = new UmbClassState(undefined); public readonly config = this.#configCollection.asObservable(); @@ -73,7 +79,7 @@ export class UmbPropertyContext extends UmbBaseController { private _observePropertyVariant?: UmbObserverController; private _observePropertyValue?: UmbObserverController; private async _observeProperty() { - const alias = this.#data.getValue().alias; + const alias = this.#alias.getValue(); if (!this.#datasetContext || !alias) return; const variantIdSubject = (await this.#datasetContext.propertyVariantId?.(alias)) ?? undefined; @@ -91,7 +97,7 @@ export class UmbPropertyContext extends UmbBaseController { if (subject) { this._observePropertyValue = this.observe(subject, (value) => { // Note: Do not try to compare new / old value, as it can of any type. We trust the UmbObjectState in doing such. - this.#data.update({ value }); + this.#value.next(value); }); } } @@ -104,21 +110,21 @@ export class UmbPropertyContext extends UmbBaseController { ); } - public setAlias(alias: WorkspacePropertyData['alias']) { - this.#data.update({ alias }); + public setAlias(alias: string | undefined) { + this.#alias.next(alias); } - public setLabel(label: WorkspacePropertyData['label']) { - this.#data.update({ label }); + public setLabel(label: string | undefined) { + this.#label.next(label); } - public setDescription(description: WorkspacePropertyData['description']) { - this.#data.update({ description }); + public setDescription(description: string | undefined) { + this.#description.next(description); } /** * Set the value of this property. * @param value {ValueType} the whole value to be set */ - public setValue(value: WorkspacePropertyData['value']) { - const alias = this.#data.getValue().alias; + public setValue(value: ValueType | undefined) { + const alias = this.#alias.getValue(); if (!this.#datasetContext || !alias) return; this.#datasetContext?.setPropertyValue(alias, value); } @@ -127,11 +133,11 @@ export class UmbPropertyContext extends UmbBaseController { * Notice this is not reactive, you should us the `value` observable for that. * @returns {ValueType} */ - public getValue(): WorkspacePropertyData['value'] { - return this.#data.getValue().value; + public getValue() { + return this.#value.getValue(); } - public setConfig(config: WorkspacePropertyData['config'] | undefined) { - this.#data.update({ config }); + public setConfig(config: Array | undefined) { + this.#configValues.next(config ?? []); } public setVariantId(variantId: UmbVariantId | undefined) { this.#variantId.next(variantId); @@ -141,11 +147,16 @@ export class UmbPropertyContext extends UmbBaseController { } public resetValue() { - this.setValue(null); // TODO: We should get the default value from Property Editor maybe even later the DocumentType, as that would hold the default value for the property. + this.setValue(undefined); // TODO: We should get the default value from Property Editor maybe even later the DocumentType, as that would hold the default value for the property. } public destroy(): void { - this.#data.destroy(); + this.#alias.destroy(); + this.#label.destroy(); + this.#description.destroy(); + this.#configValues.destroy(); + this.#value.destroy(); + this.#configCollection.destroy(); this._providerController.destroy(); // This would also be handled by the controller host, but if someone wanted to replace/remove this context without the host being destroyed. Then we have clean up out selfs here. } } diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/index.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/index.ts deleted file mode 100644 index f4b7b580b6..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './workspace-property-data.type.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/workspace-property-data.type.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/workspace-property-data.type.ts deleted file mode 100644 index 6773a83e5b..0000000000 --- a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/types/workspace-property-data.type.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { type UmbPropertyEditorConfig } from '../../property-editor/index.js'; - -export type WorkspacePropertyData = { - alias?: string; - label?: string; - description?: string; - value?: ValueType | null; - config?: UmbPropertyEditorConfig; // This could potentially then come from hardcoded JS object and not the DataType store. -};