diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-entries.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-entries.context.ts index fa1755c4b7..d516788ba8 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-entries.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-entries.context.ts @@ -34,7 +34,7 @@ export class UmbBlockGridEntriesContext extends UmbBlockEntriesContext< super(host, UMB_BLOCK_GRID_MANAGER_CONTEXT); this.#catalogueModal = new UmbModalRouteRegistrationController(this, UMB_BLOCK_CATALOGUE_MODAL) - .addUniquePaths(['propertyAlias', 'parentUnique', 'areaKey']) + .addUniquePaths(['propertyAlias', 'variantId', 'parentUnique', 'areaKey']) .addAdditionalPath(':view/:index') .onSetup((routingInfo) => { // Idea: Maybe on setup should be async, so it can retrieve the values when needed? [NL] @@ -64,6 +64,16 @@ export class UmbBlockGridEntriesContext extends UmbBlockEntriesContext< }, 'observePropertyAlias', ); + + this.observe( + this._manager.variantId, + (variantId) => { + if (variantId) { + this.#catalogueModal.setUniquePathValue('variantId', variantId.toString()); + } + }, + 'observePropertyAlias', + ); } getPathForCreateBlock(index: number) { diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block-manager.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block-manager.context.ts index 0a1d8f88d7..ef75f2c20c 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block-manager.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block-manager.context.ts @@ -11,6 +11,7 @@ import type { UmbContentTypeModel } from '@umbraco-cms/backoffice/content-type'; import { UmbId } from '@umbraco-cms/backoffice/id'; import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor'; import { UMB_PROPERTY_CONTEXT } from '@umbraco-cms/backoffice/property'; +import type { UmbVariantId } from '@umbraco-cms/backoffice/variant'; export type UmbBlockDataObjectModel = { layout: LayoutEntryType; @@ -31,6 +32,9 @@ export abstract class UmbBlockManagerContext< #propertyAlias = new UmbStringState(undefined); propertyAlias = this.#propertyAlias.asObservable(); + #variantId = new UmbClassState(undefined); + variantId = this.#variantId.asObservable(); + #contentTypes = new UmbArrayState(>[], (x) => x.unique); public readonly contentTypes = this.#contentTypes.asObservable(); @@ -89,13 +93,15 @@ export abstract class UmbBlockManagerContext< propertyContext?.alias, (alias) => { this.#propertyAlias.setValue(alias); + this.#workspaceModal.setUniquePathValue('propertyAlias', alias); }, 'observePropertyAlias', ); this.observe( propertyContext?.variantId, (variantId) => { - // TODO: This might not be the property variant ID, but the content variant ID. Check up on what makes most sense. + this.#variantId.setValue(variantId); + // TODO: This might not be the property variant ID, but the content variant ID. Check up on what makes most sense? this.#workspaceModal.setUniquePathValue('variantId', variantId?.toString()); }, 'observePropertyVariantId', @@ -112,10 +118,6 @@ export abstract class UmbBlockManagerContext< const newPath = routeBuilder({}); this.#workspacePath.setValue(newPath); }); - - this.observe(this.propertyAlias, (alias) => { - this.#workspaceModal.setUniquePathValue('propertyAlias', alias); - }); } async ensureContentType(unique?: string) { diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts index c30beee6fe..951e761bcd 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts @@ -64,12 +64,16 @@ export class UmbBlockWorkspaceContext< this.#retrieveBlockManager = this.consumeContext(UMB_BLOCK_MANAGER_CONTEXT, (context) => { this.#blockManager = context; - this.#editorConfigPromise = this.observe(context.editorConfiguration, (editorConfigs) => { - if (editorConfigs) { - const value = editorConfigs.getValueByAlias('useLiveEditing'); - this.#liveEditingMode = value; - } - }).asPromise(); + this.#editorConfigPromise = this.observe( + context.editorConfiguration, + (editorConfigs) => { + if (editorConfigs) { + const value = editorConfigs.getValueByAlias('useLiveEditing'); + this.#liveEditingMode = value; + } + }, + 'observeEditorConfig', + ).asPromise(); }).asPromise(); this.#retrieveBlockEntries = this.consumeContext(UMB_BLOCK_ENTRIES_CONTEXT, (context) => {