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

Block editors: adds prefix to workspace title (closes #20588) (#20884)

Browse Source 
* Adds `$settings` to the block workspace label renderer

* Adds a prefix to the Block workspace title

* Imports tidy-up
This commit is contained in:
Lee Kelleher
2025-11-27 15:39:27 +01:00
committed by GitHub
parent c61bcca066
commit 615cb76288
2 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace-editor.element.ts
View File

@@ -1,8 +1,6 @@
import { UMB_BLOCK_WORKSPACE_CONTEXT } from './index.js';
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import { customElement, css, html, state } from '@umbraco-cms/backoffice/external/lit';
import { css, customElement, html, state } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import { observeMultiple } from '@umbraco-cms/backoffice/observable-api';
@customElement('umb-block-workspace-editor')
export class UmbBlockWorkspaceEditorElement extends UmbLitElement {
@@ -11,10 +9,9 @@ export class UmbBlockWorkspaceEditorElement extends UmbLitElement {
this.consumeContext(UMB_BLOCK_WORKSPACE_CONTEXT, (context) => {
if (context) {
this.observe(
observeMultiple([context.isNew, context.name]),
([isNew, name]) => {
this._headline =
this.localize.term(isNew ? 'general_add' : 'general_edit') + ' ' + this.localize.string(name);
context.name,
(name) => {
this._headline = this.localize.string(name);
},
'observeOwnerContentElementTypeName',
);
@@ -32,7 +29,6 @@ export class UmbBlockWorkspaceEditorElement extends UmbLitElement {
}
static override readonly styles = [
UmbTextStyles,
css`
:host {
display: block;

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

@@ -113,8 +113,8 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
this.observe(
observeMultiple([this.content.values, this.settings.values]),
async ([contentValues]) => {
this.#renderLabel(contentValues);
async ([contentValues, settingsValues]) => {
this.#renderLabel(contentValues, settingsValues);
},
'observeContentForLabelRender',
);
@@ -243,11 +243,14 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
#gotLabel(label: string | undefined) {
if (label) {
this.#labelRender.markdown = label;
this.#renderLabel(this.content.getValues());
this.#renderLabel(this.content.getValues(), this.settings.getValues());
}
}
async #renderLabel(contentValues: Array<UmbBlockDataValueModel> | undefined) {
async #renderLabel(
contentValues: Array<UmbBlockDataValueModel> | undefined,
settingsValues: Array<UmbBlockDataValueModel> | undefined,
) {
const valueObject = {} as Record<string, unknown>;
if (contentValues) {
for (const property of contentValues) {
@@ -255,12 +258,22 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
}
}
if (settingsValues) {
valueObject['$settings'] = settingsValues;
}
// TODO: Look to add support for `$index`, requires wiring up the block-entry with the workspace. [LK]
//valueObject['$index'] = 0;
this.#labelRender.value = valueObject;
// Await one animation frame:
await new Promise((resolve) => requestAnimationFrame(() => resolve(true)));
const result = this.#labelRender.toString();
this.#name.setValue(result);
this.view.setTitle(result);
const prefix = this.getIsNew() === true ? '#general_add' : '#general_edit';
const label = this.#labelRender.toString();
const title = `${prefix} ${label}`;
this.#name.setValue(title);
this.view.setTitle(title);
}
#allowNavigateAway = false;