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

Fix: 17274 (#17578)

Browse Source 
* remove log

* styling of inline editing expose button

* mock data for blocks

* fix settings values

* fix setting config

* remove console logs

---------

Co-authored-by: Mads Rasmussen <madsr@hey.com>
This commit is contained in:
Niels Lyngsø
2024-11-20 11:07:30 +01:00
committed by GitHub
parent 3ee43e2f1d
commit 01d66875b2
7 changed files with 366 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
src/Umbraco.Web.UI.Client/src/mocks/data/document-type/document-type.data.ts
View File

@@ -1825,4 +1825,78 @@ Search for **dt-richTextEditorTinyMce** in the codebase to find the configuratio
keepLatestVersionPerDayForDays: null,
},
},
{
allowedTemplates: [],
defaultTemplate: null,
id: 'block-editors-document-type-id',
alias: 'blogPost',
name: 'Block Editors document type',
description: null,
icon: 'icon-item-arrangement',
allowedAsRoot: true,
variesByCulture: true,
variesBySegment: false,
isElement: false,
hasChildren: false,
parent: null,
isFolder: false,
properties: [
{
id: '18',
container: { id: 'content-group-key' },
alias: 'blockList',
name: 'Block List',
description: '',
dataType: { id: 'dt-blockList' },
variesByCulture: false,
variesBySegment: false,
sortOrder: -2,
validation: {
mandatory: true,
mandatoryMessage: null,
regEx: null,
regExMessage: null,
},
appearance: {
labelOnTop: false,
},
},
{
id: '22',
container: { id: 'content-group-key' },
alias: 'blockGrid',
name: 'Block Grid',
description: '',
dataType: { id: 'dt-blockGrid' },
variesByCulture: false,
variesBySegment: false,
sortOrder: -1,
validation: {
mandatory: true,
mandatoryMessage: null,
regEx: null,
regExMessage: null,
},
appearance: {
labelOnTop: false,
},
},
],
containers: [
{
id: 'content-group-key',
parent: null,
name: 'Content',
type: 'Group',
sortOrder: 0,
},
],
allowedDocumentTypes: [],
compositions: [],
cleanup: {
preventCleanup: false,
keepAllVersionsNewerThanDays: null,
keepLatestVersionPerDayForDays: null,
},
},
];

263
src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts
View File

@@ -929,4 +929,267 @@ export const data: Array<UmbMockDocumentModel> = [
},
],
},
{
urls: [
{
culture: 'en-US',
url: '/',
},
],
template: null,
id: 'block-editors-document-id',
parent: null,
documentType: {
id: 'block-editors-document-type-id',
icon: 'icon-document',
},
hasChildren: false,
noAccess: false,
isProtected: false,
isTrashed: false,
values: [
{
editorAlias: 'Umbraco.BlockList',
alias: 'blockList',
culture: null,
segment: null,
value: {
layout: {
'Umbraco.BlockList': [
{
contentKey: '1234',
settingsKey: '5678',
},
{
contentKey: '1234-headline',
settingsKey: '1234-headline-settings',
},
],
},
contentData: [
{
key: '1234',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world',
},
],
},
{
key: '1234-headline',
contentTypeKey: 'headline-umbraco-demo-block-id',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'headline',
culture: null,
segment: null,
value: 'Hello world',
},
],
},
],
settingsData: [
{
key: '5678',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Im in settings',
},
],
},
{
key: '1234-headline-settings',
contentTypeKey: 'headline-settings-demo-block-id',
values: [],
},
],
expose: [
{
contentKey: '1234',
culture: null,
segment: null,
},
],
},
},
{
editorAlias: 'Umbraco.BlockGrid',
alias: 'blockGrid',
culture: null,
segment: null,
value: {
layout: {
'Umbraco.BlockGrid': [
{
contentKey: '1234',
settingsKey: '5678',
columnSpan: 12,
areas: [
{
key: 'area1_key',
items: [
{
contentKey: 'a1234',
settingsKey: 'a5678',
columnSpan: 3,
rowSpan: 2,
},
{
contentKey: 'c1234',
columnSpan: 3,
},
],
},
{
key: 'area2_key',
items: [
{
contentKey: 'b1234',
settingsKey: 'b5678',
columnSpan: 6,
areas: [],
},
],
},
],
},
],
},
contentData: [
{
key: '1234',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Im in settings',
},
],
},
{
key: 'a1234',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world from area 1',
},
],
},
{
key: 'b1234',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world from area 2',
},
],
},
{
key: 'c1234',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello CCC from area 1',
},
],
},
],
settingsData: [
{
key: '5678',
contentTypeKey: 'all-property-editors-document-type-id',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world settings',
},
],
},
{
key: 'a5678',
contentTypeKey: 'all-property-editors-document-type-id',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world from area 1 settings',
},
],
},
{
key: 'b5678',
contentTypeKey: '4f68ba66-6fb2-4778-83b8-6ab4ca3a7c5c',
values: [
{
editorAlias: 'Umbraco.TextBox',
alias: 'elementProperty',
culture: null,
segment: null,
value: 'Hello world from area 2 settings',
},
],
},
],
expose: [
{
contentKey: '1234',
culture: null,
segment: null,
},
],
},
},
],
variants: [
{
state: DocumentVariantStateModel.PUBLISHED,
publishDate: '2023-02-06T15:31:51.354764',
culture: 'en-US',
segment: null,
name: 'All Block Editors',
createDate: '2023-02-06T15:31:46.876902',
updateDate: '2023-02-06T15:31:51.354764',
},
{
state: DocumentVariantStateModel.PUBLISHED,
publishDate: '2023-02-06T15:31:51.354764',
culture: 'da-dk',
segment: null,
name: 'Alle blok redigeringer',
createDate: '2023-02-06T15:31:46.876902',
updateDate: '2023-02-06T15:31:51.354764',
},
],
},
];

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

@@ -157,7 +157,7 @@ export class UmbBlockGridBlockInlineElement extends UmbLitElement {
<slot></slot>
<slot name="tag"></slot>
</button>
<div id="inside">${this.#renderInside()}</div>
${this.#renderInside()}
</div>
`;
}
@@ -184,10 +184,12 @@ export class UmbBlockGridBlockInlineElement extends UmbLitElement {
.args=${[this._ownerContentTypeName, this._variantName]}></umb-localize
></uui-button>`;
} else {
return html`<umb-property-type-based-property
return html`<div id="inside">
<umb-property-type-based-property
.property=${this._inlineProperty}
slot="areas"></umb-property-type-based-property>
<umb-block-grid-areas-container slot="areas"></umb-block-grid-areas-container>`;
<umb-block-grid-areas-container slot="areas"></umb-block-grid-areas-container>
</div>`;
}
}

2
src/Umbraco.Web.UI.Client/src/packages/block/block-grid/context/block-grid-manager.context.ts
View File

@@ -71,7 +71,7 @@ export class UmbBlockGridManagerContext<
override setEditorConfiguration(configs: UmbPropertyEditorConfigCollection) {
this.#initAppUrl.then(() => {
// we await initAppUrl, So the appUrl begin here is available when retrieving the layoutStylesheet.
this._editorConfiguration.setValue(configs);
super.setEditorConfiguration(configs);
});
}

43
src/Umbraco.Web.UI.Client/src/packages/block/block/context/block-entry.context.ts
View File

@@ -91,7 +91,7 @@ export abstract class UmbBlockEntryContext<
_layout = new UmbObjectState<BlockLayoutType | undefined>(undefined);
public readonly layout = this._layout.asObservable();
public readonly contentKey = this._layout.asObservablePart((x) => x?.contentKey);
public readonly settingsKey = this._layout.asObservablePart((x) => x?.settingsKey);
public readonly settingsKey = this._layout.asObservablePart((x) => (x ? (x.settingsKey ?? null) : undefined));
public readonly unique = this._layout.asObservablePart((x) => x?.contentKey);
#label = new UmbStringState('');
@@ -218,7 +218,7 @@ export abstract class UmbBlockEntryContext<
#settings = new UmbObjectState<UmbBlockDataModel | undefined>(undefined);
//public readonly settings = this.#settings.asObservable();
protected readonly _settingsValueArray = this.#content.asObservablePart((x) => x?.values);
protected readonly _settingsValueArray = this.#settings.asObservablePart((x) => x?.values);
private readonly settingsDataContentTypeKey = this.#settings.asObservablePart((x) =>
x ? (x.contentTypeKey ?? undefined) : null,
);
@@ -296,7 +296,6 @@ export abstract class UmbBlockEntryContext<
this.settingsDataContentTypeKey,
(settingsElementTypeKey) => {
if (!settingsElementTypeKey) return;
this.#getSettingsStructure(settingsElementTypeKey);
},
null,
@@ -335,17 +334,17 @@ export abstract class UmbBlockEntryContext<
);
this.observe(
observeMultiple([this.layout, this.blockType]),
([layout, blockType]) => {
if (!this.#contentKey || !layout || !blockType) return;
if (layout.settingsKey == null && blockType.settingsElementTypeKey) {
observeMultiple([this.settingsKey, this.blockType]),
([settingsKey, blockType]) => {
if (!this.#contentKey || settingsKey === undefined || !blockType) return;
if (settingsKey == null && blockType.settingsElementTypeKey) {
// We have a settings ElementType in config but not in data, so lets create the scaffold for that: [NL]
const settingsData = this._manager!.createBlockSettingsData(blockType.contentElementTypeKey); // Yes its on purpose we use the contentElementTypeKey here, as this is our identifier for a BlockType. [NL]
this._manager?.setOneSettings(settingsData);
this._layout.update({ settingsKey: settingsData.key } as Partial<BlockLayoutType>);
} else if (layout.settingsKey && blockType.settingsElementTypeKey === undefined) {
} else if (settingsKey && blockType.settingsElementTypeKey === undefined) {
// We no longer have settings ElementType in config. So we remove the settingsData and settings key from the layout. [NL]
this._manager?.removeOneSettings(layout.settingsKey);
this._manager?.removeOneSettings(settingsKey);
this._layout.update({ settingsKey: undefined } as Partial<BlockLayoutType>);
}
},
@@ -464,18 +463,22 @@ export abstract class UmbBlockEntryContext<
);
}
#observeSettingsData() {
if (!this._manager) return;
// observe settings:
const settingsKey = this._layout.value?.settingsKey;
if (settingsKey) {
this.observe(
this._manager.settingsOf(settingsKey),
(settings) => {
this.#settings.setValue(settings);
},
'observeSettings',
);
}
this.observe(
this._manager ? this.settingsKey : undefined,
(settingsKey) => {
if (settingsKey) {
this.observe(
this._manager?.settingsOf(settingsKey),
(settings) => {
this.#settings.setValue(settings);
},
'observeSettings',
);
}
},
'observeSettingsKey',
);
}
abstract _gotContentType(contentType: UmbContentTypeModel | undefined): void;

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

@@ -249,7 +249,6 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
);
this.#observeBlockData(unique);
if (this.#liveEditingMode) {
this.establishLiveSync();
}

2
src/Umbraco.Web.UI.Client/src/packages/core/modal/context/modal.context.ts
View File

@@ -73,8 +73,6 @@ export class UmbModalContext<
this.element = args.modal?.element || this.element;
this.backdropBackground = args.modal?.backdropBackground || this.backdropBackground;
console.log('size', size);
this.#size.setValue(size);
const defaultData = this.alias instanceof UmbModalToken ? this.alias.getDefaultData() : undefined;