From a14227ce324a108e5bfa0f5a80108e4da87d88ac Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Wed, 19 Oct 2022 12:21:57 +0200 Subject: [PATCH] import extension registry singleton instead of consuming through context api --- src/Umbraco.Web.UI.Client/src/app.ts | 9 ++--- .../src/backoffice/backoffice.element.ts | 8 +---- .../entity-property.element.ts | 19 +++-------- .../node-property/node-property.element.ts | 12 +++---- .../editor-view-data-type-edit.element.ts | 25 ++++++-------- .../extensions/editor-extensions.element.ts | 21 ++++-------- .../editor-entity-layout.element.ts | 26 +++++---------- .../editor-entity/editor-entity.element.ts | 22 ++++++------- .../property-action-menu.element.ts | 33 +++++++------------ .../property-editor-config.element.ts | 15 ++++----- .../packages-installed-item.element.ts | 14 ++++---- .../section-dashboards.element.ts | 16 +++------ .../section-trees/section-trees.element.ts | 12 +++---- .../section-views/section-views.element.ts | 13 ++------ .../sections/shared/section.element.ts | 15 ++++----- ...e-context-menu-page-action-list.element.ts | 16 +++------ .../backoffice/trees/shared/tree.element.ts | 16 ++++----- ...ayout-property-editor-ui-picker.element.ts | 20 +++-------- .../src/core/stores/section.store.ts | 11 ++----- 19 files changed, 111 insertions(+), 212 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/app.ts b/src/Umbraco.Web.UI.Client/src/app.ts index 765e71c826..adfe32efc3 100644 --- a/src/Umbraco.Web.UI.Client/src/app.ts +++ b/src/Umbraco.Web.UI.Client/src/app.ts @@ -12,9 +12,9 @@ import { css, html, LitElement } from 'lit'; import { customElement, state } from 'lit/decorators.js'; import type { Guard, IRoute } from 'router-slot/model'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { internalManifests } from './temp-internal-manifests'; import { getManifests, getServerStatus } from '@umbraco-cms/backend-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextProviderMixin } from '@umbraco-cms/context-api'; import type { ServerStatus } from '@umbraco-cms/models'; @@ -56,7 +56,6 @@ export class UmbApp extends UmbContextProviderMixin(LitElement) { }, ]; - private _extensionRegistry = new UmbExtensionRegistry(); private _iconRegistry = new UUIIconRegistryEssential(); private _serverStatus: ServerStatus = 'running'; @@ -67,8 +66,6 @@ export class UmbApp extends UmbContextProviderMixin(LitElement) { private async _setup() { this._iconRegistry.attach(this); - this.provideContext('umbExtensionRegistry', this._extensionRegistry); - await this._registerExtensionManifestsFromServer(); await this._registerInternalManifests(); await this._setInitStatus(); @@ -129,12 +126,12 @@ export class UmbApp extends UmbContextProviderMixin(LitElement) { private async _registerExtensionManifestsFromServer() { const res = await getManifests({}); const { manifests } = res.data; - manifests.forEach((manifest) => this._extensionRegistry.register(manifest)); + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); } private async _registerInternalManifests() { // TODO: where do we get these from? - internalManifests.forEach((manifest) => this._extensionRegistry.register(manifest)); + internalManifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); } render() { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts index 7727033534..8b5a339acf 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts @@ -49,7 +49,6 @@ export class UmbBackofficeElement extends UmbContextConsumerMixin(UmbContextProv private _umbIconRegistry = new UmbIconStore(); private _umbEntityStore = new UmbEntityStore(); - private _umbSectionStore?: UmbSectionStore; constructor() { super(); @@ -66,12 +65,7 @@ export class UmbBackofficeElement extends UmbContextConsumerMixin(UmbContextProv this.provideContext('umbPropertyEditorConfigStore', new UmbPropertyEditorConfigStore()); this.provideContext('umbNotificationService', new UmbNotificationService()); this.provideContext('umbModalService', new UmbModalService()); - - // TODO: how do we want to handle context aware DI? - this.consumeContext('umbExtensionRegistry', (extensionRegistry) => { - this._umbSectionStore = new UmbSectionStore(extensionRegistry); - this.provideContext('umbSectionStore', this._umbSectionStore); - }); + this.provideContext('umbSectionStore', new UmbSectionStore()); } render() { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/components/entity-property/entity-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/components/entity-property/entity-property.element.ts index 7682252e6c..03a6d05e01 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/components/entity-property/entity-property.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/components/entity-property/entity-property.element.ts @@ -2,7 +2,8 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { css, html, LitElement, PropertyValueMap } from 'lit'; import { customElement, property, state } from 'lit/decorators.js'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { createExtensionElement } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestPropertyEditorUI, ManifestTypes } from '@umbraco-cms/models'; @@ -113,26 +114,14 @@ export class UmbEntityPropertyElement extends UmbContextConsumerMixin(UmbObserve @state() private _element?: { value?: any; config?: any } & HTMLElement; // TODO: invent interface for propertyEditorUI. - private _extensionRegistry?: UmbExtensionRegistry; - - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (_instance: UmbExtensionRegistry) => { - this._extensionRegistry = _instance; - this._observePropertyEditorUI(); - }); - } - connectedCallback(): void { super.connectedCallback(); + this._observePropertyEditorUI(); this.addEventListener('property-editor-change', this._onPropertyEditorChange as any as EventListener); } private _observePropertyEditorUI() { - if (!this._extensionRegistry) return; - - this.observe(this._extensionRegistry.getByAlias(this.propertyEditorUIAlias), (manifest) => { + this.observe(umbExtensionsRegistry.getByAlias(this.propertyEditorUIAlias), (manifest) => { if (manifest?.type === 'propertyEditorUI') { this._gotData(manifest); } diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/components/node-property/node-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/components/node-property/node-property.element.ts index 861f53a3cf..b7b5a58bb5 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/components/node-property/node-property.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/components/node-property/node-property.element.ts @@ -8,7 +8,7 @@ import { UmbDataTypeStore } from '../../../core/stores/data-type/data-type.store import { NodeProperty } from '../../../core/mocks/data/node.data'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; import type { ManifestTypes } from '@umbraco-cms/models'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import '../entity-property/entity-property.element'; @@ -43,28 +43,26 @@ export class UmbNodePropertyElement extends UmbContextConsumerMixin(UmbObserverM @state() private _dataTypeData?: any; - private _extensionRegistry?: UmbExtensionRegistry; private _dataTypeStore?: UmbDataTypeStore; constructor() { super(); - this.consumeAllContexts(['umbDataTypeStore', 'umbExtensionRegistry'], (instances) => { - this._extensionRegistry = instances['umbExtensionRegistry']; - this._dataTypeStore = instances['umbDataTypeStore']; + this.consumeContext('umbDataTypeStore', (instance) => { + this._dataTypeStore = instance; this._observeDataType(); }); } private _observeDataType() { - if (!this._dataTypeStore || !this._extensionRegistry || !this._property) return; + if (!this._dataTypeStore || !this._property) return; this.observe( this._dataTypeStore.getByKey(this._property.dataTypeKey).pipe( switchMap((dataType) => { if (!dataType?.propertyEditorUIAlias) return EMPTY; this._dataTypeData = dataType.data; - return this._extensionRegistry?.getByAlias(dataType.propertyEditorUIAlias) ?? of(null); + return umbExtensionsRegistry.getByAlias(dataType.propertyEditorUIAlias) ?? of(null); }) ), (manifest) => { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/data-type/views/edit/editor-view-data-type-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/data-type/views/edit/editor-view-data-type-edit.element.ts index 88a1cfd2d0..1d52007039 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/data-type/views/edit/editor-view-data-type-edit.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/data-type/views/edit/editor-view-data-type-edit.element.ts @@ -6,9 +6,9 @@ import { UmbDataTypeContext } from '../../data-type.context'; import type { DataTypeDetails } from '../../../../../core/mocks/data/data-type.data'; import type { UmbPropertyEditorStore } from '../../../../../core/stores/property-editor/property-editor.store'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import type { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestPropertyEditorUI } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import '../../../../property-editor-uis/shared/property-editor-config/property-editor-config.element'; @@ -35,27 +35,22 @@ export class UmbEditorViewDataTypeEditElement extends UmbContextConsumerMixin(Um private _data: Array = []; private _dataTypeContext?: UmbDataTypeContext; - private _extensionRegistry?: UmbExtensionRegistry; private _propertyEditorStore?: UmbPropertyEditorStore; private _modalService?: UmbModalService; constructor() { super(); - this.consumeAllContexts( - ['umbDataTypeContext', 'umbPropertyEditorStore', 'umbExtensionRegistry', 'umbModalService'], - (result) => { - this._dataTypeContext = result['umbDataTypeContext']; - this._propertyEditorStore = result['umbPropertyEditorStore']; - this._extensionRegistry = result['umbExtensionRegistry']; - this._modalService = result['umbModalService']; - this._observeDataType(); - } - ); + this.consumeAllContexts(['umbDataTypeContext', 'umbPropertyEditorStore', 'umbModalService'], (result) => { + this._dataTypeContext = result['umbDataTypeContext']; + this._propertyEditorStore = result['umbPropertyEditorStore']; + this._modalService = result['umbModalService']; + this._observeDataType(); + }); } private _observeDataType() { - if (!this._dataTypeContext || !this._propertyEditorStore || !this._extensionRegistry) return; + if (!this._dataTypeContext || !this._propertyEditorStore) return; this.observe(this._dataTypeContext.data, (dataType) => { this._dataType = dataType; @@ -77,10 +72,10 @@ export class UmbEditorViewDataTypeEditElement extends UmbContextConsumerMixin(Um } private _observePropertyEditorUI(propertyEditorUIAlias: string | null) { - if (!propertyEditorUIAlias || !this._extensionRegistry) return; + if (!propertyEditorUIAlias) return; this.observe( - this._extensionRegistry?.getByAlias(propertyEditorUIAlias), + umbExtensionsRegistry.getByAlias(propertyEditorUIAlias), (propertyEditorUI) => { this._propertyEditorUIName = propertyEditorUI?.meta.label ?? propertyEditorUI?.name ?? ''; this._propertyEditorUIAlias = propertyEditorUI?.alias ?? ''; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/extensions/editor-extensions.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/extensions/editor-extensions.element.ts index f96be0a497..1914ae1153 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/extensions/editor-extensions.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/extensions/editor-extensions.element.ts @@ -1,7 +1,8 @@ import { html, LitElement } from 'lit'; import { customElement, state } from 'lit/decorators.js'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry, isManifestElementType } from '@umbraco-cms/extensions-api'; +import { isManifestElementType } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestTypes } from '@umbraco-cms/models'; @@ -12,22 +13,14 @@ export class UmbEditorExtensionsElement extends UmbContextConsumerMixin(UmbObser @state() private _extensions: Array = []; - private _extensionRegistry?: UmbExtensionRegistry; - - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (_instance: UmbExtensionRegistry) => { - this._extensionRegistry = _instance; - this._observeExtensions(); - }); + connectedCallback(): void { + super.connectedCallback(); + this._observeExtensions(); } private _observeExtensions() { - if (!this._extensionRegistry) return; - - this.observe>(this._extensionRegistry.extensions, (extensions) => { - this._extensions = [...extensions]; // TODO: Though, this is a shallow clone, wouldn't we either do a deep clone or no clone at all? + this.observe>(umbExtensionsRegistry.extensions, (extensions) => { + this._extensions = [...extensions]; }); } diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts index e374da08b7..2ff1d4507e 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts @@ -5,7 +5,8 @@ import { IRoute, IRoutingInfo, PageComponent, RouterSlot } from 'router-slot'; import { map } from 'rxjs'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { createExtensionElement } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestEditorAction, ManifestEditorView } from '@umbraco-cms/models'; @@ -97,30 +98,21 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(UmbObserverMi @state() private _routes: Array = []; - private _extensionRegistry?: UmbExtensionRegistry; private _routerFolder = ''; - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (extensionRegistry: UmbExtensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observeEditorViews(); - this._observeEditorActions(); - }); - } - connectedCallback(): void { super.connectedCallback(); + + this._observeEditorViews(); + this._observeEditorActions(); + /* TODO: find a way to construct absolute urls */ this._routerFolder = window.location.pathname.split('/view')[0]; } private _observeEditorViews() { - if (!this._extensionRegistry) return; - this.observe( - this._extensionRegistry + umbExtensionsRegistry .extensionsOfType('editorView') .pipe(map((extensions) => extensions.filter((extension) => extension.meta.editors.includes(this.alias)))), (editorViews) => { @@ -131,10 +123,8 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(UmbObserverMi } private _observeEditorActions() { - if (!this._extensionRegistry) return; - this.observe( - this._extensionRegistry + umbExtensionsRegistry ?.extensionsOfType('editorAction') .pipe(map((extensions) => extensions.filter((extension) => extension.meta.editors.includes(this.alias)))), (editorActions) => { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity/editor-entity.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity/editor-entity.element.ts index e52ce4bcbe..9c5564500c 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity/editor-entity.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity/editor-entity.element.ts @@ -4,7 +4,8 @@ import { customElement, property, state } from 'lit/decorators.js'; import { map } from 'rxjs'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { createExtensionElement } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestEditor } from '@umbraco-cms/models'; @@ -37,25 +38,22 @@ export class UmbEditorEntityElement extends UmbContextConsumerMixin(UmbObserverM @state() private _element?: any; - private _extensionRegistry?: UmbExtensionRegistry; + private _currentEditorAlias = ''; - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (extensionRegistry: UmbExtensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observeEditors(); - }); + connectedCallback(): void { + super.connectedCallback(); + this._observeEditors(); } private _observeEditors() { - if (!this._extensionRegistry) return; - this.observe( - this._extensionRegistry + umbExtensionsRegistry .extensionsOfType('editor') .pipe(map((editors) => editors.find((editor) => editor.meta.entityType === this.entityType))), (editor) => { + // don't rerender editor if it's the same + if (this._currentEditorAlias === editor.alias) return; + this._currentEditorAlias = editor.alias; this._createElement(editor); } ); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/property-actions/shared/property-action-menu/property-action-menu.element.ts index a7923535d6..3e3585015a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/property-actions/shared/property-action-menu/property-action-menu.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/property-actions/shared/property-action-menu/property-action-menu.element.ts @@ -4,10 +4,9 @@ import { map } from 'rxjs'; import { UUITextStyles } from '@umbraco-ui/uui'; import { UmbPropertyActionMenuContext } from './property-action-menu.context'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; - import { UmbContextProviderMixin, UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestPropertyAction } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import '../property-action/property-action.element'; @@ -57,33 +56,20 @@ export class UmbPropertyActionMenuElement extends UmbContextProviderMixin( @state() private _open = false; - private _extensionRegistry?: UmbExtensionRegistry; private _propertyActionMenuContext = new UmbPropertyActionMenuContext(); - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (extensionRegistry: UmbExtensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observePropertyActions(); - }); - - this.provideContext('umbPropertyActionMenu', this._propertyActionMenuContext); - } - connectedCallback(): void { super.connectedCallback(); - this.observe(this._propertyActionMenuContext.isOpen, (value) => { - this._open = value; - }); + this._observePropertyActions(); + this._observePropertyActionMenuOpenState(); + + this.provideContext('umbPropertyActionMenu', this._propertyActionMenuContext); } private _observePropertyActions() { - if (!this._extensionRegistry) return; - this.observe( - this._extensionRegistry + umbExtensionsRegistry .extensionsOfType('propertyAction') .pipe( map((propertyActions) => @@ -98,8 +84,13 @@ export class UmbPropertyActionMenuElement extends UmbContextProviderMixin( ); } + private _observePropertyActionMenuOpenState() { + this.observe(this._propertyActionMenuContext.isOpen, (value) => { + this._open = value; + }); + } + private _toggleMenu() { - //this._open = !this._open; this._open ? this._propertyActionMenuContext.close() : this._propertyActionMenuContext.open(); } diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/property-editor-uis/shared/property-editor-config/property-editor-config.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/property-editor-uis/shared/property-editor-config/property-editor-config.element.ts index d89f3bcddd..50c66c468a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/property-editor-uis/shared/property-editor-config/property-editor-config.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/property-editor-uis/shared/property-editor-config/property-editor-config.element.ts @@ -7,9 +7,9 @@ import { UmbPropertyEditorConfigStore, } from '../../../../core/stores/property-editor-config/property-editor-config.store'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestTypes, PropertyEditorConfigDefaultData, PropertyEditorConfigProperty } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import '../../../components/entity-property/entity-property.element'; @@ -79,7 +79,6 @@ export class UmbPropertyEditorConfigElement extends UmbContextConsumerMixin(UmbO private _propertyEditorUIConfigProperties: Array = []; private _propertyEditorConfigStore?: UmbPropertyEditorConfigStore; - private _extensionRegistry?: UmbExtensionRegistry; constructor() { super(); @@ -88,11 +87,11 @@ export class UmbPropertyEditorConfigElement extends UmbContextConsumerMixin(UmbO this._propertyEditorConfigStore = propertyEditorConfigStore; this._observePropertyEditorConfig(); }); + } - this.consumeContext('umbExtensionRegistry', (extensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observePropertyEditorUIConfig(); - }); + connectedCallback(): void { + super.connectedCallback(); + this._observePropertyEditorUIConfig(); } private _observePropertyEditorConfig() { @@ -111,9 +110,9 @@ export class UmbPropertyEditorConfigElement extends UmbContextConsumerMixin(UmbO } private _observePropertyEditorUIConfig() { - if (!this._extensionRegistry || !this._propertyEditorUIAlias) return; + if (!this._propertyEditorUIAlias) return; - this.observe(this._extensionRegistry.getByAlias(this.propertyEditorUIAlias), (manifest) => { + this.observe(umbExtensionsRegistry.getByAlias(this.propertyEditorUIAlias), (manifest) => { if (manifest?.type === 'propertyEditorUI') { this._propertyEditorUIConfigProperties = manifest?.meta.config?.properties || []; this._mergeProperties(); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/packages-installed-item.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/packages-installed-item.element.ts index f675fe20ef..2466681586 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/packages-installed-item.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/packages-installed-item.element.ts @@ -7,6 +7,7 @@ import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/exten import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestPackageView, PackageInstalled } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-packages-installed-item') export class UmbPackagesInstalledItem extends UmbContextConsumerMixin(LitElement) { @@ -22,19 +23,18 @@ export class UmbPackagesInstalledItem extends UmbContextConsumerMixin(LitElement constructor() { super(); - this.consumeContext('umbExtensionRegistry', (umbExtensionRegistry: UmbExtensionRegistry) => { - this._umbExtensionRegistry = umbExtensionRegistry; - - this.findPackageView(this.package.alias); - }); - this.consumeContext('umbModalService', (modalService: UmbModalService) => { this._umbModalService = modalService; }); } + connectedCallback(): void { + super.connectedCallback(); + this.findPackageView(this.package.alias); + } + private async findPackageView(alias: string) { - const observable = this._umbExtensionRegistry + const observable = umbExtensionsRegistry ?.extensionsOfType('packageView') .pipe(map((e) => e.filter((m) => m.meta.packageAlias === alias))); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-dashboards/section-dashboards.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-dashboards/section-dashboards.element.ts index 3bfdb59c09..89574d7c01 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-dashboards/section-dashboards.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-dashboards/section-dashboards.element.ts @@ -3,13 +3,12 @@ import { css, html, LitElement, nothing } from 'lit'; import { customElement, state } from 'lit/decorators.js'; import { IRoutingInfo } from 'router-slot'; import { first, map } from 'rxjs'; - import { UmbSectionContext } from '../../section.context'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { createExtensionElement } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; - import type { ManifestDashboard, ManifestSection } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-section-dashboards') export class UmbSectionDashboardsElement extends UmbContextConsumerMixin(UmbObserverMixin(LitElement)) { @@ -55,18 +54,11 @@ export class UmbSectionDashboardsElement extends UmbContextConsumerMixin(UmbObse private _currentSectionPathname = ''; private _currentSectionAlias = ''; - - private _extensionRegistry?: UmbExtensionRegistry; private _sectionContext?: UmbSectionContext; constructor() { super(); - // TODO: wait for more contexts - this.consumeContext('umbExtensionRegistry', (_instance: UmbExtensionRegistry) => { - this._extensionRegistry = _instance; - }); - this.consumeContext('umbSectionContext', (context: UmbSectionContext) => { this._sectionContext = context; this._observeSectionContext(); @@ -84,10 +76,10 @@ export class UmbSectionDashboardsElement extends UmbContextConsumerMixin(UmbObse } private _observeDashboards() { - if (!this._extensionRegistry || !this._currentSectionAlias) return; + if (!this._currentSectionAlias) return; this.observe( - this._extensionRegistry + umbExtensionsRegistry ?.extensionsOfType('dashboard') .pipe( map((extensions) => diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-trees/section-trees.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-trees/section-trees.element.ts index 20d11fb2fe..3e9846c9eb 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-trees/section-trees.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-trees/section-trees.element.ts @@ -5,8 +5,8 @@ import { map, switchMap, EMPTY, of } from 'rxjs'; import { UmbSectionContext } from '../../section.context'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; import '../../../trees/shared/tree-extension.element'; @@ -17,21 +17,19 @@ export class UmbSectionTreesElement extends UmbContextConsumerMixin(UmbObserverM @state() private _treeAliases: Array = []; - private _extensionStore?: UmbExtensionRegistry; private _sectionContext?: UmbSectionContext; constructor() { super(); - this.consumeAllContexts(['umbExtensionRegistry', 'umbSectionContext'], (instances) => { - this._extensionStore = instances['umbExtensionRegistry']; - this._sectionContext = instances['umbSectionContext']; + this.consumeContext('umbSectionContext', (instance) => { + this._sectionContext = instance; this._observeTrees(); }); } private _observeTrees() { - if (!this._extensionStore || !this._sectionContext) return; + if (!this._sectionContext) return; this.observe( this._sectionContext?.data.pipe( @@ -39,7 +37,7 @@ export class UmbSectionTreesElement extends UmbContextConsumerMixin(UmbObserverM if (!section) return EMPTY; return ( - this._extensionStore + umbExtensionsRegistry ?.extensionsOfType('tree') .pipe( map((trees) => diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-views/section-views.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-views/section-views.element.ts index d0c9b4f2ec..762ae747e7 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-views/section-views.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section-views/section-views.element.ts @@ -3,9 +3,9 @@ import { css, html, LitElement, nothing } from 'lit'; import { customElement, state } from 'lit/decorators.js'; import { EMPTY, map, of, Subscription, switchMap } from 'rxjs'; import { UmbSectionContext } from '../../section.context'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestSectionView } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-section-views') export class UmbSectionViewsElement extends UmbContextConsumerMixin(LitElement) { @@ -37,7 +37,6 @@ export class UmbSectionViewsElement extends UmbContextConsumerMixin(LitElement) @state() private _activeView?: ManifestSectionView; - private _extensionRegistry?: UmbExtensionRegistry; private _sectionContext?: UmbSectionContext; private _viewsSubscription?: Subscription; private _activeViewSubscription?: Subscription; @@ -45,12 +44,6 @@ export class UmbSectionViewsElement extends UmbContextConsumerMixin(LitElement) constructor() { super(); - // TODO: wait for more contexts - this.consumeContext('umbExtensionRegistry', (extensionsRegistry: UmbExtensionRegistry) => { - this._extensionRegistry = extensionsRegistry; - this._observeViews(); - }); - this.consumeContext('umbSectionContext', (sectionContext: UmbSectionContext) => { this._sectionContext = sectionContext; this._observeViews(); @@ -65,7 +58,7 @@ export class UmbSectionViewsElement extends UmbContextConsumerMixin(LitElement) } private _observeViews() { - if (!this._sectionContext || !this._extensionRegistry) return; + if (!this._sectionContext) return; this._viewsSubscription?.unsubscribe(); @@ -75,7 +68,7 @@ export class UmbSectionViewsElement extends UmbContextConsumerMixin(LitElement) if (!section) return EMPTY; return ( - this._extensionRegistry + umbExtensionsRegistry ?.extensionsOfType('sectionView') .pipe( map((views) => diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section.element.ts index 97b6e78dd5..ed665461e4 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/sections/shared/section.element.ts @@ -6,12 +6,13 @@ import { UmbSectionContext } from '../section.context'; import { UmbEditorEntityElement } from '../../editors/shared/editor-entity/editor-entity.element'; import { UmbEntityStore } from '../../../core/stores/entity.store'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { createExtensionElement, UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { createExtensionElement } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestTree, ManifestSectionView } from '@umbraco-cms/models'; import './section-trees/section-trees.element.ts'; import '../shared/section-views/section-views.element.ts'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-section') export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin(LitElement)) { @@ -55,13 +56,11 @@ export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin( private _entityStore?: UmbEntityStore; private _sectionContext?: UmbSectionContext; - private _extensionRegistry?: UmbExtensionRegistry; constructor() { super(); - this.consumeAllContexts(['umbExtensionRegistry', 'umbSectionContext', 'umbEntityStore'], (instances) => { - this._extensionRegistry = instances['umbExtensionRegistry']; + this.consumeAllContexts(['umbSectionContext', 'umbEntityStore'], (instances) => { this._sectionContext = instances['umbSectionContext']; this._entityStore = instances['umbEntityStore']; @@ -71,7 +70,7 @@ export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin( } private _observeTrees() { - if (!this._sectionContext || !this._extensionRegistry || !this._entityStore) return; + if (!this._sectionContext || !this._entityStore) return; this.observe( this._sectionContext?.data.pipe( @@ -79,7 +78,7 @@ export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin( if (!section) return EMPTY; return ( - this._extensionRegistry + umbExtensionsRegistry ?.extensionsOfType('tree') .pipe(map((trees) => trees.filter((tree) => tree.meta.sections.includes(section.alias)))) ?? of([]) ); @@ -120,7 +119,7 @@ export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin( } private _observeViews() { - if (!this._sectionContext || !this._extensionRegistry || !this._entityStore) return; + if (!this._sectionContext || !this._entityStore) return; this.observe( this._sectionContext.data.pipe( @@ -128,7 +127,7 @@ export class UmbSectionElement extends UmbContextConsumerMixin(UmbObserverMixin( if (!section) return EMPTY; return ( - this._extensionRegistry + umbExtensionsRegistry ?.extensionsOfType('sectionView') .pipe( map((views) => diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/context-menu/tree-context-menu-page-action-list.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/context-menu/tree-context-menu-page-action-list.element.ts index 85d27f08d9..7ecbed102c 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/context-menu/tree-context-menu-page-action-list.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/context-menu/tree-context-menu-page-action-list.element.ts @@ -5,9 +5,9 @@ import { map } from 'rxjs'; import { UmbSectionContext } from '../../../sections/section.context'; import { Entity } from '../../../../core/mocks/data/entities'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; import type { ManifestTreeItemAction, ManifestTree } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-tree-context-menu-page-action-list') export class UmbTreeContextMenuPageActionListElement extends UmbContextConsumerMixin(UmbObserverMixin(LitElement)) { @@ -38,16 +38,10 @@ export class UmbTreeContextMenuPageActionListElement extends UmbContextConsumerM @state() private _activeTreeItem?: Entity; - private _extensionRegistry?: UmbExtensionRegistry; private _sectionContext?: UmbSectionContext; - connectedCallback() { - super.connectedCallback(); - - this.consumeContext('umbExtensionRegistry', (extensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observeTreeItemActions(); - }); + constructor() { + super(); this.consumeContext('umbSectionContext', (sectionContext) => { this._sectionContext = sectionContext; @@ -58,10 +52,10 @@ export class UmbTreeContextMenuPageActionListElement extends UmbContextConsumerM } private _observeTreeItemActions() { - if (!this._extensionRegistry || !this._sectionContext) return; + if (!this._sectionContext) return; this.observe( - this._extensionRegistry + umbExtensionsRegistry .extensionsOfType('treeItemAction') .pipe(map((actions) => actions.filter((action) => action.meta.trees.includes(this._activeTree?.alias || '')))), (actions) => { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/tree.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/tree.element.ts index b24f5e1a4b..d3347bee93 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/tree.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/trees/shared/tree.element.ts @@ -4,9 +4,9 @@ import { customElement, property, state } from 'lit/decorators.js'; import { map } from 'rxjs'; import { UmbTreeContextBase } from '../tree.context'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import { UmbContextConsumerMixin, UmbContextProviderMixin } from '@umbraco-cms/context-api'; import type { ManifestTree } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; @customElement('umb-tree') export class UmbTreeElement extends UmbContextProviderMixin(UmbContextConsumerMixin(UmbObserverMixin(LitElement))) { @@ -50,21 +50,17 @@ export class UmbTreeElement extends UmbContextProviderMixin(UmbContextConsumerMi private _tree?: ManifestTree; private _treeContext?: UmbTreeContextBase; - private _extensionRegistry?: UmbExtensionRegistry; - constructor() { - super(); - this.consumeContext('umbExtensionRegistry', (extensionRegistry) => { - this._extensionRegistry = extensionRegistry; - this._observeTree(); - }); + connectedCallback(): void { + super.connectedCallback(); + this._observeTree(); } private _observeTree() { - if (!this._extensionRegistry || !this.alias) return; + if (!this.alias) return; this.observe( - this._extensionRegistry + umbExtensionsRegistry .extensionsOfType('tree') .pipe(map((trees) => trees.find((tree) => tree.alias === this.alias))), (tree) => { diff --git a/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts b/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts index a946384f6d..efaa0a4e9b 100644 --- a/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts @@ -7,9 +7,8 @@ import type { UUIInputEvent } from '@umbraco-ui/uui'; import type { UmbModalHandler } from '../../modal-handler'; import { UmbObserverMixin } from '@umbraco-cms/observable-api'; import { UmbContextConsumerMixin } from '@umbraco-cms/context-api'; - -import type { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; import type { ManifestPropertyEditorUI } from '@umbraco-cms/models'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; export interface UmbModalPropertyEditorUIPickerData { selection?: Array; @@ -104,29 +103,20 @@ export class UmbModalLayoutPropertyEditorUIPickerElement extends UmbContextConsu @state() private _submitLabel = 'Select'; - private _extensionRegistry?: UmbExtensionRegistry; - - constructor() { - super(); - - this.consumeContext('umbExtensionRegistry', (registry) => { - this._extensionRegistry = registry; - this._usePropertyEditorUIs(); - }); - } - connectedCallback(): void { super.connectedCallback(); this._selection = this.data?.selection ?? []; this._submitLabel = this.data?.submitLabel ?? this._submitLabel; + + this._usePropertyEditorUIs(); } private _usePropertyEditorUIs() { - if (!this.data || !this._extensionRegistry) return; + if (!this.data) return; this.observe( - this._extensionRegistry.extensionsOfType('propertyEditorUI'), + umbExtensionsRegistry.extensionsOfType('propertyEditorUI'), (propertyEditorUIs) => { this._propertyEditorUIs = propertyEditorUIs; this._groupedPropertyEditorUIs = groupBy(propertyEditorUIs, 'meta.group'); diff --git a/src/Umbraco.Web.UI.Client/src/core/stores/section.store.ts b/src/Umbraco.Web.UI.Client/src/core/stores/section.store.ts index 64eabfca98..ac710a3a2e 100644 --- a/src/Umbraco.Web.UI.Client/src/core/stores/section.store.ts +++ b/src/Umbraco.Web.UI.Client/src/core/stores/section.store.ts @@ -1,18 +1,11 @@ import { Observable, ReplaySubject } from 'rxjs'; -import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api'; +import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry'; // TODO: maybe this should be named something else than store? export class UmbSectionStore { - private _extensionRegistry: UmbExtensionRegistry; - private _currentAlias: ReplaySubject = new ReplaySubject(1); public readonly currentAlias: Observable = this._currentAlias.asObservable(); - // TODO: how do we want to handle DI in contexts? - constructor(extensionRegistry: UmbExtensionRegistry) { - this._extensionRegistry = extensionRegistry; - } - public getAllowed() { // TODO: implemented allowed filtering /* @@ -20,7 +13,7 @@ export class UmbSectionStore { this._allowedSection = data.sections; */ - return this._extensionRegistry?.extensionsOfType('section'); + return umbExtensionsRegistry.extensionsOfType('section'); } public setCurrent(alias: string) {