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

Merge branch 'main' into v14/bugfix/collection-extension-element-base

Browse Source
This commit is contained in:
Mads Rasmussen
2024-05-29 11:15:27 +02:00
committed by GitHub
parent b3f204a164 8beef1ef66
commit fe90de0051
6 changed files with 89 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/Umbraco.Web.UI.Client/package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "@umbraco-cms/backoffice",
"version": "14.0.0",
"version": "14.1.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "@umbraco-cms/backoffice",
"version": "14.0.0",
"version": "14.1.0",
"license": "MIT",
"dependencies": {
"@types/diff": "^5.2.1",

2
src/Umbraco.Web.UI.Client/package.json
View File

@@ -1,7 +1,7 @@
{
"name": "@umbraco-cms/backoffice",
"license": "MIT",
"version": "14.0.0",
"version": "14.1.0",
"type": "module",
"exports": {
".": null,

2
src/Umbraco.Web.UI.Client/src/external/diff/index.ts vendored
View File

@@ -1 +1 @@
export { diffWords } from 'diff';
export { diffWords, type Change } from 'diff';

106
src/Umbraco.Web.UI.Client/src/packages/documents/documents/modals/rollback/rollback-modal.element.ts
View File

@@ -1,8 +1,9 @@
import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from '../../workspace/index.js';
import { UMB_EDIT_DOCUMENT_WORKSPACE_PATH_PATTERN } from '../../paths.js';
import type { UmbRollbackModalData, UmbRollbackModalValue } from './rollback-modal.token.js';
import { UmbRollbackRepository } from './repository/rollback.repository.js';
import { diffWords } from '@umbraco-cms/backoffice/external/diff';
import { css, customElement, html, nothing, repeat, state } from '@umbraco-cms/backoffice/external/lit';
import { diffWords, type Change } from '@umbraco-cms/backoffice/external/diff';
import { css, customElement, html, nothing, repeat, state, unsafeHTML } from '@umbraco-cms/backoffice/external/lit';
import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
@@ -10,7 +11,6 @@ import '../shared/document-variant-language-picker.element.js';
import { UmbUserItemRepository } from '@umbraco-cms/backoffice/user';
import { UMB_PROPERTY_DATASET_CONTEXT } from '@umbraco-cms/backoffice/property';
import type { UUISelectEvent } from '@umbraco-cms/backoffice/external/uui';
import { UMB_EDIT_DOCUMENT_WORKSPACE_PATH_PATTERN } from '../../paths.js';
type DocumentVersion = {
id: string;
@@ -97,6 +97,8 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
const { data: userItems } = await this.#userItemRepository.requestItems(uniqueUserIds);
data?.items.forEach((item: any) => {
if (item.isCurrentDraftVersion) return;
tempItems.push({
date: item.versionDate,
user:
@@ -212,8 +214,7 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
@click=${(event: Event) => this.#onPreventCleanup(event, item.id, !item.preventCleanup)}
label=${item.preventCleanup
? this.localize.term('contentTypeEditor_historyCleanupEnableCleanup')
: this.localize.term('contentTypeEditor_historyCleanupPreventCleanup')}>
</uui-button>
: this.localize.term('contentTypeEditor_historyCleanupPreventCleanup')}></uui-button>
</div>
`;
},
@@ -228,7 +229,12 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
draftValues = draftValues.filter((x) => x.culture === this.currentCulture || !x.culture); // When invariant, culture is undefined or null.
const diffs = this.currentVersion.properties.map((item) => {
const diffs: Array<{ alias: string; diff: Change[] }> = [];
const nameDiff = diffWords(this.#workspaceContext?.getName() ?? '', this.currentVersion.name);
diffs.push({ alias: 'name', diff: nameDiff });
this.currentVersion.properties.forEach((item) => {
const draftValue = draftValues.find((x) => x.alias === item.alias);
if (!draftValue) return;
@@ -237,7 +243,7 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
const versionValueString = trimQuotes(JSON.stringify(item.value));
const diff = diffWords(draftValueString, versionValueString);
return { alias: item.alias, diff };
diffs.push({ alias: item.alias, diff });
});
function trimQuotes(str: string): string {
@@ -245,30 +251,39 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
}
return html`
<div id="diff">
<p>name: ${this.currentVersion.name}</p>
${unsafeHTML(this.localize.term('rollback_diffHelp'))}
<uui-table>
<uui-table-column style="width: 0"></uui-table-column>
<uui-table-column></uui-table-column>
<uui-table-head>
<uui-table-head-cell>${this.localize.term('general_alias')}</uui-table-head-cell>
<uui-table-head-cell>${this.localize.term('general_value')}</uui-table-head-cell>
</uui-table-head>
${repeat(
this.currentVersion.properties,
diffs,
(item) => item.alias,
(item) => {
const diff = diffs.find((x) => x?.alias === item.alias);
return html`
<p>
${item.alias}:
${diff
? diff.diff.map((part) =>
part.added
? html`<span class="added">${part.value}</span>`
: part.removed
? html`<span class="removed">${part.value}</span>`
: part.value,
)
: JSON.stringify(item.value)}
</p>
<uui-table-row>
<uui-table-cell>${item.alias}</uui-table-cell>
<uui-table-cell>
${diff
? diff.diff.map((part) =>
part.added
? html`<span class="diff-added">${part.value}</span>`
: part.removed
? html`<span class="diff-removed">${part.value}</span>`
: part.value,
)
: nothing}
</uui-table-cell>
</uui-table-row>
`;
},
)}
</div>
</uui-table>
`;
}
@@ -308,6 +323,9 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
static styles = [
UmbTextStyles,
css`
:host {
color: var(--uui-color-text);
}
#language-select {
display: flex;
flex-direction: column;
@@ -316,11 +334,45 @@ export class UmbRollbackModalElement extends UmbModalBaseElement<UmbRollbackModa
gap: var(--uui-size-space-2);
font-size: 15px;
}
#diff .added {
background-color: #d1ffdb;
uui-table {
--uui-table-cell-padding: var(--uui-size-space-1) var(--uui-size-space-4);
margin-top: var(--uui-size-space-5);
}
#diff .removed {
background-color: #ffd1d1;
uui-table-head-cell:first-child {
border-top-left-radius: var(--uui-border-radius);
}
uui-table-head-cell:last-child {
border-top-right-radius: var(--uui-border-radius);
}
uui-table-head-cell {
background-color: var(--uui-color-surface-alt);
}
uui-table-head-cell:last-child,
uui-table-cell:last-child {
border-right: 1px solid var(--uui-color-border);
}
uui-table-head-cell,
uui-table-cell {
border-top: 1px solid var(--uui-color-border);
border-left: 1px solid var(--uui-color-border);
}
uui-table-row:last-child uui-table-cell {
border-bottom: 1px solid var(--uui-color-border);
}
uui-table-row:last-child uui-table-cell:last-child {
border-bottom-right-radius: var(--uui-border-radius);
}
uui-table-row:last-child uui-table-cell:first-child {
border-bottom-left-radius: var(--uui-border-radius);
}
.diff-added,
ins {
background-color: #00c43e63;
}
.diff-removed,
del {
background-color: #ff35356a;
}
.rollback-item {
position: relative;

2
src/Umbraco.Web.UI.Client/src/packages/documents/documents/workspace/views/info/document-workspace-view-info-history.element.ts
View File

@@ -104,7 +104,7 @@ export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
look="secondary"
slot="actions"
@click=${this.#onRollbackModalOpen}>
<uui-icon name="icon-undo"></uui-icon>
<uui-icon name="icon-undo"></uui-icon> ${this.localize.term('actions_rollback')}
</uui-button>
</div>
${this._items ? this.#renderHistory() : html`<uui-loader-circle></uui-loader-circle> `}

9
src/Umbraco.Web.UI.Client/src/packages/documents/documents/workspace/views/info/document-workspace-view-info.element.ts
View File

@@ -57,7 +57,8 @@ export class UmbDocumentWorkspaceViewInfoElement extends UmbLitElement {
#templateRepository = new UmbTemplateItemRepository(this);
#routeBuilder?: UmbModalRouteBuilder;
@state()
private _routeBuilder?: UmbModalRouteBuilder;
constructor() {
super();
@@ -68,7 +69,7 @@ export class UmbDocumentWorkspaceViewInfoElement extends UmbLitElement {
return { data: { entityType: params.entityType, preset: {} } };
})
.observeRouteBuilder((routeBuilder) => {
this.#routeBuilder = routeBuilder;
this._routeBuilder = routeBuilder;
});
this.consumeContext(UMB_DOCUMENT_WORKSPACE_CONTEXT, (context) => {
@@ -232,8 +233,8 @@ export class UmbDocumentWorkspaceViewInfoElement extends UmbLitElement {
}
#renderGeneralSection() {
const editDocumentTypePath = this.#routeBuilder?.({ entityType: 'document-type' }) ?? '';
const editTemplatePath = this.#routeBuilder?.({ entityType: 'template' }) ?? '';
const editDocumentTypePath = this._routeBuilder?.({ entityType: 'document-type' }) ?? '';
const editTemplatePath = this._routeBuilder?.({ entityType: 'template' }) ?? '';
return html`
<div class="general-item">