diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/collection/collection-view.manager.ts b/src/Umbraco.Web.UI.Client/src/packages/core/collection/collection-view.manager.ts index d4e64dda29..de7554132e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/collection/collection-view.manager.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/collection/collection-view.manager.ts @@ -1,8 +1,13 @@ import { UmbBaseController } from '@umbraco-cms/backoffice/class-api'; import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; -import { UmbExtensionsManifestInitializer } from '@umbraco-cms/backoffice/extension-api'; +import { UmbExtensionsManifestInitializer, createExtensionElement } from '@umbraco-cms/backoffice/extension-api'; import { ManifestCollectionView, umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry'; import { UmbArrayState, UmbObjectState, UmbStringState } from '@umbraco-cms/backoffice/observable-api'; +import { UmbRoute } from '@umbraco-cms/backoffice/router'; + +export interface UmbCollectionViewManagerConfig { + defaultViewAlias: string; +} export class UmbCollectionViewManager extends UmbBaseController { #views = new UmbArrayState([], (x) => x.alias); @@ -11,12 +16,18 @@ export class UmbCollectionViewManager extends UmbBaseController { #currentView = new UmbObjectState(undefined); public readonly currentView = this.#currentView.asObservable(); + #routes = new UmbArrayState([], (x) => x.path); + public readonly routes = this.#routes.asObservable(); + #rootPathname = new UmbStringState(''); public readonly rootPathname = this.#rootPathname.asObservable(); - constructor(host: UmbControllerHost) { + #defaultViewAlias?: string; + + constructor(host: UmbControllerHost, config: UmbCollectionViewManagerConfig) { super(host); + this.#defaultViewAlias = config.defaultViewAlias; this.#observeViews(); // TODO: hack - we need to figure out how to get the "parent path" from the router @@ -47,25 +58,36 @@ export class UmbCollectionViewManager extends UmbBaseController { #observeViews() { return new UmbExtensionsManifestInitializer(this, umbExtensionsRegistry, 'collectionView', null, (views) => { - this.#views.next(views.map((view) => view.manifest)); - this.#initCurrentView(); + const manifests = views.map((view) => view.manifest); + this.#views.next(manifests); + this.#createRoutes(manifests); }); } - #initCurrentView() { - // if we already have a current view, don't set it again - if (this.#currentView.getValue()) return; + #createRoutes(views: ManifestCollectionView[] | null) { + let routes: Array = []; - const currentUrl = new URL(window.location.href); - const lastPathSegment = currentUrl.pathname.split('/').pop(); - const views = this.#views.getValue(); - const viewMatch = views.find((view) => view.meta.pathName === lastPathSegment); + if (views) { + // find the default view from the config. If it doesn't exist, use the first view + const defaultView = views.find((view) => view.alias === this.#defaultViewAlias); + const fallbackView = defaultView?.meta.pathName || views[0].meta.pathName; - /* TODO: Find a way to figure out which layout it starts with and set _currentLayout to that instead of [0]. eg. '/table' - For document, media and members this will come as part of a data type configuration, but in other cases "users" we should find another way. - This should only happen if the current layout is not set in the URL. - */ - const currentView = viewMatch || views[0]; - this.setCurrentView(currentView); + routes = views.map((view) => { + return { + path: `${view.meta.pathName}`, + component: () => createExtensionElement(view), + setup: () => { + this.setCurrentView(view); + }, + }; + }); + + routes.push({ + path: '', + redirectTo: fallbackView, + }); + } + + this.#routes.next(routes); } } diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts b/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts index 32e5c2a242..1bed3493e5 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts @@ -41,16 +41,17 @@ export class UmbDefaultCollectionContext { this.#collectionContext = instance; - - this.#observeCollectionViews(); + this.#observeCollectionRoutes(); }); } - #observeCollectionViews() { + #observeCollectionRoutes() { if (!this.#collectionContext) return; - this.observe(this.#collectionContext.view.views, (views) => { - this.#createRoutes(views); + this.observe(this.#collectionContext.view.routes, (routes) => { + this._routes = routes; }), - 'umbCollectionViewsObserver'; - } - - #createRoutes(views: ManifestCollectionView[] | null) { - this._routes = []; - - if (views) { - this._routes = views.map((view) => { - return { - path: `${view.meta.pathName}`, - component: () => createExtensionElement(view), - }; - }); - } - - this._routes.push({ - path: '', - redirectTo: views?.[0]?.meta.pathName ?? '/', - }); - - this.requestUpdate(); + 'umbCollectionRoutesObserver'; } render() { diff --git a/src/Umbraco.Web.UI.Client/src/packages/user/user/collection/user-collection.context.ts b/src/Umbraco.Web.UI.Client/src/packages/user/user/collection/user-collection.context.ts index b14a2521d3..03373333b4 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/user/user/collection/user-collection.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/user/user/collection/user-collection.context.ts @@ -1,4 +1,5 @@ import { UmbUserCollectionFilterModel, UmbUserDetailModel } from '../types.js'; +import { UMB_COLLECTION_VIEW_USER_GRID } from './views/index.js'; import { UmbDefaultCollectionContext } from '@umbraco-cms/backoffice/collection'; import { UserOrderModel, UserStateModel } from '@umbraco-cms/backoffice/backend-api'; import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api'; @@ -8,7 +9,7 @@ export class UmbUserCollectionContext extends UmbDefaultCollectionContext< UmbUserCollectionFilterModel > { constructor(host: UmbControllerHostElement) { - super(host, { pageSize: 50 }); + super(host, { pageSize: 50, defaultViewAlias: UMB_COLLECTION_VIEW_USER_GRID }); } /**