yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

render property editor config

Browse Source
This commit is contained in:
Mads Rasmussen
2023-10-17 11:06:01 +02:00
parent 6aeb85d4ae
commit 3548fce534
1 changed files with 63 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
src/Umbraco.Web.UI.Client/src/packages/settings/data-types/workspace/data-type-workspace.context.ts
View File

@@ -1,12 +1,20 @@
import { UmbDataTypeRepository } from '../repository/data-type.repository.js';
import { UmbDataTypeVariantContext } from '../variant-context/data-type-variant-context.js';
import { UmbInvariantableWorkspaceContextInterface, UmbWorkspaceContext, UmbWorkspaceContextInterface } from '@umbraco-cms/backoffice/workspace';
import {
UmbInvariantableWorkspaceContextInterface,
UmbWorkspaceContext,
UmbWorkspaceContextInterface,
} from '@umbraco-cms/backoffice/workspace';
import type { DataTypeResponseModel } from '@umbraco-cms/backoffice/backend-api';
import { appendToFrozenArray, UmbArrayState, UmbObjectState } from '@umbraco-cms/backoffice/observable-api';
import { UmbControllerHost, UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
import { Observable, combineLatest, map } from '@umbraco-cms/backoffice/external/rxjs';
import { PropertyEditorConfigDefaultData, PropertyEditorConfigProperty, umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
import {
PropertyEditorConfigDefaultData,
PropertyEditorConfigProperty,
umbExtensionsRegistry,
} from '@umbraco-cms/backoffice/extension-registry';
import { UMB_PROPERTY_EDITOR_SCHEMA_ALIAS_DEFAULT } from '@umbraco-cms/backoffice/property-editor';
export class UmbDataTypeWorkspaceContext
@@ -30,8 +38,10 @@ export class UmbDataTypeWorkspaceContext
private _propertyEditorSchemaConfigDefaultData: Array<PropertyEditorConfigDefaultData> = [];
private _propertyEditorUISettingsDefaultData: Array<PropertyEditorConfigDefaultData> = [];
private _propertyEditorSchemaConfigProperties?: Array<PropertyEditorConfigProperty>;
private _propertyEditorUISettingsProperties?: Array<PropertyEditorConfigProperty>;
private _propertyEditorSchemaConfigProperties: Array<PropertyEditorConfigProperty> = [];
private _propertyEditorUISettingsProperties: Array<PropertyEditorConfigProperty> = [];
private _propertyEditorSchemaConfigDefaultUIAlias: string | null = null;
private _configDefaultData?: Array<PropertyEditorConfigDefaultData>;
@@ -41,53 +51,57 @@ export class UmbDataTypeWorkspaceContext
constructor(host: UmbControllerHostElement) {
super(host, 'Umb.Workspace.DataType', new UmbDataTypeRepository(host));
this.observe(this.propertyEditorUiAlias, (propertyEditorUiAlias) => {
if (!propertyEditorUiAlias) {
// No property editor ui alias, so we clean up and reset the properties.
this.removeControllerByAlias('propertyEditorUiAlias');
this._propertyEditorUISettingsProperties = [];
this._propertyEditorUISettingsDefaultData = [];
this.observe(this.propertyEditorSchemaAlias, async (propertyEditorSchemaAlias) => {
await this.#setPropertyEditorSchemaConfig(propertyEditorSchemaAlias || UMB_PROPERTY_EDITOR_SCHEMA_ALIAS_DEFAULT);
this.observe(this.propertyEditorUiAlias, async (propertyEditorUiAlias) => {
if (propertyEditorUiAlias === undefined || !this._propertyEditorSchemaConfigDefaultUIAlias) return;
const alias =
propertyEditorUiAlias === null ? this._propertyEditorSchemaConfigDefaultUIAlias : propertyEditorUiAlias;
await this.#setPropertyEditorUIConfig(alias);
this._mergeConfigProperties();
this._mergeConfigDefaultData();
return;
}
this.observe(
umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUi', propertyEditorUiAlias),
(manifest) => {
this._observePropertyEditorSchemaConfig(
manifest?.meta.propertyEditorSchemaAlias || UMB_PROPERTY_EDITOR_SCHEMA_ALIAS_DEFAULT
);
this._propertyEditorUISettingsProperties = manifest?.meta.settings?.properties || [];
this._propertyEditorUISettingsDefaultData = manifest?.meta.settings?.defaultData || [];
this._mergeConfigProperties();
this._mergeConfigDefaultData();
}
, 'observePropertyEditorUiAlias'
);
});
});
}
private _observePropertyEditorSchemaConfig(propertyEditorSchemaAlias: string) {
this.observe(
#setPropertyEditorSchemaConfig(propertyEditorSchemaAlias: string) {
return this.observe(
umbExtensionsRegistry.getByTypeAndAlias('propertyEditorSchema', propertyEditorSchemaAlias),
(manifest) => {
this._propertyEditorSchemaConfigProperties = manifest?.meta.settings?.properties || [];
this._propertyEditorSchemaConfigDefaultData = manifest?.meta.settings?.defaultData || [];
this._mergeConfigProperties();
this._mergeConfigDefaultData();
}
);
this._propertyEditorSchemaConfigDefaultUIAlias = manifest?.meta.defaultPropertyEditorUiAlias || null;
},
).asPromise();
}
#setPropertyEditorUIConfig(propertyEditorUIAlias: string) {
return this.observe(
umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUi', propertyEditorUIAlias),
(manifest) => {
this._propertyEditorUISettingsProperties = manifest?.meta.settings?.properties || [];
this._propertyEditorUISettingsDefaultData = manifest?.meta.settings?.defaultData || [];
},
).asPromise();
}
private _mergeConfigProperties() {
if(this._propertyEditorSchemaConfigProperties && this._propertyEditorUISettingsProperties) {
this.#properties.next([...this._propertyEditorSchemaConfigProperties, ...this._propertyEditorUISettingsProperties]);
console.log('schema properties', this._propertyEditorSchemaConfigProperties);
console.log('ui properties', this._propertyEditorUISettingsProperties);
if (this._propertyEditorSchemaConfigProperties && this._propertyEditorUISettingsProperties) {
this.#properties.next([
...this._propertyEditorSchemaConfigProperties,
...this._propertyEditorUISettingsProperties,
]);
}
}
private _mergeConfigDefaultData() {
if(!this._propertyEditorSchemaConfigDefaultData || !this._propertyEditorUISettingsDefaultData) return;
if (!this._propertyEditorSchemaConfigDefaultData || !this._propertyEditorUISettingsDefaultData) return;
this._configDefaultData = [
...this._propertyEditorSchemaConfigDefaultData,
@@ -159,17 +173,22 @@ export class UmbDataTypeWorkspaceContext
return combineLatest([
this.#data.asObservablePart((data) => data?.values?.find((x) => x.alias === propertyAlias)?.value as ReturnType),
this.#defaults.asObservablePart((defaults) => defaults?.find((x) => x.alias === propertyAlias)?.value as ReturnType),
this.#defaults.asObservablePart(
(defaults) => defaults?.find((x) => x.alias === propertyAlias)?.value as ReturnType,
),
]).pipe(
map(([value, defaultValue]) => {
return (value ?? defaultValue);
})
return value ?? defaultValue;
}),
);
//return this.#data.asObservablePart((data) => data?.values?.find((x) => x.alias === propertyAlias)?.value ?? this.getPropertyDefaultValue(propertyAlias) as ReturnType);
}
getPropertyValue<ReturnType = unknown>(propertyAlias: string) {
return this.#data.getValue()?.values?.find((x) => x.alias === propertyAlias)?.value as ReturnType ?? this.getPropertyDefaultValue(propertyAlias) as ReturnType;
return (
(this.#data.getValue()?.values?.find((x) => x.alias === propertyAlias)?.value as ReturnType) ??
(this.getPropertyDefaultValue(propertyAlias) as ReturnType)
);
}
// TODO: its not called a property in the model, but we do consider this way in our front-end
@@ -207,7 +226,10 @@ export class UmbDataTypeWorkspaceContext
}
}
export const UMB_DATA_TYPE_WORKSPACE_CONTEXT = new UmbContextToken<UmbWorkspaceContextInterface, UmbDataTypeWorkspaceContext>(
export const UMB_DATA_TYPE_WORKSPACE_CONTEXT = new UmbContextToken<
UmbWorkspaceContextInterface,
UmbDataTypeWorkspaceContext
>(
'UmbWorkspaceContext',
(context): context is UmbDataTypeWorkspaceContext => context.getEntityType?.() === 'data-type'
(context): context is UmbDataTypeWorkspaceContext => context.getEntityType?.() === 'data-type',
);