yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

give block workspace origin data to work from

Browse Source
This commit is contained in:
Niels Lyngsø
2024-11-06 13:42:45 +01:00
parent ff69e28fdb
commit c5340c186b
3 changed files with 55 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-block-inline/block-grid-block-inline.element.ts
View File

@@ -1,4 +1,6 @@
import { UMB_BLOCK_GRID_ENTRY_CONTEXT } from '../../context/block-grid-entry.context-token.js';
import type { UmbBlockGridWorkspaceOriginData } from '../../workspace/block-grid-workspace.modal-token.js';
import { UMB_BLOCK_GRID_ENTRIES_CONTEXT } from '../../context/block-grid-entries.context-token.js';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import { css, customElement, html, property, state } from '@umbraco-cms/backoffice/external/lit';
import type { UmbPropertyTypeModel } from '@umbraco-cms/backoffice/content-type';
@@ -32,6 +34,8 @@ export class UmbBlockGridBlockInlineElement extends UmbLitElement {
#blockContext?: typeof UMB_BLOCK_GRID_ENTRY_CONTEXT.TYPE;
#workspaceContext?: typeof UMB_BLOCK_WORKSPACE_CONTEXT.TYPE;
#contentKey?: string;
#parentUnique?: string | null;
#areaKey?: string | null;
@property({ attribute: false })
config?: UmbBlockEditorCustomViewConfiguration;
@@ -71,6 +75,10 @@ export class UmbBlockGridBlockInlineElement extends UmbLitElement {
'observeContentKey',
);
});
this.consumeContext(UMB_BLOCK_GRID_ENTRIES_CONTEXT, (entriesContext) => {
this.#parentUnique = entriesContext.getParentUnique();
this.#areaKey = entriesContext.getAreaKey();
});
new UmbExtensionApiInitializer(
this,
umbExtensionsRegistry,
@@ -79,7 +87,14 @@ export class UmbBlockGridBlockInlineElement extends UmbLitElement {
(permitted, ctrl) => {
const context = ctrl.api as typeof UMB_BLOCK_WORKSPACE_CONTEXT.TYPE;
if (permitted && context) {
if (this.#parentUnique === undefined || this.#areaKey === undefined) {
throw new Error('Parent unique and area key must be defined');
}
this.#workspaceContext = context;
context.setOriginData({
areaKey: this.#areaKey,
parentUnique: this.#parentUnique,
} as UmbBlockGridWorkspaceOriginData);
this.#workspaceContext.establishLiveSync();
this.#load();

21
src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-entries.context.ts
View File

@@ -99,6 +99,10 @@ export class UmbBlockGridEntriesContext
this.#catalogueModal.setUniquePathValue('parentUnique', pathFolderName(contentKey ?? 'null'));
}
getParentUnique(): string | null | undefined {
return this.#parentUnique;
}
setAreaKey(areaKey: string | null) {
this.#areaKey = areaKey;
this.#workspaceModal.setUniquePathValue('areaKey', areaKey ?? 'null');
@@ -110,6 +114,10 @@ export class UmbBlockGridEntriesContext
// If not, we want to set the layoutDataPath to a base one.
}
getAreaKey(): string | null | undefined {
return this.#areaKey;
}
setLayoutColumns(columns: number | undefined) {
this.#layoutColumns.setValue(columns);
}
@@ -157,7 +165,11 @@ export class UmbBlockGridEntriesContext
blocks: this.#allowedBlockTypes.getValue(),
blockGroups: this._manager.getBlockGroups() ?? [],
openClipboard: routingInfo.view === 'clipboard',
originData: { index: index, areaKey: this.#areaKey, parentUnique: this.#parentUnique },
originData: {
index: index,
areaKey: this.#areaKey,
parentUnique: this.#parentUnique,
} as UmbBlockGridWorkspaceOriginData,
createBlockInWorkspace: this._manager.getInlineEditingMode() === false,
},
};
@@ -195,7 +207,12 @@ export class UmbBlockGridEntriesContext
data: {
entityType: 'block',
preset: {},
originData: { areaKey: this.#areaKey, parentUnique: this.#parentUnique, baseDataPath: this._dataPath },
originData: {
index: -1,
areaKey: this.#areaKey,
parentUnique: this.#parentUnique,
baseDataPath: this._dataPath,
} as UmbBlockGridWorkspaceOriginData,
},
modal: { size: 'medium' },
};

52
src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts
View File

@@ -16,13 +16,12 @@ import {
observeMultiple,
} from '@umbraco-cms/backoffice/observable-api';
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { UMB_MODAL_CONTEXT, type UmbModalContext } from '@umbraco-cms/backoffice/modal';
import { UMB_MODAL_CONTEXT } from '@umbraco-cms/backoffice/modal';
import { decodeFilePath, UmbReadOnlyVariantStateManager } from '@umbraco-cms/backoffice/utils';
import {
UMB_BLOCK_ENTRIES_CONTEXT,
UMB_BLOCK_MANAGER_CONTEXT,
type UmbBlockWorkspaceOriginData,
type UmbBlockWorkspaceData,
UMB_BLOCK_ENTRY_CONTEXT,
} from '@umbraco-cms/backoffice/block';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
@@ -40,7 +39,11 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
#retrieveBlockManager;
#blockEntries?: typeof UMB_BLOCK_ENTRIES_CONTEXT.TYPE;
#retrieveBlockEntries;
#modalContext?: UmbModalContext<UmbBlockWorkspaceData>;
#originData?: UmbBlockWorkspaceOriginData;
// Set the origin data for this workspace. Example used by inline editing which setups the workspace context it self.
setOriginData(data: UmbBlockWorkspaceOriginData) {
this.#originData = data;
}
#retrieveModalContext;
#entityType: string;
@@ -80,7 +83,7 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
this.addValidationContext(this.settings.validation);
this.#retrieveModalContext = this.consumeContext(UMB_MODAL_CONTEXT, (context) => {
this.#modalContext = context as any;
this.#originData = context?.data.originData;
context.onSubmit().catch(this.#modalRejected);
}).asPromise();
@@ -238,19 +241,15 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
if (!this.#blockEntries) {
throw new Error('Block Entries not found');
}
if (!this.#modalContext) {
throw new Error('Modal Context not found');
if (!this.#originData) {
throw new Error('Origin data not defined');
}
// TODO: Missing some way to append more layout data... this could be part of modal data, (or context api?)
this.setIsNew(true);
const blockCreated = await this.#blockEntries.create(
contentElementTypeId,
{},
this.#modalContext.data.originData as UmbBlockWorkspaceOriginData,
);
const blockCreated = await this.#blockEntries.create(contentElementTypeId, {}, this.#originData);
if (!blockCreated) {
throw new Error('Block Entries could not create block');
}
@@ -263,7 +262,7 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
blockCreated.layout,
blockCreated.content,
blockCreated.settings,
this.#modalContext.data.originData as UmbBlockWorkspaceOriginData,
this.#originData,
);
if (!blockInserted) {
throw new Error('Block Entries could not insert block');
@@ -348,7 +347,8 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
* in the backoffice UI.
*/
establishLiveSync() {
let initialLayoutSet = true;
// Syncing Layout data is not a necessity, but it was an idea that someone might wanted to manipulate that from this workspace, but as it is giving trouble in Block Grid with Inline Editing Live Sync, then its taken out for now. [NL]
/*let initialLayoutSet = true;
this.observe(
this.layout,
(layoutData) => {
@@ -357,14 +357,11 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
initialLayoutSet = false;
return;
}
this.#blockManager?.setOneLayout(
layoutData,
this.#modalContext?.data.originData as UmbBlockWorkspaceOriginData,
);
this.#blockManager?.setOneLayout(layoutData, this.#originData);
}
},
'observeThisLayout',
);
);*/
this.observe(
this.content.data,
(contentData) => {
@@ -435,7 +432,7 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
async submit() {
const layoutData = this.#layout.value;
const contentData = this.content.getData();
if (!layoutData || !this.#blockManager || !this.#blockEntries || !contentData || !this.#modalContext) {
if (!layoutData || !this.#blockManager || !this.#blockEntries || !contentData || !this.#originData) {
throw new Error('Missing data');
}
@@ -444,19 +441,14 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
if (!this.#liveEditingMode) {
if (this.getIsNew() === true) {
// Insert (This means the layout entry will be inserted at the desired location):
const blockInserted = await this.#blockEntries.insert(
layoutData,
contentData,
settingsData,
this.#modalContext.data.originData as UmbBlockWorkspaceOriginData,
);
const blockInserted = await this.#blockEntries.insert(layoutData, contentData, settingsData, this.#originData);
if (!blockInserted) {
throw new Error('Block Entries could not insert block');
}
} else {
// Update data:
this.#blockManager.setOneLayout(layoutData, this.#modalContext.data.originData as UmbBlockWorkspaceOriginData);
this.#blockManager.setOneLayout(layoutData, this.#originData);
if (contentData) {
this.#blockManager.setOneContent(contentData);
}
@@ -493,10 +485,7 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
} else {
// Revert the layout, content & settings data to the original state: [NL]
if (this.#initialLayout) {
this.#blockManager?.setOneLayout(
this.#initialLayout,
this.#modalContext?.data.originData as UmbBlockWorkspaceOriginData,
);
this.#blockManager?.setOneLayout(this.#initialLayout, this.#originData);
}
if (this.#initialContent) {
this.#blockManager?.setOneContent(this.#initialContent);
@@ -512,8 +501,9 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
super.destroy();
this.#layout.destroy();
this.#name.destroy();
this.#layout = undefined as any;
this.#blockManager = undefined;
this.#modalContext = undefined;
this.#originData = undefined;
}
}