notes and a test example

src/Umbraco.Web.UI.Client/libs/extensions-api/registry/extension.registry.ts

@@ -109,9 +109,11 @@ export class UmbExtensionRegistry {
 			map((exts) => exts.find((ext) => ext.type === type && ext.alias === alias)),
 			withLatestFrom(this._kindsOfType(type)),
 			map(([ext, kinds]) => {
+				// TODO: Deep merge?
 				return ext ? { ...kinds.find((kind) => kind.matchKind === ext.kind)?.manifest, ...ext } : undefined;
 			})
 		) as Observable<T | undefined>;
+		// TODO: DisctinctUntilChanged by using aliases? and kind(if kind uses alias)
 	}
 
 	extensionsOfType<Key extends keyof ManifestTypeMap | string, T = SpecificManifestTypeOrManifestBase<Key>>(type: Key) {
@@ -120,6 +122,7 @@ export class UmbExtensionRegistry {
 			map(([exts, kinds]) =>
 				exts
 					.map((ext) => {
+						// TODO: Deep merge?
 						return { ...kinds.find((kind) => kind.matchKind === ext.kind)?.manifest, ...ext };
 					})
 					.sort((a, b) => (b.weight || 0) - (a.weight || 0))
@@ -135,6 +138,7 @@ export class UmbExtensionRegistry {
 			map(([exts, kinds]) =>
 				exts
 					.map((ext) => {
+						// TODO: Deep merge?
 						return { ...kinds.find((kind) => kind.matchKind === ext.kind)?.manifest, ...ext };
 					})
 					.sort((a, b) => (b.weight || 0) - (a.weight || 0))

src/Umbraco.Web.UI.Client/src/backoffice/documents/section.manifests.ts

@@ -1,8 +1,8 @@
-import type { ManifestSection, ManifestMenuSectionSidebarApp } from '@umbraco-cms/models';
+import type { ManifestKind, ManifestTypes } from '@umbraco-cms/models';
 
 const sectionAlias = 'Umb.Section.Content';
 
-const section: ManifestSection = {
+const section: ManifestTypes = {
 	type: 'section',
 	alias: sectionAlias,
 	name: 'Content Section',
@@ -13,8 +13,9 @@ const section: ManifestSection = {
 	},
 };
 
-const menuSectionSidebarApp: ManifestMenuSectionSidebarApp = {
-	type: 'menuSectionSidebarApp',
+const menuSectionSidebarApp: ManifestTypes = {
+	type: 'sectionSidebarApp',
+	kind: 'menuSectionSidebarApp',
 	alias: 'Umb.SidebarMenu.Content',
 	name: 'Content Sidebar Menu',
 	weight: 100,
@@ -27,4 +28,15 @@ const menuSectionSidebarApp: ManifestMenuSectionSidebarApp = {
 	},
 };
 
-export const manifests = [section, menuSectionSidebarApp];
+// TODO: move to a general place:
+const menuSectionSidebarAppKind: ManifestKind = {
+	type: 'kind',
+	matchKind: 'menuSectionSidebarApp',
+	matchType: 'sectionSidebarApp',
+	manifest: {
+		type: 'sectionSidebarApp',
+		elementName: 'umb-section-sidebar-menu',
+	},
+};
+
+export const manifests = [section, menuSectionSidebarApp, menuSectionSidebarAppKind];

src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section.element.ts

@@ -2,10 +2,10 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { map } from 'rxjs';
+import type { IRoutingInfo } from '@umbraco-cms/router';
 import type { UmbWorkspaceElement } from '../workspace/workspace.element';
 import type { UmbSectionViewsElement } from './section-views/section-views.element';
-import type { IRoutingInfo } from '@umbraco-cms/router';
-import type { ManifestMenuSectionSidebarApp, ManifestSection } from '@umbraco-cms/models';
+import type { ManifestSection, ManifestSectionSidebarApp } from '@umbraco-cms/models';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
@@ -45,7 +45,7 @@ export class UmbSectionElement extends UmbLitElement {
 	private _routes?: Array<any>;
 
 	@state()
-	private _menus?: Array<ManifestMenuSectionSidebarApp>;
+	private _menus?: Array<ManifestSectionSidebarApp>;
 
 	connectedCallback() {
 		super.connectedCallback();
@@ -74,10 +74,11 @@ export class UmbSectionElement extends UmbLitElement {
 		];
 	}
 
+	// TODO: Can this be omitted? or can the same data be used for the extension slot or alike extension presentation?
 	#observeSectionSidebarApps() {
 		this.observe(
 			umbExtensionsRegistry
-				?.extensionsOfType('menuSectionSidebarApp')
+				?.extensionsOfType('sectionSidebarApp')
 				.pipe(
 					map((manifests) =>
 						manifests.filter((manifest) => manifest.conditions.sections.includes(this.manifest?.alias || ''))
@@ -97,14 +98,8 @@ export class UmbSectionElement extends UmbLitElement {
 						<umb-section-sidebar>
 							<umb-extension-slot
 								type="sectionSidebarApp"
-								.filter=${(items: ManifestMenuSectionSidebarApp) =>
+								.filter=${(items: ManifestSectionSidebarApp) =>
 									items.conditions.sections.includes(this.manifest?.alias || '')}></umb-extension-slot>
-
-							<umb-extension-slot
-								type="menuSectionSidebarApp"
-								.filter=${(items: ManifestMenuSectionSidebarApp) =>
-									items.conditions.sections.includes(this.manifest?.alias || '')}
-								default-element="umb-section-sidebar-menu"></umb-extension-slot>
 						</umb-section-sidebar>
 				  `
 				: nothing}