From 69a9e783b3177639b3921ba4afa123ad442d1351 Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Mon, 6 Feb 2023 10:06:24 +0000 Subject: [PATCH 1/3] Add new method to extension registry to get a sorted list of extensions by type and then weight --- .../extensions-api/registry/extension.registry.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/src/Umbraco.Web.UI.Client/libs/extensions-api/registry/extension.registry.ts b/src/Umbraco.Web.UI.Client/libs/extensions-api/registry/extension.registry.ts index 7e562cb17b..df0e30cca2 100644 --- a/src/Umbraco.Web.UI.Client/libs/extensions-api/registry/extension.registry.ts +++ b/src/Umbraco.Web.UI.Client/libs/extensions-api/registry/extension.registry.ts @@ -80,4 +80,19 @@ export class UmbExtensionRegistry { ) ) as Observable>; } + + extensionsSortedByTypeAndWeight(): Observable> { + return this.extensions.pipe( + map((exts) => exts + .sort((a, b) => { + // If type is the same, sort by weight + if (a.type === b.type) { + return (a.weight || 0) - (b.weight || 0); + } + + // Otherwise sort by type + return a.type.localeCompare(b.type); + })) + ) as Observable>; + } } From 651458186de48faf39dc7aa9423431ae74468a96 Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Mon, 6 Feb 2023 10:07:41 +0000 Subject: [PATCH 2/3] Improve the extensions list to be sorted by type & weight along with confirm dialog --- .../extension-root-workspace.element.ts | 37 ++++++++++++++++--- 1 file changed, 32 insertions(+), 5 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts index 26bcf43f2a..c501718527 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts @@ -3,31 +3,53 @@ import { customElement, state } from 'lit/decorators.js'; import { isManifestElementNameType , umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import type { ManifestBase } from '@umbraco-cms/models'; import { UmbLitElement } from '@umbraco-cms/element'; +import { UMB_MODAL_SERVICE_CONTEXT_TOKEN } from 'src/core/modal/modal.service'; @customElement('umb-extension-root-workspace') export class UmbExtensionRootWorkspaceElement extends UmbLitElement { @state() private _extensions?: Array = undefined; + private _modalService: UmbModalService; + connectedCallback(): void { super.connectedCallback(); this._observeExtensions(); + + this.consumeContext(UMB_MODAL_SERVICE_CONTEXT_TOKEN, (modalService) => { + this._modalService = modalService; + }); } private _observeExtensions() { - this.observe(umbExtensionsRegistry.extensions, (extensions) => { + this.observe(umbExtensionsRegistry.extensionsSortedByTypeAndWeight(), (extensions) => { this._extensions = extensions || undefined; }); } + #removeExtension(extension: ManifestBase) { + const modalHandler = this._modalService.confirm({ + headline: 'Unload extension', + confirmLabel: 'Unload', + content: html`

Are you sure you want to unload the extension ${extension.alias}?

`, + color: 'danger' + }); + + modalHandler?.onClose().then(({ confirmed }: any) => { + if (confirmed) { + umbExtensionsRegistry.unregister(extension.alias); + } + }); + } + render() { return html` -

List of currently loaded extensions

Type + Weight Name Alias Actions @@ -37,14 +59,19 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { (extension) => html` ${extension.type} + ${extension.weight ? extension.weight : 'Not Set'} - ${isManifestElementNameType(extension) ? extension.name : 'Custom extension'} + ${isManifestElementNameType(extension) ? extension.name : `[Custom extension] ${extension.name}`} ${extension.alias} umbExtensionsRegistry.unregister(extension.alias)}> + label="Unload" + color="danger" + look="primary" + @click=${() => this.#removeExtension(extension)}> + + ` From da8aab733b9d6d754796eb4e1c8ebd7451180ff8 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Mon, 6 Feb 2023 15:12:08 +0100 Subject: [PATCH 3/3] fix imports --- .../workspace/extension-root-workspace.element.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts index c501718527..563af4962a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts @@ -1,16 +1,16 @@ import { html } from 'lit'; import { customElement, state } from 'lit/decorators.js'; -import { isManifestElementNameType , umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; +import { isManifestElementNameType, umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import type { ManifestBase } from '@umbraco-cms/models'; import { UmbLitElement } from '@umbraco-cms/element'; -import { UMB_MODAL_SERVICE_CONTEXT_TOKEN } from 'src/core/modal/modal.service'; +import { UmbModalService, UMB_MODAL_SERVICE_CONTEXT_TOKEN } from '@umbraco-cms/modal'; @customElement('umb-extension-root-workspace') export class UmbExtensionRootWorkspaceElement extends UmbLitElement { @state() private _extensions?: Array = undefined; - private _modalService: UmbModalService; + private _modalService?: UmbModalService; connectedCallback(): void { super.connectedCallback(); @@ -28,11 +28,11 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { } #removeExtension(extension: ManifestBase) { - const modalHandler = this._modalService.confirm({ + const modalHandler = this._modalService?.confirm({ headline: 'Unload extension', confirmLabel: 'Unload', content: html`

Are you sure you want to unload the extension ${extension.alias}?

`, - color: 'danger' + color: 'danger', }); modalHandler?.onClose().then(({ confirmed }: any) => { @@ -40,7 +40,7 @@ export class UmbExtensionRootWorkspaceElement extends UmbLitElement { umbExtensionsRegistry.unregister(extension.alias); } }); - } + } render() { return html`