wip split up internal manifests file

src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts

@@ -28,7 +28,12 @@ import { UmbPropertyEditorStore } from '../core/stores/property-editor/property-
 import { UmbIconStore } from '../core/stores/icon/icon.store';
 import { UmbPropertyEditorConfigStore } from '../core/stores/property-editor-config/property-editor-config.store';
 import { UmbUserGroupStore } from '../core/stores/user/user-group.store';
+import { manifests as sectionManifests } from './sections/manifests';
+import { manifests as propertyEditorUIManifests } from './property-editor-uis/manifests';
+
 import { UmbContextConsumerMixin, UmbContextProviderMixin } from '@umbraco-cms/context-api';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestTypes, ManifestWithLoader } from '@umbraco-cms/models';
 
 @defineElement('umb-backoffice')
 export class UmbBackofficeElement extends UmbContextConsumerMixin(UmbContextProviderMixin(LitElement)) {
@@ -53,6 +58,9 @@ export class UmbBackofficeElement extends UmbContextConsumerMixin(UmbContextProv
 	constructor() {
 		super();
 
+		this._registerExtensions(sectionManifests);
+		this._registerExtensions(propertyEditorUIManifests);
+
 		this._umbIconRegistry.attach(this);
 
 		this.provideContext('umbEntityStore', this._umbEntityStore);
@@ -68,6 +76,13 @@ export class UmbBackofficeElement extends UmbContextConsumerMixin(UmbContextProv
 		this.provideContext('umbSectionStore', new UmbSectionStore());
 	}
 
+	private _registerExtensions(manifests: Array<ManifestWithLoader<ManifestTypes>>) {
+		manifests.forEach((manifest) => {
+			if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;
+			umbExtensionsRegistry.register(manifest);
+		});
+	}
+
 	render() {
 		return html`
 			<umb-backoffice-header></umb-backoffice-header>

src/Umbraco.Web.UI.Client/src/backoffice/dashboards/redirect-management/dashboard-redirect-management.element.ts

@@ -15,6 +15,8 @@ export class UmbDashboardRedirectManagementElement extends LitElement {
 	}
 }
 
+export default UmbDashboardRedirectManagementElement;
+
 declare global {
 	interface HTMLElementTagNameMap {
 		'umb-dashboard-redirect-management': UmbDashboardRedirectManagementElement;

src/Umbraco.Web.UI.Client/src/backoffice/dashboards/welcome/dashboard-welcome.element.ts

@@ -16,6 +16,8 @@ export class UmbDashboardWelcomeElement extends LitElement {
 	}
 }
 
+export default UmbDashboardWelcomeElement;
+
 declare global {
 	interface HTMLElementTagNameMap {
 		'umb-dashboard-welcome': UmbDashboardWelcomeElement;

src/Umbraco.Web.UI.Client/src/backoffice/editors/document/editor-document.element.ts

@@ -1,6 +1,8 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestEditorView, ManifestWithLoader } from '@umbraco-cms/models';
 
 import '../shared/node/editor-node.element';
 
@@ -20,6 +22,48 @@ export class UmbEditorDocumentElement extends LitElement {
 	@property()
 	entityKey!: string;
 
+	constructor() {
+		super();
+
+		this._registerEditorViews();
+	}
+
+	private _registerEditorViews() {
+		const dashboards: Array<ManifestWithLoader<ManifestEditorView>> = [
+			{
+				type: 'editorView',
+				alias: 'Umb.EditorView.Document.Edit',
+				name: 'Document Editor Edit View',
+				loader: () => import('../shared/node/views/edit/editor-view-node-edit.element'),
+				weight: 200,
+				meta: {
+					editors: ['Umb.Editor.Document'],
+					label: 'Info',
+					pathname: 'content',
+					icon: 'document',
+				},
+			},
+			{
+				type: 'editorView',
+				alias: 'Umb.EditorView.Document.Info',
+				name: 'Document Editor Info View',
+				loader: () => import('../shared/node/views/info/editor-view-node-info.element'),
+				weight: 100,
+				meta: {
+					editors: ['Umb.Editor.Document'],
+					label: 'Info',
+					pathname: 'info',
+					icon: 'info',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
 		return html`<umb-editor-node .entityKey=${this.entityKey} alias="Umb.Editor.Document"></umb-editor-node>`;
 	}

src/Umbraco.Web.UI.Client/src/backoffice/editors/media/editor-media.element.ts

@@ -1,6 +1,8 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
+import type { ManifestEditorView, ManifestWithLoader } from '@umbraco-cms/models';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
 import '../shared/node/editor-node.element';
 
@@ -22,6 +24,44 @@ export class UmbEditorMediaElement extends LitElement {
 
 	constructor() {
 		super();
+
+		this._registerEditorViews();
+	}
+
+	private _registerEditorViews() {
+		const dashboards: Array<ManifestWithLoader<ManifestEditorView>> = [
+			{
+				type: 'editorView',
+				alias: 'Umb.EditorView.Media.Edit',
+				name: 'Media Editor Edit View',
+				loader: () => import('../shared/node/views/edit/editor-view-node-edit.element'),
+				weight: 200,
+				meta: {
+					editors: ['Umb.Editor.Media'],
+					label: 'Media',
+					pathname: 'media',
+					icon: 'umb:picture',
+				},
+			},
+			{
+				type: 'editorView',
+				alias: 'Umb.EditorView.Media.Info',
+				name: 'Media Editor Info View',
+				loader: () => import('../shared/node/views/info/editor-view-node-info.element'),
+				weight: 100,
+				meta: {
+					editors: ['Umb.Editor.Media'],
+					label: 'Info',
+					pathname: 'info',
+					icon: 'info',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
 	}
 
 	render() {

src/Umbraco.Web.UI.Client/src/backoffice/editors/user/editor-user.element.ts

@@ -9,10 +9,11 @@ import { UmbUserStore } from '../../../core/stores/user/user.store';
 import { getTagLookAndColor } from '../../sections/users/user-extensions';
 import { UmbUserContext } from './user.context';
 import { UmbContextProviderMixin, UmbContextConsumerMixin } from '@umbraco-cms/context-api';
-import type { UserDetails } from '@umbraco-cms/models';
+import type { ManifestEditorAction, ManifestWithLoader, UserDetails } from '@umbraco-cms/models';
 
 import '../../property-editor-uis/content-picker/property-editor-ui-content-picker.element';
 import '../shared/editor-entity-layout/editor-entity-layout.element';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
 @customElement('umb-editor-user')
 export class UmbEditorUserElement extends UmbContextProviderMixin(UmbContextConsumerMixin(LitElement)) {
@@ -104,6 +105,31 @@ export class UmbEditorUserElement extends UmbContextProviderMixin(UmbContextCons
 
 	private _languages = []; //TODO Add languages
 
+	constructor() {
+		super();
+
+		this._registerEditorActions();
+	}
+
+	private _registerEditorActions() {
+		const manifests: Array<ManifestWithLoader<ManifestEditorAction>> = [
+			{
+				type: 'editorAction',
+				alias: 'Umb.EditorAction.User.Save',
+				name: 'EditorActionUserSave',
+				loader: () => import('./actions/editor-action-user-save.element'),
+				meta: {
+					editors: ['Umb.Editor.User'],
+				},
+			},
+		];
+
+		manifests.forEach((manifest) => {
+			if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;
+			umbExtensionsRegistry.register(manifest);
+		});
+	}
+
 	connectedCallback(): void {
 		super.connectedCallback();
 

src/Umbraco.Web.UI.Client/src/backoffice/property-editor-uis/manifests.ts

@@ -1,11 +1,11 @@
-import type { ManifestTypes } from '@umbraco-cms/models';
+import type { ManifestPropertyEditorUI, ManifestWithLoader } from '@umbraco-cms/models';
 
-export const manifests: Array<ManifestTypes & { loader: () => Promise<object | HTMLElement> }> = [
+export const manifests: Array<ManifestWithLoader<ManifestPropertyEditorUI>> = [
 	{
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.BlockList',
 		name: 'Block List Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/block-list/property-editor-ui-block-list.element'),
+		loader: () => import('./block-list/property-editor-ui-block-list.element'),
 		meta: {
 			label: 'Block List',
 			icon: 'umb:thumbnail-list',
@@ -17,7 +17,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.Toggle',
 		name: 'Toggle Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/toggle/property-editor-ui-toggle.element'),
+		loader: () => import('./toggle/property-editor-ui-toggle.element'),
 		meta: {
 			label: 'Toggle',
 			icon: 'umb:checkbox',
@@ -29,7 +29,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.CheckboxList',
 		name: 'Checkbox List Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/checkbox-list/property-editor-ui-checkbox-list.element'),
+		loader: () => import('./checkbox-list/property-editor-ui-checkbox-list.element'),
 		meta: {
 			label: 'Checkbox List',
 			icon: 'umb:bulleted-list',
@@ -41,7 +41,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.TextBox',
 		name: 'Text Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/text-box/property-editor-ui-text-box.element'),
+		loader: () => import('./text-box/property-editor-ui-text-box.element'),
 		meta: {
 			label: 'Text',
 			icon: 'umb:edit',
@@ -53,7 +53,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.Textarea',
 		name: 'Textarea Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/textarea/property-editor-ui-textarea.element'),
+		loader: () => import('./textarea/property-editor-ui-textarea.element'),
 		meta: {
 			label: 'Textarea',
 			icon: 'umb:edit',
@@ -75,7 +75,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.Number',
 		name: 'Number Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/number/property-editor-ui-number.element'),
+		loader: () => import('./number/property-editor-ui-number.element'),
 		meta: {
 			label: 'Number',
 			icon: 'umb:autofill',
@@ -87,7 +87,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.ContentPicker',
 		name: 'Content Picker Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/content-picker/property-editor-ui-content-picker.element'),
+		loader: () => import('./content-picker/property-editor-ui-content-picker.element'),
 		meta: {
 			label: 'Content Picker',
 			propertyEditor: 'Umbraco.ContentPicker',
@@ -99,7 +99,7 @@ export const manifests: Array<ManifestTypes & { loader: () => Promise<object | H
 		type: 'propertyEditorUI',
 		alias: 'Umb.PropertyEditorUI.IconPicker',
 		name: 'Icon Picker Property Editor UI',
-		loader: () => import('../backoffice/property-editor-uis/icon-picker/property-editor-ui-icon-picker.element'),
+		loader: () => import('./icon-picker/property-editor-ui-icon-picker.element'),
 		meta: {
 			label: 'Icon Picker',
 			propertyEditor: 'Umbraco.IconPicker',

src/Umbraco.Web.UI.Client/src/backoffice/sections/content/content-section.element.ts

@@ -1,11 +1,53 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import type { ManifestDashboard, ManifestWithLoader } from '@umbraco-cms/models';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
 @customElement('umb-content-section')
 export class UmbContentSection extends LitElement {
 	static styles = [UUITextStyles];
 
+	constructor() {
+		super();
+
+		this._registerDashboards();
+	}
+
+	private _registerDashboards() {
+		const dashboards: Array<ManifestWithLoader<ManifestDashboard>> = [
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.Welcome',
+				name: 'Welcome Dashboard',
+				loader: () => import('../../dashboards/welcome/dashboard-welcome.element'),
+				weight: 20,
+				meta: {
+					label: 'Welcome',
+					sections: ['Umb.Section.Content'],
+					pathname: 'welcome',
+				},
+			},
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.RedirectManagement',
+				name: 'Redirect Management Dashboard',
+				loader: () => import('../../dashboards/redirect-management/dashboard-redirect-management.element'),
+				weight: 10,
+				meta: {
+					label: 'Redirect Management',
+					sections: ['Umb.Section.Content'],
+					pathname: 'redirect-management',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
 		return html`<umb-section></umb-section>`;
 	}

src/Umbraco.Web.UI.Client/src/backoffice/sections/manifests.ts

@@ -0,0 +1,74 @@
+import type { ManifestSection, ManifestWithLoader } from '@umbraco-cms/models';
+
+export const manifests: Array<ManifestWithLoader<ManifestSection>> = [
+	{
+		type: 'section',
+		alias: 'Umb.Section.Content',
+		name: 'Content Section',
+		elementName: 'umb-content-section',
+		loader: () => import('./content/content-section.element'),
+		weight: 600,
+		meta: {
+			label: 'Content',
+			pathname: 'content',
+		},
+	},
+	{
+		type: 'section',
+		alias: 'Umb.Section.Media',
+		name: 'Media Section',
+		elementName: 'umb-media-section',
+		loader: () => import('./media/media-section.element'),
+		weight: 500,
+		meta: {
+			label: 'Media',
+			pathname: 'media',
+		},
+	},
+	{
+		type: 'section',
+		alias: 'Umb.Section.Members',
+		name: 'Members Section',
+		elementName: 'umb-section-members',
+		loader: () => import('./members/section-members.element'),
+		weight: 400,
+		meta: {
+			label: 'Members',
+			pathname: 'members',
+		},
+	},
+	{
+		type: 'section',
+		alias: 'Umb.Section.Settings',
+		name: 'Settings Section',
+		loader: () => import('./settings/settings-section.element'),
+		weight: 300,
+		meta: {
+			label: 'Settings',
+			pathname: 'settings',
+		},
+	},
+	{
+		type: 'section',
+		alias: 'Umb.Section.Packages',
+		name: 'Packages Section',
+		elementName: 'umb-packages-section',
+		loader: () => import('./packages/packages-section.element'),
+		weight: 200,
+		meta: {
+			label: 'Packages',
+			pathname: 'packages',
+		},
+	},
+	{
+		type: 'section',
+		alias: 'Umb.Section.Users',
+		name: 'Users',
+		loader: () => import('./users/section-users.element'),
+		weight: 100,
+		meta: {
+			label: 'Users',
+			pathname: 'users',
+		},
+	},
+];

src/Umbraco.Web.UI.Client/src/backoffice/sections/media/media-section.element.ts

@@ -1,11 +1,40 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestDashboard, ManifestWithLoader } from '@umbraco-cms/models';
 
 @customElement('umb-media-section')
 export class UmbMediaSection extends LitElement {
 	static styles = [UUITextStyles];
 
+	constructor() {
+		super();
+		this._registerDashboards();
+	}
+
+	private _registerDashboards() {
+		const dashboards: Array<ManifestWithLoader<ManifestDashboard>> = [
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.MediaManagement',
+				name: 'Media Dashboard',
+				loader: () => import('../../dashboards/media-management/dashboard-media-management.element'),
+				weight: 10,
+				meta: {
+					label: 'Media',
+					sections: ['Umb.Section.Media'],
+					pathname: 'media-management',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
 		return html`<umb-section></umb-section>`;
 	}

src/Umbraco.Web.UI.Client/src/backoffice/sections/settings/settings-section.element.ts

@@ -1,10 +1,93 @@
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestDashboard, ManifestWithLoader } from '@umbraco-cms/models';
 
 @customElement('umb-section-settings')
 export class UmbSectionSettingsElement extends LitElement {
+	constructor() {
+		super();
+
+		this._registerDashboards();
+	}
+
+	private _registerDashboards() {
+		const dashboards: Array<ManifestWithLoader<ManifestDashboard>> = [
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.SettingsWelcome',
+				name: 'Welcome Settings Dashboard',
+				elementName: 'umb-dashboard-settings-welcome',
+				loader: () => import('../../dashboards/settings-welcome/dashboard-settings-welcome.element'),
+				weight: 500,
+				meta: {
+					label: 'Welcome',
+					sections: ['Umb.Section.Settings'],
+					pathname: 'welcome',
+				},
+			},
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.ExamineManagement',
+				name: 'Examine Management Dashboard',
+				elementName: 'umb-dashboard-examine-management',
+				loader: () => import('../../dashboards/examine-management/dashboard-examine-management.element'),
+				weight: 400,
+				meta: {
+					label: 'Examine Management',
+					sections: ['Umb.Section.Settings'],
+					pathname: 'examine-management',
+				},
+			},
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.ModelsBuilder',
+				name: 'Models Builder Dashboard',
+				elementName: 'umb-dashboard-models-builder',
+				loader: () => import('../../dashboards/models-builder/dashboard-models-builder.element'),
+				weight: 300,
+				meta: {
+					label: 'Models Builder',
+					sections: ['Umb.Section.Settings'],
+					pathname: 'models-builder',
+				},
+			},
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.PublishedStatus',
+				name: 'Published Status Dashboard',
+				elementName: 'umb-dashboard-published-status',
+				loader: () => import('../../dashboards/published-status/dashboard-published-status.element'),
+				weight: 200,
+				meta: {
+					label: 'Published Status',
+					sections: ['Umb.Section.Settings'],
+					pathname: 'published-status',
+				},
+			},
+			{
+				type: 'dashboard',
+				alias: 'Umb.Dashboard.Telemetry',
+				name: 'Telemetry',
+				elementName: 'umb-dashboard-telemetry',
+				loader: () => import('../../dashboards/telemetry/dashboard-telemetry.element'),
+				weight: 100,
+				meta: {
+					label: 'Telemetry Data',
+					sections: ['Umb.Section.Settings'],
+					pathname: 'telemetry',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
-		return html` <umb-section></umb-section>`;
+		return html`<umb-section></umb-section>`;
 	}
 }
 

src/Umbraco.Web.UI.Client/src/backoffice/sections/users/section-users.element.ts

@@ -1,8 +1,52 @@
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestSectionView, ManifestWithLoader } from '@umbraco-cms/models';
 
 @customElement('umb-section-users')
 export class UmbSectionUsersElement extends LitElement {
+	constructor() {
+		super();
+
+		this._registerSectionViews();
+	}
+
+	private _registerSectionViews() {
+		const manifests: Array<ManifestWithLoader<ManifestSectionView>> = [
+			{
+				type: 'sectionView',
+				alias: 'Umb.SectionView.Users.Users',
+				name: 'Users Section View',
+				loader: () => import('./views/users/section-view-users.element'),
+				meta: {
+					sections: ['Umb.Section.Users'],
+					label: 'Users',
+					pathname: 'users',
+					weight: 200,
+					icon: 'umb:user',
+				},
+			},
+			{
+				type: 'sectionView',
+				alias: 'Umb.SectionView.Users.UserGroups',
+				name: 'User Groups Section View',
+				loader: () => import('./views/user-groups/section-view-user-groups.element'),
+				meta: {
+					sections: ['Umb.Section.Users'],
+					label: 'User Groups',
+					pathname: 'user-groups',
+					weight: 100,
+					icon: 'umb:users',
+				},
+			},
+		];
+
+		manifests.forEach((manifest) => {
+			if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;
+			umbExtensionsRegistry.register(manifest);
+		});
+	}
+
 	render() {
 		return html` <umb-section></umb-section> `;
 	}

src/Umbraco.Web.UI.Client/src/backoffice/trees/data-types/actions/create/action-data-type-create.element.ts

@@ -1,7 +1,7 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css';
 import { css, html } from 'lit';
 import { customElement } from 'lit/decorators.js';
-import UmbTreeItemActionElement from '../../shared/tree-item-action.element';
+import UmbTreeItemActionElement from '../../../shared/tree-item-action.element';
 
 @customElement('umb-tree-action-data-type-create')
 export default class UmbTreeActionDataTypeCreateElement extends UmbTreeItemActionElement {

src/Umbraco.Web.UI.Client/src/backoffice/trees/data-types/actions/delete/action-data-type-delete.element.ts

@@ -1,9 +1,9 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css';
 import { css, html } from 'lit';
 import { customElement } from 'lit/decorators.js';
-import { UmbModalService } from '../../../../core/services/modal';
-import { UmbDataTypeStore } from '../../../../core/stores/data-type/data-type.store';
-import UmbTreeItemActionElement from '../../shared/tree-item-action.element';
+import { UmbModalService } from '../../../../../core/services/modal';
+import { UmbDataTypeStore } from '../../../../../core/stores/data-type/data-type.store';
+import UmbTreeItemActionElement from '../../../shared/tree-item-action.element';
 import { UmbContextConsumerMixin } from '@umbraco-cms/context-api';
 
 @customElement('umb-tree-action-data-type-delete')

src/Umbraco.Web.UI.Client/src/backoffice/trees/data-types/tree-data-types.element.ts

@@ -4,6 +4,8 @@ import { UmbEntityStore } from '../../../core/stores/entity.store';
 import { UmbTreeBase } from '../shared/tree-base.element';
 import { UmbTreeDataTypesDataContext } from './tree-data-types-data.context';
 import { UmbContextConsumerMixin, UmbContextProviderMixin } from '@umbraco-cms/context-api';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestTreeItemAction, ManifestWithLoader } from '@umbraco-cms/models';
 
 import '../shared/tree-navigator.element';
 
@@ -12,6 +14,8 @@ export class UmbTreeDataTypesElement extends UmbContextProviderMixin(UmbContextC
 	constructor() {
 		super();
 
+		this._registerTreeItemActions();
+
 		this.consumeContext('umbEntityStore', (entityStore: UmbEntityStore) => {
 			this._entityStore = entityStore;
 			if (!this._entityStore) return;
@@ -21,6 +25,40 @@ export class UmbTreeDataTypesElement extends UmbContextProviderMixin(UmbContextC
 		});
 	}
 
+	private _registerTreeItemActions() {
+		const dashboards: Array<ManifestWithLoader<ManifestTreeItemAction>> = [
+			{
+				type: 'treeItemAction',
+				alias: 'Umb.TreeItemAction.DataType.Create',
+				name: 'Tree Item Action Create',
+				loader: () => import('./actions/create/action-data-type-create.element'),
+				weight: 200,
+				meta: {
+					trees: ['Umb.Tree.DataTypes'],
+					label: 'Create',
+					icon: 'umb:add',
+				},
+			},
+			{
+				type: 'treeItemAction',
+				alias: 'Umb.TreeItemAction.DataType.Delete',
+				name: 'Tree Item Action Delete',
+				loader: () => import('./actions/delete/action-data-type-delete.element'),
+				weight: 100,
+				meta: {
+					trees: ['Umb.Tree.DataTypes'],
+					label: 'Delete',
+					icon: 'umb:delete',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
 		return html`<umb-tree-navigator></umb-tree-navigator>`;
 	}

src/Umbraco.Web.UI.Client/src/backoffice/trees/documents/tree-documents.element.ts

@@ -4,14 +4,17 @@ import { UmbEntityStore } from '../../../core/stores/entity.store';
 import { UmbTreeBase } from '../shared/tree-base.element';
 import { UmbTreeDocumentDataContext } from './tree-documents-data.context';
 import { UmbContextConsumerMixin, UmbContextProviderMixin } from '@umbraco-cms/context-api';
+import type { ManifestTreeItemAction, ManifestWithLoader } from '@umbraco-cms/models';
 
 import '../shared/tree-navigator.element';
-
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 @customElement('umb-tree-document')
 export class UmbTreeDocumentElement extends UmbContextProviderMixin(UmbContextConsumerMixin(UmbTreeBase)) {
 	constructor() {
 		super();
 
+		this._registerTreeItemActions();
+
 		this.consumeContext('umbEntityStore', (entityStore: UmbEntityStore) => {
 			this._entityStore = entityStore;
 			if (!this._entityStore || !this.tree) return;
@@ -21,6 +24,52 @@ export class UmbTreeDocumentElement extends UmbContextProviderMixin(UmbContextCo
 		});
 	}
 
+	private _registerTreeItemActions() {
+		const dashboards: Array<ManifestWithLoader<ManifestTreeItemAction>> = [
+			{
+				type: 'treeItemAction',
+				alias: 'Umb.TreeItemAction.Document.Create',
+				name: 'Document Tree Item Action Create',
+				loader: () => import('./actions/action-document-create.element'),
+				weight: 100,
+				meta: {
+					trees: ['Umb.Tree.Documents'],
+					label: 'Create',
+					icon: 'add',
+				},
+			},
+			{
+				type: 'treeItemAction',
+				alias: 'Umb.TreeItemAction.Document.Delete',
+				name: 'Document Tree Item Action Delete',
+				loader: () => import('./actions/action-document-delete.element'),
+				weight: 100,
+				meta: {
+					trees: ['Umb.Tree.Documents'],
+					label: 'Delete',
+					icon: 'delete',
+				},
+			},
+			{
+				type: 'treeItemAction',
+				alias: 'Umb.TreeItemAction.Document.Paged',
+				name: 'Document Tree Item Action Paged',
+				loader: () => import('./actions/action-document-paged.element'),
+				weight: 100,
+				meta: {
+					trees: ['Umb.Tree.Documents'],
+					label: 'Paged',
+					icon: 'favorite',
+				},
+			},
+		];
+
+		dashboards.forEach((dashboard) => {
+			if (umbExtensionsRegistry.isRegistered(dashboard.alias)) return;
+			umbExtensionsRegistry.register(dashboard);
+		});
+	}
+
 	render() {
 		return html`<umb-tree-navigator></umb-tree-navigator>`;
 	}

src/Umbraco.Web.UI.Client/src/core/models/index.ts

@@ -61,6 +61,9 @@ export type ManifestElementType =
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type HTMLElementConstructor<T = HTMLElement> = new (...args: any[]) => T;
 
+// TODO: couldn't we make loader optional on all manifests? and not just the internal ones?
+export type ManifestWithLoader<T> = T & { loader: () => Promise<object | HTMLElement> };
+
 // Users
 export interface UserEntity extends Entity {
 	type: 'user';

src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/content-picker/modal-layout-content-picker.element.ts

@@ -77,7 +77,7 @@ export class UmbModalLayoutContentPickerElement extends UmbModalLayoutElement<Um
 					<uui-input></uui-input>
 					<hr />
 					<umb-tree
-						alias="Umb.Tree.Content"
+						alias="Umb.Tree.Documents"
 						@change=${this._handleSelectionChange}
 						.selection=${this._selection}
 						selectable></umb-tree>

src/Umbraco.Web.UI.Client/src/temp-internal-manifests/index.ts

@@ -1,214 +1,6 @@
-import type { ManifestTypes } from '../core/models';
-import { manifests as propertyEditorUIManifests } from './property-editor-ui';
+import type { ManifestTypes, ManifestWithLoader } from '@umbraco-cms/models';
 
-export const internalManifests: Array<ManifestTypes & { loader: () => Promise<object | HTMLElement> }> = [
-	...propertyEditorUIManifests,
-	{
-		type: 'section',
-		alias: 'Umb.Section.Content',
-		name: 'Content Section',
-		elementName: 'umb-content-section',
-		loader: () => import('../backoffice/sections/content/content-section.element'),
-		weight: 50,
-		meta: {
-			label: 'Content',
-			pathname: 'content', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'section',
-		alias: 'Umb.Section.Media',
-		name: 'Media Section',
-		elementName: 'umb-media-section',
-		loader: () => import('../backoffice/sections/media/media-section.element'),
-		weight: 50,
-		meta: {
-			label: 'Media',
-			pathname: 'media', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'section',
-		alias: 'Umb.Section.Members',
-		name: 'Members Section',
-		elementName: 'umb-section-members',
-		loader: () => import('../backoffice/sections/members/section-members.element'),
-		weight: 30,
-		meta: {
-			label: 'Members',
-			pathname: 'members',
-		},
-	},
-	{
-		type: 'section',
-		alias: 'Umb.Section.Settings',
-		name: 'Settings Section',
-		loader: () => import('../backoffice/sections/settings/settings-section.element'),
-		weight: 20,
-		meta: {
-			label: 'Settings',
-			pathname: 'settings', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'section',
-		alias: 'Umb.Section.Packages',
-		name: 'Packages Section',
-		elementName: 'umb-packages-section',
-		loader: () => import('../backoffice/sections/packages/packages-section.element'),
-		weight: 20,
-		meta: {
-			label: 'Packages',
-			pathname: 'packages',
-		},
-	},
-	{
-		type: 'section',
-		alias: 'Umb.Section.Users',
-		name: 'Users',
-		loader: () => import('../backoffice/sections/users/section-users.element'),
-		weight: 20,
-		meta: {
-			label: 'Users',
-			pathname: 'users',
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.Welcome',
-		name: 'Welcome Dashboard',
-		elementName: 'umb-dashboard-welcome',
-		loader: () => import('../backoffice/dashboards/welcome/dashboard-welcome.element'),
-		weight: 20,
-		meta: {
-			label: 'Welcome',
-			sections: ['Umb.Section.Content'],
-			pathname: 'welcome', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.RedirectManagement',
-		name: 'Redirect Management Dashboard',
-		elementName: 'umb-dashboard-redirect-management',
-		loader: () => import('../backoffice/dashboards/redirect-management/dashboard-redirect-management.element'),
-		weight: 10,
-		meta: {
-			label: 'Redirect Management',
-			sections: ['Umb.Section.Content'],
-			pathname: 'redirect-management', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.SettingsWelcome',
-		name: 'Welcome Settings Dashboard',
-		elementName: 'umb-dashboard-settings-welcome',
-		loader: () => import('../backoffice/dashboards/settings-welcome/dashboard-settings-welcome.element'),
-		weight: 10,
-		meta: {
-			label: 'Welcome',
-			sections: ['Umb.Section.Settings'],
-			pathname: 'welcome', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.Telemetry',
-		name: 'Telemetry',
-		elementName: 'umb-dashboard-telemetry',
-		loader: () => import('../backoffice/dashboards/telemetry/dashboard-telemetry.element'),
-		weight: 0,
-		meta: {
-			label: 'Telemetry Data',
-			sections: ['Umb.Section.Settings'],
-			pathname: 'telemetry', // TODO: how do we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.ExamineManagement',
-		name: 'Examine Management Dashboard',
-		elementName: 'umb-dashboard-examine-management',
-		loader: () => import('../backoffice/dashboards/examine-management/dashboard-examine-management.element'),
-		weight: 10,
-		meta: {
-			label: 'Examine Management',
-			sections: ['Umb.Section.Settings'],
-			pathname: 'examine-management', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.ModelsBuilder',
-		name: 'Models Builder Dashboard',
-		elementName: 'umb-dashboard-models-builder',
-		loader: () => import('../backoffice/dashboards/models-builder/dashboard-models-builder.element'),
-		weight: 10,
-		meta: {
-			label: 'Models Builder',
-			sections: ['Umb.Section.Settings'],
-			pathname: 'models-builder', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.PublishedStatus',
-		name: 'Published Status Dashboard',
-		elementName: 'umb-dashboard-published-status',
-		loader: () => import('../backoffice/dashboards/published-status/dashboard-published-status.element'),
-		weight: 9,
-		meta: {
-			label: 'Published Status',
-			sections: ['Umb.Section.Settings'],
-			pathname: 'published-status', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.MediaManagement',
-		name: 'Media Dashboard',
-		elementName: 'umb-dashboard-media-management',
-		loader: () => import('../backoffice/dashboards/media-management/dashboard-media-management.element'),
-		weight: 10,
-		meta: {
-			label: 'Media',
-			sections: ['Umb.Section.Media'],
-			pathname: 'media-management', // TODO: how to we want to support pretty urls?
-		},
-	},
-	{
-		type: 'editorView',
-		alias: 'Umb.EditorView.Content.Edit',
-		name: 'Content Editor Edit View',
-		elementName: 'umb-editor-view-node-edit',
-		loader: () => import('../backoffice/editors/shared/node/views/edit/editor-view-node-edit.element'),
-		weight: 100,
-		meta: {
-			// TODO: how do we want to filter where editor views are shown? https://our.umbraco.com/documentation/extending/Content-Apps/#setting-up-the-plugin
-			// this is a temp solution
-			editors: ['Umb.Editor.Document', 'Umb.Editor.Media'],
-			label: 'Info',
-			pathname: 'content',
-			icon: 'document',
-		},
-	},
-	{
-		type: 'editorView',
-		alias: 'Umb.EditorView.Content.Info',
-		name: 'Content Editor Info View',
-		elementName: 'umb-editor-view-node-info',
-		loader: () => import('../backoffice/editors/shared/node/views/info/editor-view-node-info.element'),
-		weight: 90,
-		meta: {
-			// TODO: how do we want to filter where editor views are shown? https://our.umbraco.com/documentation/extending/Content-Apps/#setting-up-the-plugin
-			// this is a temp solution
-			editors: ['Umb.Editor.Document', 'Umb.Editor.Media'],
-			label: 'Info',
-			pathname: 'info',
-			icon: 'info',
-		},
-	},
+export const internalManifests: Array<ManifestWithLoader<ManifestTypes>> = [
 	{
 		type: 'editorView',
 		alias: 'Umb.EditorView.DocumentType.Design',
@@ -217,8 +9,6 @@ export const internalManifests: Array<ManifestTypes & { loader: () => Promise<ob
 		loader: () => import('../backoffice/editors/document-type/views/editor-view-document-type-design.element'),
 		weight: 90,
 		meta: {
-			// TODO: how do we want to filter where editor views are shown? https://our.umbraco.com/documentation/extending/Content-Apps/#setting-up-the-plugin
-			// this is a temp solution
 			editors: ['Umb.Editor.DocumentType'],
 			label: 'Design',
 			pathname: 'design',
@@ -271,15 +61,6 @@ export const internalManifests: Array<ManifestTypes & { loader: () => Promise<ob
 			entityType: 'userGroup',
 		},
 	},
-	{
-		type: 'editorAction',
-		alias: 'Umb.EditorAction.User.Save',
-		name: 'EditorActionUserSave',
-		loader: () => import('../backoffice/editors/user/actions/editor-action-user-save.element'),
-		meta: {
-			editors: ['Umb.Editor.User'],
-		},
-	},
 	{
 		type: 'propertyAction',
 		alias: 'Umb.PropertyAction.Copy',
@@ -320,18 +101,6 @@ export const internalManifests: Array<ManifestTypes & { loader: () => Promise<ob
 			sections: ['Umb.Section.Settings'],
 		},
 	},
-	{
-		type: 'dashboard',
-		alias: 'Umb.Dashboard.MembersTest',
-		name: 'Members Test',
-		elementName: 'umb-dashboard-welcome',
-		loader: () => import('../backoffice/dashboards/welcome/dashboard-welcome.element'),
-		weight: -10,
-		meta: {
-			pathname: 'welcome',
-			sections: ['Umb.Section.Members'],
-		},
-	},
 	{
 		type: 'tree',
 		alias: 'Umb.Tree.Members',
@@ -374,8 +143,8 @@ export const internalManifests: Array<ManifestTypes & { loader: () => Promise<ob
 	},
 	{
 		type: 'tree',
-		alias: 'Umb.Tree.Content',
-		name: 'Content Tree',
+		alias: 'Umb.Tree.Documents',
+		name: 'Documents Tree',
 		loader: () => import('../backoffice/trees/documents/tree-documents.element'),
 		weight: 100,
 		meta: {
@@ -445,90 +214,4 @@ export const internalManifests: Array<ManifestTypes & { loader: () => Promise<ob
 			entityType: 'document',
 		},
 	},
-	{
-		type: 'treeItemAction',
-		alias: 'Umb.TreeItemAction.Document.Create',
-		name: 'Document Tree Item Action Create',
-		loader: () => import('../backoffice/trees/documents/actions/action-document-create.element'),
-		weight: 100,
-		meta: {
-			trees: ['Umb.Tree.Content'],
-			label: 'Create',
-			icon: 'add',
-		},
-	},
-	{
-		type: 'treeItemAction',
-		alias: 'Umb.TreeItemAction.Document.Delete',
-		name: 'Document Tree Item Action Delete',
-		loader: () => import('../backoffice/trees/documents/actions/action-document-delete.element'),
-		weight: 100,
-		meta: {
-			trees: ['Umb.Tree.Content'],
-			label: 'Delete',
-			icon: 'delete',
-		},
-	},
-	{
-		type: 'treeItemAction',
-		alias: 'Umb.TreeItemAction.Document.Paged',
-		name: 'Document Tree Item Action Paged',
-		loader: () => import('../backoffice/trees/documents/actions/action-document-paged.element'),
-		weight: 100,
-		meta: {
-			trees: ['Umb.Tree.Content'],
-			label: 'Paged',
-			icon: 'favorite',
-		},
-	},
-	{
-		type: 'treeItemAction',
-		alias: 'Umb.TreeItemAction.DataType.Create',
-		name: 'Tree Item Action Create',
-		loader: () => import('../backoffice/trees/data-types/actions/action-data-type-create.element'),
-		weight: 100,
-		meta: {
-			trees: ['Umb.Tree.DataTypes'],
-			label: 'Create',
-			icon: 'add',
-		},
-	},
-	{
-		type: 'treeItemAction',
-		alias: 'Umb.TreeItemAction.DataType.Delete',
-		name: 'Tree Item Action Delete',
-		loader: () => import('../backoffice/trees/data-types/actions/action-data-type-delete.element'),
-		weight: 100,
-		meta: {
-			trees: ['Umb.Tree.DataTypes'],
-			label: 'Delete',
-			icon: 'delete',
-		},
-	},
-	{
-		type: 'sectionView',
-		alias: 'Umb.SectionView.Users',
-		name: 'Users Section View',
-		loader: () => import('../backoffice/sections/users/views/users/section-view-users.element'),
-		meta: {
-			sections: ['Umb.Section.Users'],
-			label: 'Users',
-			pathname: 'users',
-			weight: 200,
-			icon: 'umb:user',
-		},
-	},
-	{
-		type: 'sectionView',
-		alias: 'Umb.SectionView.UserGroups',
-		name: 'User Groups Section View',
-		loader: () => import('../backoffice/sections/users/views/user-groups/section-view-user-groups.element'),
-		meta: {
-			sections: ['Umb.Section.Users'],
-			label: 'User Groups',
-			pathname: 'user-groups',
-			weight: 100,
-			icon: 'umb:users',
-		},
-	},
 ];