pretty urls

src/Umbraco.Web.UI.Client/src/app.ts

@@ -125,7 +125,7 @@ export class UmbApp extends UmbContextProviderMixin(LitElement) {
       if (!this._isAuthorized() || window.location.pathname === '/install') {
         this._router.push('/login');
       } else {
-        const next = window.location.pathname === '/' ? '/section/Content' : window.location.pathname;
+        const next = window.location.pathname === '/' ? '/section/content' : window.location.pathname;
         this._router.push(next);
       }
     } catch (error) {

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

@@ -133,7 +133,7 @@ export class UmbBackofficeHeader extends UmbContextConsumerMixin(LitElement) {
     }
 
     // TODO: this could maybe be handled by an anchor tag
-    this._router?.push(`/section/${section.name}`);
+    this._router?.push(`/section/${section.meta.pathname}`);
     this._sectionContext?.setCurrent(section.alias);
   }
 
@@ -177,9 +177,7 @@ export class UmbBackofficeHeader extends UmbContextConsumerMixin(LitElement) {
       .subscribe((sectionExtensions: any) => {
         this._sections = sectionExtensions.filter((section: any) => this._allowedSection.includes(section.alias));
         this._visibleSections = this._sections;
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const currentSectionAlias = this._sections.find(section => section.name === this._location?.params?.section)?.alias;
+        const currentSectionAlias = this._sections.find(section => section.meta.pathname === this._location?.params?.section)?.alias;
         if (!currentSectionAlias) return;
         this._sectionContext?.setCurrent(currentSectionAlias);
       });

src/Umbraco.Web.UI.Client/src/content/content-dashboards.element.ts

@@ -72,15 +72,15 @@ export class UmbContentDashboards extends UmbContextConsumerMixin(LitElement) {
 
       // TODO: Temp redirect solution
       if (dashboardLocation === 'undefined') {
-        this._router?.push(`/section/${sectionLocation}/dashboard/${this._dashboards[0].name}`);
+        this._router?.push(`/section/${sectionLocation}/dashboard/${this._dashboards[0].meta.pathname}`);
         this._setCurrent(this._dashboards[0]);
         return;
       }
 
-      const dashboard = this._dashboards.find(dashboard => dashboard.name === dashboardLocation);
+      const dashboard = this._dashboards.find(dashboard => dashboard.meta.pathname === dashboardLocation);
 
       if (!dashboard) {
-        this._router?.push(`/section/${sectionLocation}/dashboard/${this._dashboards[0].name}`);
+        this._router?.push(`/section/${sectionLocation}/dashboard/${this._dashboards[0].meta.pathname}`);
         this._setCurrent(this._dashboards[0]);
         return;
       }
@@ -92,7 +92,7 @@ export class UmbContentDashboards extends UmbContextConsumerMixin(LitElement) {
   private _handleTabClick(e: PointerEvent, dashboard: UmbExtensionManifest) {
     // TODO: this could maybe be handled by an anchor tag
     const section = this._location?.params?.section;
-    this._router?.push(`/section/${section}/dashboard/${dashboard.name}`);
+    this._router?.push(`/section/${section}/dashboard/${dashboard.meta.pathname}`);
     this._setCurrent(dashboard);
   }
 
@@ -124,7 +124,6 @@ export class UmbContentDashboards extends UmbContextConsumerMixin(LitElement) {
             label=${dashboard.name}
             ?active="${this._current === dashboard.name}"
             @click="${(e: PointerEvent) => this._handleTabClick(e, dashboard)}"></uui-tab>
-          
         `)}
       </uui-tab-group>
       ${ this._outlet }

src/Umbraco.Web.UI.Client/src/core/extension/extension.registry.ts

@@ -10,7 +10,7 @@ export interface UmbExtensionManifestBase {
   name: string;
   js?: string | (() => Promise<unknown>);
   elementName?: string;
-  meta: unknown;
+  meta: any;
 }
 
 export type UmbExtensionManifestSection = {
@@ -31,6 +31,7 @@ export type UmbExtensionManifestDashboard = {
 export type UmbExtensionManifest = UmbExtensionManifestBase | UmbExtensionManifestSection | UmbExtensionManifestPropertyEditor;
 
 export interface UmbManifestSectionMeta {
+  pathname: string, // TODO: how to we want to support pretty urls?
   weight: number;
 }
 
@@ -43,6 +44,7 @@ export interface UmbManifestPropertyEditorMeta {
 
 export interface UmbManifestDashboardMeta {
   sections: Array<string>;
+  pathname: string; // TODO: how to we want to support pretty urls?
   weight: number;
 }
 

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

@@ -34,6 +34,7 @@ const registerInternalManifests = async () => {
       elementName: 'umb-content-section',
       js: () => import('./content/content-section.element'),
       meta: {
+        pathname: 'content', // TODO: how to we want to support pretty urls?
         weight: 50
       }
     },
@@ -43,6 +44,7 @@ const registerInternalManifests = async () => {
       name: 'Members',
       elementName: 'umb-members-section',
       meta: {
+        pathname: 'members',
         weight: 30
       }
     },
@@ -53,6 +55,7 @@ const registerInternalManifests = async () => {
       elementName: 'umb-settings-section',
       js: () => import('./settings/settings-section.element'),
       meta: {
+        pathname: 'settings', // TODO: how to we want to support pretty urls?
         weight: 20
       }
     },
@@ -64,6 +67,7 @@ const registerInternalManifests = async () => {
       js: () => import('./dashboards/dashboard-welcome.element'),
       meta: {
         sections: ['Umb.Section.Content'],
+        pathname: 'welcome', // TODO: how to we want to support pretty urls?
         weight: 20
       }
     },
@@ -75,6 +79,7 @@ const registerInternalManifests = async () => {
       js: () => import('./dashboards/dashboard-redirect-management.element'),
       meta: {
         sections: ['Umb.Section.Content'],
+        pathname: 'redirect-management', // TODO: how to we want to support pretty urls?
         weight: 10
       }
     },

src/Umbraco.Web.UI.Client/src/mocks/domains/manifests.handlers.ts

@@ -14,6 +14,7 @@ export const handlers = [
             name: 'Custom',
             elementName: 'umb-custom-section',
             meta: {
+              pathname: 'my-custom',
               weight: 30,
             },
           },