diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/manager/block-list-manager.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/manager/block-list-manager.context.ts new file mode 100644 index 0000000000..4e72075956 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/manager/block-list-manager.context.ts @@ -0,0 +1,15 @@ +import { UmbBlockManagerContext } from '@umbraco-cms/backoffice/block'; +import { UmbContextToken } from '@umbraco-cms/backoffice/context-api'; +import { UmbId } from '@umbraco-cms/backoffice/id'; +import { buildUdi } from '@umbraco-cms/backoffice/utils'; + +export class UmbBlockListManagerContext extends UmbBlockManagerContext { + createBlock(contentElementTypeKey: string) { + return super._createBlockData({}, contentElementTypeKey); + } +} + +export const UMB_BLOCK_LIST_MANAGER_CONTEXT = new UmbContextToken< + UmbBlockListManagerContext, + UmbBlockListManagerContext +>('UmbBlockManagerContext'); diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts index 9c0e5383db..dbdc8f8110 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/property-editors/block-list-editor/property-editor-ui-block-list.element.ts @@ -7,16 +7,14 @@ import type { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/ import { UMB_BLOCK_CATALOGUE_MODAL, UmbBlockLayoutBaseModel, - UmbBlockManagerContext, UmbBlockTypeBase, type UmbBlockValueType, } from '@umbraco-cms/backoffice/block'; import '../../components/block-list-block/index.js'; -import { buildUdi } from '@umbraco-cms/backoffice/utils'; -import { UmbId } from '@umbraco-cms/backoffice/id'; import type { NumberRangeValueType } from '@umbraco-cms/backoffice/models'; import { UMB_MODAL_MANAGER_CONTEXT_TOKEN, UmbModalManagerContext } from '@umbraco-cms/backoffice/modal'; import { UmbChangeEvent } from '@umbraco-cms/backoffice/event'; +import { UmbBlockListManagerContext } from '../../manager/block-list-manager.context.js'; export interface UmbBlockListLayoutModel extends UmbBlockLayoutBaseModel {} @@ -73,7 +71,7 @@ export class UmbPropertyEditorUIBlockListElement extends UmbLitElement implement @state() private _blocks?: Array; - #context = new UmbBlockManagerContext(this); + #context = new UmbBlockListManagerContext(this); @state() _layouts: Array = []; @@ -133,13 +131,7 @@ export class UmbPropertyEditorUIBlockListElement extends UmbLitElement implement if (!block?.contentElementTypeKey) return; - this.#context.createBlock( - { - contentUdi: buildUdi('element', UmbId.new()), - settingsUdi: buildUdi('element', UmbId.new()), - }, - block.contentElementTypeKey, - ); + this.#context.createBlock(block.contentElementTypeKey); } render() { diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block.context.ts index 9d0f8daa21..155b5ec29b 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/context/block.context.ts @@ -1,6 +1,6 @@ import type { UmbBlockTypeBase } from '../../block-type/types.js'; import type { UmbBlockLayoutBaseModel, UmbBlockDataType } from '../types.js'; -import { UMB_BLOCK_MANAGER_CONTEXT, type UmbBlockManagerContext } from '../manager/index.js'; +import { UMB_BLOCK_MANAGER_CONTEXT } from '../manager/index.js'; import { UmbContextToken } from '@umbraco-cms/backoffice/context-api'; import { UmbContextBase } from '@umbraco-cms/backoffice/class-api'; import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; @@ -11,7 +11,7 @@ export class UmbBlockContext< BlockLayoutType extends UmbBlockLayoutBaseModel = UmbBlockLayoutBaseModel, > extends UmbContextBase { // - #manager?: UmbBlockManagerContext; + #manager?: typeof UMB_BLOCK_MANAGER_CONTEXT.TYPE; #blockTypeName = new UmbStringState(undefined); public readonly blockTypeName = this.#blockTypeName.asObservable(); diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/manager/block-manager.context.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/manager/block-manager.context.ts index 03d0a98523..64f7b72dd6 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/manager/block-manager.context.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/manager/block-manager.context.ts @@ -5,14 +5,15 @@ import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; import { UmbArrayState, UmbStringState } from '@umbraco-cms/backoffice/observable-api'; import { UmbDocumentTypeDetailRepository } from '@umbraco-cms/backoffice/document-type'; import { DocumentTypeResponseModel } from '@umbraco-cms/backoffice/backend-api'; -import { getKeyFromUdi } from '@umbraco-cms/backoffice/utils'; +import { buildUdi, getKeyFromUdi } from '@umbraco-cms/backoffice/utils'; import { UmbBlockTypeBase } from '@umbraco-cms/backoffice/block'; import { UMB_WORKSPACE_MODAL, UmbModalRouteRegistrationController } from '@umbraco-cms/backoffice/modal'; +import { UmbId } from '@umbraco-cms/backoffice/id'; // TODO: We are using backend model here, I think we should get our own model: type ElementTypeModel = DocumentTypeResponseModel; -export class UmbBlockManagerContext< +export abstract class UmbBlockManagerContext< BlockType extends UmbBlockTypeBase = UmbBlockTypeBase, BlockLayoutType extends UmbBlockLayoutBaseModel = UmbBlockLayoutBaseModel, > extends UmbContextBase { @@ -124,14 +125,23 @@ export class UmbBlockManagerContext< this.#settings.appendOne(settingsData); } - createBlock(layoutEntry: BlockLayoutType, contentElementTypeKey: string) { + abstract createBlock(contentElementTypeKey: string): boolean; + + protected _createBlockData(layoutEntry: Omit, contentElementTypeKey: string) { // Find block type. const blockType = this.#blockTypes.value.find((x) => x.contentElementTypeKey === contentElementTypeKey); if (!blockType) { throw new Error(`Cannot create block, missing block type for ${contentElementTypeKey}`); + return false; } - this.#layouts.appendOne(layoutEntry); + // Create layout entry: + layoutEntry.contentUdi = buildUdi('element', UmbId.new()); + if (blockType.settingsElementTypeKey) { + layoutEntry.settingsUdi = buildUdi('element', UmbId.new()); + } + + this.#layouts.appendOne(layoutEntry as BlockLayoutType); // Create content entry: if (layoutEntry.contentUdi) { @@ -141,6 +151,7 @@ export class UmbBlockManagerContext< }); } else { throw new Error('Cannot create block, missing contentUdi'); + return false; } //Create settings entry: @@ -152,8 +163,11 @@ export class UmbBlockManagerContext< }); } else { throw new Error('Cannot create block, missing settingsUdi'); + return false; } } + + return true; } deleteBlock(contentUdi: string) {