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

register manifests without a custom element

Browse Source
This commit is contained in:
Mads Rasmussen
2022-12-20 21:56:50 +01:00
parent 02d8acada5
commit 42b9e592ad
16 changed files with 334 additions and 443 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/Umbraco.Web.UI.Client/src/backoffice/components/backoffice-frame/backoffice-main.element.ts
View File

@@ -9,6 +9,7 @@ import { UmbObserverMixin } from '@umbraco-cms/observable-api';
import { createExtensionElement } from '@umbraco-cms/extensions-api';
import { UmbContextConsumerMixin, UmbContextProviderMixin } from '@umbraco-cms/context-api';
import type { ManifestSection } from '@umbraco-cms/models';
import { UmbSectionElement } from '@umbraco-cms/sections/shared/section.element';
@defineElement('umb-backoffice-main')
export class UmbBackofficeMain extends UmbContextProviderMixin(UmbContextConsumerMixin(UmbObserverMixin(LitElement))) {
@@ -62,7 +63,7 @@ export class UmbBackofficeMain extends UmbContextProviderMixin(UmbContextConsume
this._routes = this._sections.map((section) => {
return {
path: this._routePrefix + section.meta.pathname,
component: () => createExtensionElement(section),
component: () => this._getSectionElement(section),
setup: this._onRouteSetup,
};
});
@@ -73,6 +74,14 @@ export class UmbBackofficeMain extends UmbContextProviderMixin(UmbContextConsume
});
}
private _getSectionElement(section: ManifestSection) {
if (!section.loader || !section.elementName || !section.js) {
return UmbSectionElement;
}
return createExtensionElement(section);
}
private _onRouteSetup = (_component: HTMLElement, info: IRoutingInfo) => {
const currentPath = info.match.route.path;
const section = this._sections.find((s) => this._routePrefix + s.meta.pathname === currentPath);

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

@@ -1,60 +0,0 @@
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
import type { ManifestDashboard } 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<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>`;
}
}
declare global {
interface HTMLElementTagNameMap {
'umb-content-section': UmbContentSection;
}
}

43
src/Umbraco.Web.UI.Client/src/backoffice/sections/content/manifests.ts Normal file
View File

@@ -0,0 +1,43 @@
import type { ManifestDashboard, ManifestSection } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Content';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Content Section',
weight: 600,
meta: {
label: 'Content',
pathname: 'content',
},
};
const dashboards: Array<ManifestDashboard> = [
{
type: 'dashboard',
alias: 'Umb.Dashboard.Welcome',
name: 'Welcome Dashboard',
loader: () => import('../../dashboards/welcome/dashboard-welcome.element'),
weight: 20,
meta: {
label: 'Welcome',
sections: [sectionAlias],
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: [sectionAlias],
pathname: 'redirect-management',
},
},
];
export const manifests = [section, ...dashboards];

99
src/Umbraco.Web.UI.Client/src/backoffice/sections/manifests.ts
View File

@@ -1,84 +1,19 @@
import type { ManifestSection } from '@umbraco-cms/models';
import { manifests as contentSectionManifests } from './content/manifests';
import { manifests as mediaSectionManifests } from './media/manifests';
import { manifests as memberSectionManifests } from './members/manifests';
import { manifests as packageSectionManifests } from './packages/manifests';
import { manifests as settingsSectionManifests } from './settings/manifests';
import { manifests as translationSectionManifests } from './translation/manifests';
import { manifests as userSectionManifests } from './users/manifests';
export const manifests: Array<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',
loader: () => import('./packages/section-packages.element'),
weight: 200,
meta: {
label: 'Packages',
pathname: 'packages',
},
},
{
type: 'section',
alias: 'Umb.Section.Users',
name: 'Users Section',
loader: () => import('./users/section-users.element'),
weight: 100,
meta: {
label: 'Users',
pathname: 'users',
},
},
{
type: 'section',
alias: 'Umb.Section.Translation',
name: 'Translation Section',
loader: () => import('./translation/translation-section.element'),
weight: 100,
meta: {
label: 'Translation',
pathname: 'translation',
},
},
import type { ManifestDashboard, ManifestSection, ManifestSectionView } from '@umbraco-cms/models';
export const manifests: Array<ManifestSection | ManifestDashboard | ManifestSectionView> = [
...contentSectionManifests,
...mediaSectionManifests,
...memberSectionManifests,
...packageSectionManifests,
...settingsSectionManifests,
...translationSectionManifests,
...userSectionManifests,
];

31
src/Umbraco.Web.UI.Client/src/backoffice/sections/media/manifests.ts Normal file
View File

@@ -0,0 +1,31 @@
import type { ManifestDashboard, ManifestSection } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Media';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Media Section',
weight: 500,
meta: {
label: 'Media',
pathname: 'media',
},
};
const dashboards: Array<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: [sectionAlias],
pathname: 'media-management',
},
},
];
export const manifests = [section, ...dashboards];

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

@@ -1,47 +0,0 @@
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 } 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<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>`;
}
}
declare global {
interface HTMLElementTagNameMap {
'umb-media-section': UmbMediaSection;
}
}

16
src/Umbraco.Web.UI.Client/src/backoffice/sections/members/manifests.ts Normal file
View File

@@ -0,0 +1,16 @@
import type { ManifestSection } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Members';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Members Section',
weight: 400,
meta: {
label: 'Members',
pathname: 'members',
},
};
export const manifests = [section];

17
src/Umbraco.Web.UI.Client/src/backoffice/sections/members/section-members.element.ts
View File

@@ -1,17 +0,0 @@
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
@customElement('umb-section-members')
export class UmbSectionMembersElement extends LitElement {
render() {
return html`<umb-section></umb-section>`;
}
}
export default UmbSectionMembersElement;
declare global {
interface HTMLElementTagNameMap {
'umb-section-members': UmbSectionMembersElement;
}
}

58
src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/manifests.ts Normal file
View File

@@ -0,0 +1,58 @@
import type { ManifestSection, ManifestSectionView } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Packages';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Packages Section',
weight: 200,
meta: {
label: 'Packages',
pathname: 'packages',
},
};
const sectionsViews: Array<ManifestSectionView> = [
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Repo',
name: 'Packages Repo Section View',
loader: () => import('./views/repo/section-view-packages-repo.element'),
meta: {
sections: [sectionAlias],
label: 'Packages',
pathname: 'packages',
weight: 300,
icon: 'umb:cloud',
},
},
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Installed',
name: 'Installed Packages Section View',
loader: () => import('./views/installed/section-view-packages-installed.element'),
meta: {
sections: [sectionAlias],
label: 'Installed',
pathname: 'installed',
weight: 200,
icon: 'umb:box',
},
},
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Builder',
name: 'Packages Builder Section View',
loader: () => import('./views/created/section-view-packages-created.element'),
meta: {
sections: [sectionAlias],
label: 'Created',
pathname: 'created',
weight: 100,
icon: 'umb:files',
},
},
];
export const manifests = [section, ...sectionsViews];

75
src/Umbraco.Web.UI.Client/src/backoffice/sections/packages/section-packages.element.ts
View File

@@ -1,75 +0,0 @@
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
import { UmbContextConsumerMixin } from '@umbraco-cms/context-api';
import type { ManifestSectionView } from '@umbraco-cms/models';
@customElement('umb-section-packages')
export class UmbSectionPackages extends UmbContextConsumerMixin(LitElement) {
constructor() {
super();
this._registerSectionViews();
}
private _registerSectionViews() {
const manifests: Array<ManifestSectionView> = [
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Repo',
name: 'Packages Repo Section View',
loader: () => import('./views/repo/section-view-packages-repo.element'),
meta: {
sections: ['Umb.Section.Packages'],
label: 'Packages',
pathname: 'packages',
weight: 300,
icon: 'umb:cloud',
},
},
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Installed',
name: 'Installed Packages Section View',
loader: () => import('./views/installed/section-view-packages-installed.element'),
meta: {
sections: ['Umb.Section.Packages'],
label: 'Installed',
pathname: 'installed',
weight: 200,
icon: 'umb:box',
},
},
{
type: 'sectionView',
alias: 'Umb.SectionView.Packages.Builder',
name: 'Packages Builder Section View',
loader: () => import('./views/created/section-view-packages-created.element'),
meta: {
sections: ['Umb.Section.Packages'],
label: 'Created',
pathname: 'created',
weight: 100,
icon: 'umb:files',
},
},
];
manifests.forEach((manifest) => {
if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;
umbExtensionsRegistry.register(manifest);
});
}
render() {
return html`<umb-section></umb-section>`;
}
}
export default UmbSectionPackages;
declare global {
interface HTMLElementTagNameMap {
'umb-section-packages': UmbSectionPackages;
}
}

97
src/Umbraco.Web.UI.Client/src/backoffice/sections/settings/manifests.ts Normal file
View File

@@ -0,0 +1,97 @@
import type { ManifestDashboard, ManifestSection } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Settings';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Settings Section',
weight: 300,
meta: {
label: 'Settings',
pathname: 'settings',
},
};
const dashboards: Array<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: [sectionAlias],
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: [sectionAlias],
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: [sectionAlias],
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: [sectionAlias],
pathname: 'published-status',
},
},
{
type: 'dashboard',
alias: 'Umb.Dashboard.Profiling',
name: 'Profiling',
elementName: 'umb-dashboard-performance-profiling',
loader: () => import('../../dashboards/performance-profiling/dashboard-performance-profiling.element'),
weight: 101,
meta: {
label: 'Profiling',
sections: [sectionAlias],
pathname: 'profiling',
},
},
{
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: [sectionAlias],
pathname: 'telemetry',
},
},
];
export const manifests = [section, ...dashboards];

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

@@ -1,113 +0,0 @@
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
import type { ManifestDashboard } from '@umbraco-cms/models';
@customElement('umb-section-settings')
export class UmbSectionSettingsElement extends LitElement {
constructor() {
super();
this._registerDashboards();
}
private _registerDashboards() {
const dashboards: Array<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.Profiling',
name: 'Profiling',
elementName: 'umb-dashboard-performance-profiling',
loader: () => import('../../dashboards/performance-profiling/dashboard-performance-profiling.element'),
weight: 101,
meta: {
label: 'Profiling',
sections: ['Umb.Section.Settings'],
pathname: 'profiling',
},
},
{
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>`;
}
}
export default UmbSectionSettingsElement;
declare global {
interface HTMLElementTagNameMap {
'umb-section-settings': UmbSectionSettingsElement;
}
}

16
src/Umbraco.Web.UI.Client/src/backoffice/sections/translation/manifests.ts Normal file
View File

@@ -0,0 +1,16 @@
import type { ManifestSection } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Translation';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Translation Section',
weight: 100,
meta: {
label: 'Translation',
pathname: 'translation',
},
};
export const manifests = [section];

20
src/Umbraco.Web.UI.Client/src/backoffice/sections/translation/translation-section.element.ts
View File

@@ -1,20 +0,0 @@
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
@customElement('umb-translation-section')
export class UmbTranslationSection extends LitElement {
static styles = [UUITextStyles];
render() {
return html`<umb-section></umb-section>`;
}
}
export default UmbTranslationSection;
declare global {
interface HTMLElementTagNameMap {
'umb-translation-section': UmbTranslationSection;
}
}

45
src/Umbraco.Web.UI.Client/src/backoffice/sections/users/manifests.ts Normal file
View File

@@ -0,0 +1,45 @@
import type { ManifestSection, ManifestSectionView } from '@umbraco-cms/models';
const sectionAlias = 'Umb.Section.Users';
const section: ManifestSection = {
type: 'section',
alias: sectionAlias,
name: 'Users Section',
weight: 100,
meta: {
label: 'Users',
pathname: 'users',
},
};
const sectionsViews: Array<ManifestSectionView> = [
{
type: 'sectionView',
alias: 'Umb.SectionView.Users.Users',
name: 'Users Section View',
loader: () => import('./views/users/section-view-users.element'),
meta: {
sections: [sectionAlias],
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: [sectionAlias],
label: 'User Groups',
pathname: 'user-groups',
weight: 100,
icon: 'umb:users',
},
},
];
export const manifests = [section, ...sectionsViews];

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

@@ -12,34 +12,7 @@ export class UmbSectionUsersElement extends LitElement {
}
private _registerSectionViews() {
const manifests: Array<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',
},
},
];
const manifests: Array<ManifestSectionView> = [];
manifests.forEach((manifest) => {
if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;