@umbraco-cms/backoffice 18.2.1 → 18.3.0-rc

package/dist-cms/packages/core/menu/menu-tree-structure-workspace-context-base.js

@@ -1,13 +1,15 @@
 import { UMB_MENU_STRUCTURE_WORKSPACE_CONTEXT } from './menu-structure-workspace-context.context-token.js';
 import { UMB_SECTION_SIDEBAR_MENU_SECTION_CONTEXT } from './section-sidebar-menu/index.js';
-import { createExtensionApiByAlias } from '../extension-registry/index.js';
-import { linkEntityExpansionEntries } from '../utils/index.js';
-import { UmbArrayState } from '../../../libs/observable-api/index.js';
+import { createExtensionApiByAlias, umbExtensionsRegistry } from '../extension-registry/index.js';
+import { debounce, linkEntityExpansionEntries } from '../utils/index.js';
 import { UmbAncestorsEntityContext, UmbParentEntityContext } from '../entity/index.js';
+import { UmbArrayState } from '../../../libs/observable-api/index.js';
 import { UmbContextBase } from '../../../libs/class-api/index.js';
+import { UmbRequestReloadStructureForEntityEvent } from '../entity-action/index.js';
+import { UMB_ACTION_EVENT_CONTEXT } from '../action/index.js';
 import { UMB_MODAL_CONTEXT } from '../modal/index.js';
 import { UMB_SECTION_CONTEXT } from '../section/index.js';
-import { UMB_SUBMITTABLE_TREE_ENTITY_WORKSPACE_CONTEXT, UMB_WORKSPACE_EDIT_PATH_PATTERN, } from '../workspace/index.js';
+import { UMB_SUBMITTABLE_TREE_ENTITY_WORKSPACE_CONTEXT, UMB_WORKSPACE_EDIT_PATH_PATTERN, UMB_WORKSPACE_PATH_PATTERN, } from '../workspace/index.js';
 // TODO: introduce base class for all menu structure workspaces to handle ancestors and parent
 export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
     #workspaceContext;
@@ -18,6 +20,10 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
     #sectionSidebarMenuContext;
     #isModalContext;
     #isNew;
+    #actionEventContext;
+    #structureRequestId;
+    // Coalesces the unique/isNew/reload-event triggers when they fire in quick succession.
+    #requestStructure;
     constructor(host, args) {
         super(host, UMB_MENU_STRUCTURE_WORKSPACE_CONTEXT);
         this.#structure = new UmbArrayState([], (x) => x.unique);
@@ -26,6 +32,14 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
         this.#ancestorContext = new UmbAncestorsEntityContext(this);
         this.#isModalContext = false;
         this.#isNew = undefined;
+        this.#structureRequestId = 0;
+        // Coalesces the unique/isNew/reload-event triggers when they fire in quick succession.
+        this.#requestStructure = debounce(() => this.#requestStructureImpl(), 100);
+        this.#onReloadStructureForEntityRequest = (event) => {
+            if (!this.#isCurrentEntityOrAncestor(event.getEntityType(), event.getUnique()))
+                return;
+            this.#requestStructure();
+        };
         this.#args = args;
         this.consumeContext(UMB_MODAL_CONTEXT, (modalContext) => {
             this.#isModalContext = modalContext !== undefined;
@@ -33,6 +47,11 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
         this.consumeContext(UMB_SECTION_CONTEXT, (instance) => {
             this._sectionContext = instance;
         });
+        this.consumeContext(UMB_ACTION_EVENT_CONTEXT, (instance) => {
+            this.#removeEventListeners();
+            this.#actionEventContext = instance;
+            this.#addEventListeners();
+        });
         this.consumeContext(UMB_SECTION_SIDEBAR_MENU_SECTION_CONTEXT, (instance) => {
             this.#sectionSidebarMenuContext = instance;
         });
@@ -41,31 +60,69 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
             this.observe(this.#workspaceContext?.unique, (value) => {
                 if (!value)
                     return;
+                // Clear immediately so the previous entity's breadcrumb/structure isn't shown while the new one loads.
+                this.#clearStructure();
                 this.#requestStructure();
             }, 'observeUnique');
-            this.observe(this.#workspaceContext?.isNew, (value) => {
-                // Workspace has changed from new to existing
-                if (value === false && this.#isNew === true) {
-                    // TODO: We do not need to request here as we already know the structure and unique
+            // isNew is observed on its own, separate from the structure fetch, so the expand decision never
+            // depends on which of the two happens to settle first: whichever settles last (isNew resolving to
+            // false, or the structure fetch resolving) is the one that actually triggers the expand.
+            this.observe(this.#workspaceContext?.isNew, (isNew) => {
+                // The item has just been created: the structure fetched while new was based on the parent (the
+                // item didn't exist yet), so it must be re-fetched using the item's own identity - otherwise the
+                // structure never ends with the item itself, which the breadcrumb relies on when trimming it.
+                if (isNew === false && this.#isNew === true) {
                     this.#requestStructure();
                 }
-                this.#isNew = value;
+                else if (isNew === false) {
+                    this.#tryExpandSectionSidebarMenu();
+                }
+                this.#isNew = isNew;
             }, 'observeIsNew');
         });
     }
     getItemHref(structureItem) {
-        if (structureItem.isFolder || !structureItem.unique)
+        if (!this.#hasWorkspaceForEntityType(structureItem.entityType))
             return undefined;
         const sectionName = this._sectionContext?.getPathname();
         if (!sectionName)
             return undefined;
+        if (structureItem.unique === null) {
+            // The root has no unique, so it can't use the edit-by-unique link below - its workspace is
+            // reached by entity type alone.
+            return UMB_WORKSPACE_PATH_PATTERN.generateAbsolute({
+                sectionName,
+                entityType: structureItem.entityType,
+            });
+        }
         return UMB_WORKSPACE_EDIT_PATH_PATTERN.generateAbsolute({
             sectionName,
             entityType: structureItem.entityType,
             unique: structureItem.unique,
         });
     }
-    async #requestStructure() {
+    #hasWorkspaceForEntityType(entityType) {
+        return umbExtensionsRegistry
+            .getByType('workspace')
+            .some((manifest) => manifest.meta?.entityType === entityType);
+    }
+    #addEventListeners() {
+        this.#actionEventContext?.addEventListener(UmbRequestReloadStructureForEntityEvent.TYPE, this.#onReloadStructureForEntityRequest);
+    }
+    #removeEventListeners() {
+        this.#actionEventContext?.removeEventListener(UmbRequestReloadStructureForEntityEvent.TYPE, this.#onReloadStructureForEntityRequest);
+    }
+    #onReloadStructureForEntityRequest;
+    #isCurrentEntityOrAncestor(entityType, unique) {
+        if (entityType === this.#workspaceContext?.getEntityType() && unique === this.#workspaceContext?.getUnique()) {
+            return true;
+        }
+        return this.#ancestorContext
+            .getAncestors()
+            .some((ancestor) => ancestor.entityType === entityType && ancestor.unique === unique);
+    }
+    async #requestStructureImpl() {
+        const requestId = ++this.#structureRequestId;
         const isNew = this.#workspaceContext?.getIsNew();
         const uniqueObservable = isNew
             ? this.#workspaceContext?._internal_createUnderParentEntityUnique
@@ -119,15 +176,42 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
         // Guard: this context may have been destroyed while the async requests were in flight.
         if (!this._host)
             return;
+        // Guard: a newer request has superseded this one; its result would already be stale.
+        if (requestId !== this.#structureRequestId)
+            return;
         if (ancestorData) {
             this.#setAncestorData(ancestorData);
         }
         this.#structure.setValue(structureItems);
         this.#setParentData(structureItems);
+        this.#tryExpandSectionSidebarMenu();
+    }
+    /**
+     * Expands the parent in the section sidebar menu, but only once we know for certain the item isn't still being
+     * created, and only once the structure has actually been fetched. Reads both conditions fresh, so it's safe to
+     * call from either the structure-fetch completion or the isNew observer, whichever settles last.
+     */
+    #tryExpandSectionSidebarMenu() {
         const menuItemAlias = this.manifest?.meta?.menuItemAlias;
-        if (menuItemAlias && !this.#isModalContext) {
-            this.#expandSectionSidebarMenu(structureItems, menuItemAlias);
-        }
+        if (!menuItemAlias || this.#isModalContext)
+            return;
+        // Don't expand the parent for an item that hasn't been created yet.
+        if (this.#workspaceContext?.getIsNew() !== false)
+            return;
+        const structureItems = this.#structure.getValue();
+        if (!structureItems.length)
+            return;
+        // This can run mid-navigation to a different entity, before `unique` itself has been updated - `getUnique()`
+        // is then transiently undefined (distinct from a legitimate `null`, e.g. a root entity), which would defeat
+        // the "exclude the current entity" filter below and expand the outgoing entity's still-cached structure.
+        if (this.#workspaceContext?.getUnique() === undefined)
+            return;
+        this.#expandSectionSidebarMenu(structureItems, menuItemAlias);
+    }
+    #clearStructure() {
+        this.#structure.setValue([]);
+        this.#parentContext.setParent(undefined);
+        this.#ancestorContext.setAncestors([]);
     }
     #setParentData(structureItems) {
         /* If the item is not new, the current item is the last item in the array.
@@ -171,6 +255,8 @@ export class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
         this.#sectionSidebarMenuContext?.expansion.expandItems(expandableItemsWithMenuItem);
     }
     destroy() {
+        this.#requestStructure.cancel();
+        this.#removeEventListeners();
         super.destroy();
         this.#structure.destroy();
         this.#parentContext.destroy();

package/dist-cms/packages/core/menu/menu-tree-structure-workspace-context.test-utils.d.ts

@@ -0,0 +1,84 @@
+import type { ManifestApi } from '../../../libs/extension-api/index.js';
+import type { UmbControllerHost } from '../../../libs/controller-api/index.js';
+import type { UmbEntityModel } from '../entity/index.js';
+import type { UmbTreeItemModel, UmbTreeRootModel } from '../tree/index.js';
+import { UmbContextBase } from '../../../libs/class-api/index.js';
+declare const UmbTestMenuStructureControllerHostElement_base: import("../../../libs/extension-api/index.js").HTMLElementConstructor<import("../../../libs/controller-api/index.js").UmbControllerHostElement> & {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+export declare class UmbTestMenuStructureControllerHostElement extends UmbTestMenuStructureControllerHostElement_base {
+}
+/**
+ * A minimal `UmbSubmittableTreeEntityWorkspaceContext` stand-in — stands in for a real document/document-type/etc.
+ * workspace context in isolated tests. Only implements what `UmbMenuTreeStructureWorkspaceContextBase` reads, plus
+ * the two properties (`requestSubmit`, `_internal_createUnderParent`) the context token's discriminator checks for.
+ */
+export declare class UmbTestSubmittableTreeEntityWorkspaceContext {
+    #private;
+    readonly workspaceAlias = "Umb.Test.Workspace";
+    readonly unique: import("rxjs").Observable<string | null | undefined>;
+    readonly entityType: import("rxjs").Observable<string | undefined>;
+    readonly isNew: import("rxjs").Observable<boolean | undefined>;
+    readonly _internal_createUnderParent: import("rxjs").Observable<UmbEntityModel | undefined>;
+    readonly _internal_createUnderParentEntityUnique: import("rxjs").Observable<string | null | undefined>;
+    readonly _internal_createUnderParentEntityType: import("rxjs").Observable<string | undefined>;
+    constructor(host: UmbControllerHost);
+    getHostElement(): Element;
+    getUnique(): string | null | undefined;
+    getEntityType(): string | undefined;
+    getIsNew(): boolean | undefined;
+    setUnique(unique: string | null): void;
+    setEntityType(entityType: string): void;
+    setIsNew(value: boolean | undefined): void;
+    setCreateUnderParent(parent: UmbEntityModel): void;
+    /**
+     * Reproduces `UmbEntityDetailWorkspaceContextBase.load()`'s exact ordering when the same workspace context
+     * instance is reused to navigate to a different existing entity: `isNew` resets and re-settles to `false`
+     * (with `getUnique()` transiently undefined throughout) before `unique` itself is updated.
+     * @param {string} unique - The unique of the entity being navigated to.
+     */
+    loadDifferentEntity(unique: string): void;
+    requestSubmit(): Promise<void>;
+    destroy(): void;
+}
+export declare class UmbTestTreeRepository {
+    static root: UmbTreeRootModel;
+    static ancestors: Array<UmbTreeItemModel>;
+    static requestTreeItemAncestorsCalls: Array<UmbEntityModel>;
+    static reset(): void;
+    requestTreeRoot(): Promise<{
+        data: UmbTreeRootModel;
+    }>;
+    requestTreeItemAncestors(args: {
+        treeItem: UmbEntityModel;
+    }): Promise<{
+        data: UmbTreeItemModel[];
+    }>;
+    destroy(): void;
+}
+export declare const createTestTreeRepositoryManifest: (alias: string) => ManifestApi;
+export declare function createTestAncestorItem(entity: UmbEntityModel, name?: string): UmbTreeItemModel;
+/**
+ * A minimal `UmbSectionContext` stand-in, providing a fixed pathname for `getItemHref` link generation.
+ */
+export declare class UmbTestSectionContext extends UmbContextBase {
+    static readonly PATHNAME = "test-section";
+    constructor(host: UmbControllerHost);
+    getPathname(): string;
+}
+/**
+ * A minimal `UmbSectionSidebarMenuSectionContext` stand-in. It only implements `expansion.expandItems`,
+ * recording each call so a test can check whether — and how often — the parent tree item was expanded.
+ */
+export declare class UmbTestSectionSidebarMenuContext {
+    #private;
+    static expandItemsCalls: Array<unknown>;
+    static reset(): void;
+    readonly expansion: {
+        expandItems: (entries: unknown) => void;
+    };
+    constructor(host: UmbControllerHost);
+    getHostElement(): Element;
+}
+export {};

package/dist-cms/packages/core/menu/menu-tree-structure-workspace-context.test-utils.js

@@ -0,0 +1,175 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { UmbControllerHostElementMixin } from '../../../libs/controller-api/index.js';
+import { customElement } from '../../../external/lit/index.js';
+import { UmbBooleanState, UmbObjectState, UmbStringState } from '../../../libs/observable-api/index.js';
+import { UmbContextBase } from '../../../libs/class-api/index.js';
+import { UMB_SECTION_CONTEXT } from '../section/index.js';
+let UmbTestMenuStructureControllerHostElement = class UmbTestMenuStructureControllerHostElement extends UmbControllerHostElementMixin(HTMLElement) {
+};
+UmbTestMenuStructureControllerHostElement = __decorate([
+    customElement('umb-test-menu-structure-controller-host')
+], UmbTestMenuStructureControllerHostElement);
+export { UmbTestMenuStructureControllerHostElement };
+/**
+ * A minimal `UmbSubmittableTreeEntityWorkspaceContext` stand-in — stands in for a real document/document-type/etc.
+ * workspace context in isolated tests. Only implements what `UmbMenuTreeStructureWorkspaceContextBase` reads, plus
+ * the two properties (`requestSubmit`, `_internal_createUnderParent`) the context token's discriminator checks for.
+ */
+export class UmbTestSubmittableTreeEntityWorkspaceContext {
+    #host;
+    #unique;
+    #entityType;
+    #isNew;
+    #createUnderParentUnique;
+    #createUnderParentEntityType;
+    // Mirrors `UmbEntityDetailWorkspaceContextBase.getUnique()`, which returns undefined once the previous
+    // entity's data has been cleared but before the new `unique` has been set.
+    #dataCleared;
+    constructor(host) {
+        this.#unique = new UmbObjectState(undefined);
+        this.#entityType = new UmbStringState(undefined);
+        this.#isNew = new UmbBooleanState(undefined);
+        this.#createUnderParentUnique = new UmbObjectState(undefined);
+        this.#createUnderParentEntityType = new UmbStringState(undefined);
+        // Mirrors `UmbEntityDetailWorkspaceContextBase.getUnique()`, which returns undefined once the previous
+        // entity's data has been cleared but before the new `unique` has been set.
+        this.#dataCleared = false;
+        this.workspaceAlias = 'Umb.Test.Workspace';
+        this.unique = this.#unique.asObservable();
+        this.entityType = this.#entityType.asObservable();
+        this.isNew = this.#isNew.asObservable();
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        this._internal_createUnderParent = new UmbObjectState(undefined).asObservable();
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        this._internal_createUnderParentEntityUnique = this.#createUnderParentUnique.asObservable();
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        this._internal_createUnderParentEntityType = this.#createUnderParentEntityType.asObservable();
+        this.#host = host;
+    }
+    getHostElement() {
+        return this.#host.getHostElement();
+    }
+    getUnique() {
+        if (this.#dataCleared)
+            return undefined;
+        return this.#unique.getValue();
+    }
+    getEntityType() {
+        return this.#entityType.getValue();
+    }
+    getIsNew() {
+        return this.#isNew.getValue();
+    }
+    setUnique(unique) {
+        this.#unique.setValue(unique);
+    }
+    setEntityType(entityType) {
+        this.#entityType.setValue(entityType);
+    }
+    setIsNew(value) {
+        this.#isNew.setValue(value);
+    }
+    setCreateUnderParent(parent) {
+        this.#createUnderParentUnique.setValue(parent.unique);
+        this.#createUnderParentEntityType.setValue(parent.entityType);
+    }
+    /**
+     * Reproduces `UmbEntityDetailWorkspaceContextBase.load()`'s exact ordering when the same workspace context
+     * instance is reused to navigate to a different existing entity: `isNew` resets and re-settles to `false`
+     * (with `getUnique()` transiently undefined throughout) before `unique` itself is updated.
+     * @param {string} unique - The unique of the entity being navigated to.
+     */
+    loadDifferentEntity(unique) {
+        this.#dataCleared = true;
+        this.#isNew.setValue(undefined);
+        this.#isNew.setValue(false);
+        this.#dataCleared = false;
+        this.#unique.setValue(unique);
+    }
+    async requestSubmit() { }
+    destroy() { }
+}
+/**
+ * A minimal `UmbTreeRepository` stand-in, registered into `umbExtensionsRegistry` under whichever alias the
+ * context-under-test expects. Root and ancestors are static so a test can configure the response before
+ * triggering a structure request, regardless of which repository alias/instance ends up used.
+ */
+const DEFAULT_TEST_ROOT = {
+    unique: null,
+    entityType: 'test-root-entity-type',
+    name: 'Root',
+    isFolder: false,
+    hasChildren: false,
+};
+export class UmbTestTreeRepository {
+    static { this.root = DEFAULT_TEST_ROOT; }
+    static { this.ancestors = []; }
+    static { this.requestTreeItemAncestorsCalls = []; }
+    static reset() {
+        UmbTestTreeRepository.root = DEFAULT_TEST_ROOT;
+        UmbTestTreeRepository.ancestors = [];
+        UmbTestTreeRepository.requestTreeItemAncestorsCalls = [];
+    }
+    async requestTreeRoot() {
+        return { data: UmbTestTreeRepository.root };
+    }
+    async requestTreeItemAncestors(args) {
+        UmbTestTreeRepository.requestTreeItemAncestorsCalls.push(args.treeItem);
+        return { data: UmbTestTreeRepository.ancestors };
+    }
+    destroy() { }
+}
+export const createTestTreeRepositoryManifest = (alias) => ({
+    type: 'repository',
+    alias,
+    name: 'Test Tree Repository',
+    api: UmbTestTreeRepository,
+});
+export function createTestAncestorItem(entity, name = entity.unique ?? 'unnamed') {
+    return {
+        ...entity,
+        name,
+        isFolder: false,
+        hasChildren: false,
+        parent: { unique: null, entityType: 'test-root-entity-type' },
+    };
+}
+/**
+ * A minimal `UmbSectionContext` stand-in, providing a fixed pathname for `getItemHref` link generation.
+ */
+export class UmbTestSectionContext extends UmbContextBase {
+    static { this.PATHNAME = 'test-section'; }
+    constructor(host) {
+        super(host, UMB_SECTION_CONTEXT);
+    }
+    getPathname() {
+        return UmbTestSectionContext.PATHNAME;
+    }
+}
+/**
+ * A minimal `UmbSectionSidebarMenuSectionContext` stand-in. It only implements `expansion.expandItems`,
+ * recording each call so a test can check whether — and how often — the parent tree item was expanded.
+ */
+export class UmbTestSectionSidebarMenuContext {
+    static { this.expandItemsCalls = []; }
+    static reset() {
+        UmbTestSectionSidebarMenuContext.expandItemsCalls = [];
+    }
+    #host;
+    constructor(host) {
+        this.expansion = {
+            expandItems: (entries) => {
+                UmbTestSectionSidebarMenuContext.expandItemsCalls.push(entries);
+            },
+        };
+        this.#host = host;
+    }
+    getHostElement() {
+        return this.#host.getHostElement();
+    }
+}

package/dist-cms/packages/core/menu/menu-variant-structure-workspace-context.interface.d.ts

@@ -1,7 +1,5 @@
 import type { UmbVariantStructureItemModel } from './types.js';
-import type { UmbContext } from '../../../libs/class-api/index.js';
-import type { Observable } from '../../../external/rxjs/index.js';
-export interface UmbMenuVariantStructureWorkspaceContext extends UmbContext {
-    structure: Observable<UmbVariantStructureItemModel[]>;
+import type { UmbMenuStructureWorkspaceContext } from './menu-structure-workspace-context.interface.js';
+export interface UmbMenuVariantStructureWorkspaceContext extends UmbMenuStructureWorkspaceContext<UmbVariantStructureItemModel> {
     getItemHref(structureItem: UmbVariantStructureItemModel): string | undefined;
 }

package/dist-cms/packages/core/menu/menu-variant-tree-structure-workspace-context-base.d.ts

@@ -1,11 +1,12 @@
 import type { ManifestWorkspaceContextMenuStructureKind, UmbVariantStructureItemModel } from './types.js';
+import type { UmbMenuVariantStructureWorkspaceContext } from './menu-variant-structure-workspace-context.interface.js';
 import { UmbContextBase } from '../../../libs/class-api/index.js';
-import type { UmbControllerHost } from '../../../libs/controller-api/index.js';
 import { UMB_SECTION_CONTEXT } from '../section/index.js';
+import type { UmbControllerHost } from '../../../libs/controller-api/index.js';
 interface UmbMenuVariantTreeStructureWorkspaceContextBaseArgs {
     treeRepositoryAlias: string;
 }
-export declare abstract class UmbMenuVariantTreeStructureWorkspaceContextBase extends UmbContextBase {
+export declare abstract class UmbMenuVariantTreeStructureWorkspaceContextBase extends UmbContextBase implements UmbMenuVariantStructureWorkspaceContext {
     #private;
     manifest?: ManifestWorkspaceContextMenuStructureKind;
     readonly structure: import("rxjs").Observable<UmbVariantStructureItemModel[]>;