hotfix: Correct context tokens for menu structure based workspaces

src/Umbraco.Web.UI.Client/eslint.config.js

@@ -80,6 +80,7 @@ export default [
 			'@typescript-eslint/consistent-type-exports': 'error',
 			'@typescript-eslint/consistent-type-imports': 'error',
 			'@typescript-eslint/no-import-type-side-effects': 'warn',
+			'@typescript-eslint/no-deprecated': 'warn',
 		},
 	},
 

src/Umbraco.Web.UI.Client/src/packages/content/content-type/workspace/content-type-workspace-context-base.ts

@@ -82,7 +82,7 @@ export abstract class UmbContentTypeWorkspaceContextBase<
 	): Promise<DetailModelType | undefined> {
 		this.resetState();
 		this.loading.addState({ unique: LOADING_STATE_UNIQUE, message: `Creating ${this.getEntityType()} scaffold` });
-		this.setParent(args.parent);
+		this._internal_setCreateUnderParent(args.parent);
 
 		const request = this.structure.createScaffold(args.preset);
 		this._getDataPromise = request;

src/Umbraco.Web.UI.Client/src/packages/content/content/workspace/content-detail-workspace-base.ts

@@ -754,7 +754,7 @@ export abstract class UmbContentDetailWorkspaceContextBase<
 
 			// We ask the server first to get a concatenated set of validation messages. So we see both front-end and back-end validation messages [NL]
 			if (this.getIsNew()) {
-				const parent = this.getParent();
+				const parent = this._internal_getCreateUnderParent();
 				if (!parent) throw new Error('Parent is not set');
 				await this.#serverValidation.askServerForValidation(
 					saveData,
@@ -885,7 +885,7 @@ export abstract class UmbContentDetailWorkspaceContextBase<
 	async #create(variantIds: Array<UmbVariantId>, saveData: DetailModelType) {
 		if (!this._detailRepository) throw new Error('Detail repository is not set');
 
-		const parent = this.getParent();
+		const parent = this._internal_getCreateUnderParent();
 		if (!parent) throw new Error('Parent is not set');
 
 		const { data, error } = await this._detailRepository.create(saveData, parent.unique);

src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts

@@ -25,7 +25,7 @@ import {
 } from '@umbraco-cms/backoffice/entity-action';
 import type { UmbActionEventContext } from '@umbraco-cms/backoffice/action';
 import { UMB_ACTION_EVENT_CONTEXT } from '@umbraco-cms/backoffice/action';
-import { UMB_ENTITY_CONTEXT } from '@umbraco-cms/backoffice/entity';
+import { UMB_ENTITY_CONTEXT, UmbParentEntityContext, type UmbEntityModel } from '@umbraco-cms/backoffice/entity';
 import { UMB_WORKSPACE_MODAL } from '@umbraco-cms/backoffice/workspace';
 import { UmbModalRouteRegistrationController, type UmbModalRouteBuilder } from '@umbraco-cms/backoffice/router';
 
@@ -83,6 +83,7 @@ export class UmbDefaultCollectionContext<
 	});
 
 	#actionEventContext: UmbActionEventContext | undefined;
+	#parentEntityContext = new UmbParentEntityContext(this);
 
 	constructor(host: UmbControllerHost, defaultViewAlias: string, defaultFilter: Partial<FilterModelType> = {}) {
 		super(host, UMB_COLLECTION_CONTEXT);
@@ -92,6 +93,23 @@ export class UmbDefaultCollectionContext<
 
 		this.pagination.addEventListener(UmbChangeEvent.TYPE, this.#onPageChange);
 		this.#listenToEntityEvents();
+
+		// The parent entity context is used to get the parent entity for the collection items
+		// All items in the collection are children of the current entity context
+		this.consumeContext(UMB_ENTITY_CONTEXT, (context) => {
+			const currentEntityUnique = context?.getUnique();
+			const currentEntityType = context?.getEntityType();
+
+			const parent: UmbEntityModel | undefined =
+				currentEntityUnique && currentEntityType
+					? {
+							unique: currentEntityUnique,
+							entityType: currentEntityType,
+						}
+					: undefined;
+
+			this.#parentEntityContext?.setParent(parent);
+		});
 	}
 
 	setupView(viewElement: UmbControllerHost) {

src/Umbraco.Web.UI.Client/src/packages/core/entity/constants.ts

@@ -1 +1,2 @@
 export * from './contexts/ancestors/constants.js';
+export * from './contexts/parent/constants.js';

src/Umbraco.Web.UI.Client/src/packages/core/entity/contexts/parent/constants.ts

@@ -0,0 +1 @@
+export { UMB_PARENT_ENTITY_CONTEXT } from './parent.entity-context-token.js';

src/Umbraco.Web.UI.Client/src/packages/core/entity/contexts/parent/index.ts

@@ -0,0 +1 @@
+export { UmbParentEntityContext } from './parent.entity-context.js';

src/Umbraco.Web.UI.Client/src/packages/core/entity/contexts/parent/parent.entity-context-token.ts

@@ -0,0 +1,4 @@
+import type { UmbParentEntityContext } from './parent.entity-context.js';
+import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
+
+export const UMB_PARENT_ENTITY_CONTEXT = new UmbContextToken<UmbParentEntityContext>('UmbParentEntityContext');

src/Umbraco.Web.UI.Client/src/packages/core/entity/contexts/parent/parent.entity-context.ts

@@ -0,0 +1,38 @@
+import type { UmbEntityModel } from '../../types.js';
+import { UMB_PARENT_ENTITY_CONTEXT } from './parent.entity-context-token.js';
+import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
+import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
+import { UmbObjectState } from '@umbraco-cms/backoffice/observable-api';
+
+/**
+ * A entity context for the parent
+ * @class UmbParentEntityContext
+ * @augments {UmbContextBase}
+ * @implements {UmbParentEntityContext}
+ */
+export class UmbParentEntityContext extends UmbContextBase {
+	#parent = new UmbObjectState<UmbEntityModel | undefined>(undefined);
+	parent = this.#parent.asObservable();
+
+	constructor(host: UmbControllerHost) {
+		super(host, UMB_PARENT_ENTITY_CONTEXT);
+	}
+
+	/**
+	 * Gets the parent state
+	 * @returns {UmbEntityModel | undefined} - The parent state
+	 * @memberof UmbParentEntityContext
+	 */
+	getParent(): UmbEntityModel | undefined {
+		return this.#parent.getValue();
+	}
+
+	/**
+	 * Sets the parent state
+	 * @param {UmbEntityModel | undefined} parent - The parent state
+	 * @memberof UmbParentEntityContext
+	 */
+	setParent(parent: UmbEntityModel | undefined): void {
+		this.#parent.setValue(parent);
+	}
+}

src/Umbraco.Web.UI.Client/src/packages/core/entity/index.ts

@@ -2,4 +2,6 @@ export { UMB_ENTITY_CONTEXT } from './entity.context-token.js';
 export { UmbEntityContext } from './entity.context.js';
 export * from './constants.js';
 export * from './contexts/ancestors/index.js';
+export * from './contexts/parent/index.js';
+
 export type * from './types.js';

src/Umbraco.Web.UI.Client/src/packages/core/menu/index.ts

@@ -1,5 +1,7 @@
 export * from './components/index.js';
 export * from './menu-tree-structure-workspace-context-base.js';
+export * from './menu-structure-workspace-context.context-token.js';
+export * from './menu-variant-structure-workspace-context.context-token.js';
 export * from './menu-variant-tree-structure-workspace-context-base.js';
 
 export type * from './types.js';

src/Umbraco.Web.UI.Client/src/packages/core/menu/menu-structure-workspace-context.context-token.ts

@@ -0,0 +1,7 @@
+import type { UmbMenuStructureWorkspaceContext } from './menu-structure-workspace-context.interface.js';
+import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
+
+export const UMB_MENU_STRUCTURE_WORKSPACE_CONTEXT = new UmbContextToken<UmbMenuStructureWorkspaceContext>(
+	'UmbWorkspaceContext',
+	'UmbMenuStructure',
+);

src/Umbraco.Web.UI.Client/src/packages/core/menu/menu-tree-structure-workspace-context-base.ts

@@ -1,32 +1,41 @@
 import type { UmbStructureItemModel } from './types.js';
+import { UMB_MENU_STRUCTURE_WORKSPACE_CONTEXT } from './menu-structure-workspace-context.context-token.js';
 import type { UmbTreeRepository, UmbTreeItemModel, UmbTreeRootModel } from '@umbraco-cms/backoffice/tree';
 import { createExtensionApiByAlias } from '@umbraco-cms/backoffice/extension-registry';
 import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
-import { UMB_SUBMITTABLE_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
+import { UMB_SUBMITTABLE_TREE_ENTITY_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
 import { UmbArrayState, UmbObjectState } from '@umbraco-cms/backoffice/observable-api';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
+import { UmbAncestorsEntityContext, UmbParentEntityContext, type UmbEntityModel } from '@umbraco-cms/backoffice/entity';
 
 interface UmbMenuTreeStructureWorkspaceContextBaseArgs {
 	treeRepositoryAlias: string;
 }
 
+// TODO: introduce base class for all menu structure workspaces to handle ancestors and parent
 export abstract class UmbMenuTreeStructureWorkspaceContextBase extends UmbContextBase {
-	#workspaceContext?: typeof UMB_SUBMITTABLE_WORKSPACE_CONTEXT.TYPE;
+	#workspaceContext?: typeof UMB_SUBMITTABLE_TREE_ENTITY_WORKSPACE_CONTEXT.TYPE;
 	#args: UmbMenuTreeStructureWorkspaceContextBaseArgs;
 
 	#structure = new UmbArrayState<UmbStructureItemModel>([], (x) => x.unique);
 	public readonly structure = this.#structure.asObservable();
 
 	#parent = new UmbObjectState<UmbStructureItemModel | undefined>(undefined);
+	/**
+	 * @deprecated Will be removed in v.18: Use UMB_PARENT_ENTITY_CONTEXT instead.
+	 */
 	public readonly parent = this.#parent.asObservable();
 
+	#parentContext = new UmbParentEntityContext(this);
+	#ancestorContext = new UmbAncestorsEntityContext(this);
+
 	constructor(host: UmbControllerHost, args: UmbMenuTreeStructureWorkspaceContextBaseArgs) {
-		// TODO: set up context token
-		super(host, 'UmbMenuStructureWorkspaceContext');
+		super(host, UMB_MENU_STRUCTURE_WORKSPACE_CONTEXT);
+		// 'UmbMenuStructureWorkspaceContext' is Obsolete, will be removed in v.18
+		this.provideContext('UmbMenuStructureWorkspaceContext', this);
 		this.#args = args;
 
-		// TODO: set up context token that supports parentEntityType, parentUnique, entityType.
-		this.consumeContext(UMB_SUBMITTABLE_WORKSPACE_CONTEXT, (instance) => {
+		this.consumeContext(UMB_SUBMITTABLE_TREE_ENTITY_WORKSPACE_CONTEXT, (instance) => {
 			this.#workspaceContext = instance;
 			this.observe(this.#workspaceContext?.unique, (value) => {
 				if (!value) return;
@@ -59,35 +68,75 @@
 		const isNew = this.#workspaceContext?.getIsNew();
 
 		const entityTypeObservable = isNew
-			? (this.#workspaceContext as any)?.parentEntityType
-			: (this.#workspaceContext as any).entityType;
+			? this.#workspaceContext?._internal_createUnderParentEntityType
+			: this.#workspaceContext?.entityType;
 		const entityType = (await this.observe(entityTypeObservable, () => {})?.asPromise()) as string;
 		if (!entityType) throw new Error('Entity type is not available');
 
 		// If the entity type is different from the root entity type, then we can request the ancestors.
 		if (entityType !== root?.entityType) {
-			const uniqueObservable = isNew ? (this.#workspaceContext as any)?.parentUnique : this.#workspaceContext?.unique;
+			const uniqueObservable = isNew
+				? this.#workspaceContext?._internal_createUnderParentEntityUnique
+				: this.#workspaceContext?.unique;
 			const unique = (await this.observe(uniqueObservable, () => {})?.asPromise()) as string;
 			if (!unique) throw new Error('Unique is not available');
 
 			const { data } = await treeRepository.requestTreeItemAncestors({ treeItem: { unique, entityType } });
 
 			if (data) {
 				const ancestorItems = data.map((treeItem) => {
 					return {
 						unique: treeItem.unique,
 						entityType: treeItem.entityType,
 						name: treeItem.name,
 						isFolder: treeItem.isFolder,
 					};
 				});
 
 				structureItems.push(...ancestorItems);
+
+				this.#structure.setValue(structureItems);
+				this.#setParentData(structureItems);
+				this.#setAncestorData(data);
 			}
 		}
+	}
+
+	#setParentData(structureItems: Array<UmbStructureItemModel>) {
+		/* If the item is not new, the current item is the last item in the array. 
+			We filter out the current item unique to handle any case where it could show up */
+		const parent = structureItems.filter((item) => item.unique !== this.#workspaceContext?.getUnique()).pop();
 
-		const parent = structureItems[structureItems.length - 2];
+		// TODO: remove this when the parent gets removed from the structure interface
 		this.#parent.setValue(parent);
-		this.#structure.setValue(structureItems);
+
+		const parentEntity = parent
+			? {
+					unique: parent.unique,
+					entityType: parent.entityType,
+				}
+			: undefined;
+
+		this.#parentContext.setParent(parentEntity);
+	}
+
+	/* Notice: ancestors are based on the server "data" ancestors and are not based on the full Menu (UI) structure.
+		This will mean that any item placed in the data root will not have any ancestors. But will have a parent based on the UI structure.
+	*/
+	#setAncestorData(ancestors: Array<UmbTreeItemModel>) {
+		const ancestorEntities = ancestors
+			.map((treeItem) => {
+				const entity: UmbEntityModel = {
+					unique: treeItem.unique,
+					entityType: treeItem.entityType,
+				};
+
+				return entity;
+			})
+			/* If the item is not new, the current item is the last item in the array. 
+				We filter out the current item unique to handle any case where it could show up */
+			.filter((item) => item.unique !== this.#workspaceContext?.getUnique());
+
+		this.#ancestorContext.setAncestors(ancestorEntities);
 	}
 }

src/Umbraco.Web.UI.Client/src/packages/core/menu/menu-variant-structure-workspace-context.context-token.ts

@@ -0,0 +1,10 @@
+import type { UmbMenuVariantStructureWorkspaceContext } from './menu-variant-structure-workspace-context.interface.js';
+import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
+
+export const UMB_MENU_VARIANT_STRUCTURE_WORKSPACE_CONTEXT =
+	new UmbContextToken<UmbMenuVariantStructureWorkspaceContext>(
+		'UmbWorkspaceContext',
+		'UmbMenuStructure',
+		(context): context is UmbMenuVariantStructureWorkspaceContext =>
+			'IS_MENU_VARIANT_STRUCTURE_WORKSPACE_CONTEXT' in context,
+	);

src/Umbraco.Web.UI.Client/src/packages/core/menu/menu-variant-structure-workspace-context.interface.ts

@@ -0,0 +1,7 @@
+import type { UmbVariantStructureItemModel } from './types.js';
+import type { UmbContext } from '@umbraco-cms/backoffice/class-api';
+import type { Observable } from '@umbraco-cms/backoffice/external/rxjs';
+
+export interface UmbMenuVariantStructureWorkspaceContext extends UmbContext {
+	structure: Observable<UmbVariantStructureItemModel[]>;
+}