Skip to content

Commit

Permalink
Merge branch 'main' into upgrade-websocket-validator
Browse files Browse the repository at this point in the history
  • Loading branch information
Dennis Labordus committed Nov 24, 2022
2 parents ec5b00b + e933a8d commit 3c07a72
Show file tree
Hide file tree
Showing 5 changed files with 139 additions and 136 deletions.
150 changes: 79 additions & 71 deletions src/compas-editors/CompasVersions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,26 +4,31 @@ import {
LitElement,
property,
PropertyValues,
query,
state,
TemplateResult,
} from 'lit-element';
import { get, translate } from 'lit-translate';

import '@material/mwc-dialog';
import '@material/mwc-fab';
import '@material/mwc-icon';
import '@material/mwc-icon-button';
import '@material/mwc-list';
import '@material/mwc-list/mwc-list-item';
import '@material/mwc-list/mwc-check-list-item';

import { Dialog } from '@material/mwc-dialog';
import { MultiSelectedEvent } from '@material/mwc-list/mwc-list-foundation';

import '../plain-compare-list.js';

import {
newLogEvent,
newOpenDocEvent,
newWizardEvent,
Wizard,
} from '../foundation.js';
import { renderDiff } from '../foundation/compare.js';

import {
CompasSclDataService,
Expand All @@ -39,41 +44,6 @@ import { addVersionToCompasWizard } from '../compas/CompasUploadVersion.js';
import { getElementByName, styles } from './foundation.js';
import { wizards } from '../wizards/wizard-library.js';

interface CompareOptions {
title: string;
}

function compareWizard(
plugin: Element,
oldElement: Element,
newElement: Element,
options: CompareOptions
): Wizard {
function renderDialogContent(): TemplateResult {
return html` ${renderDiff(newElement, oldElement) ??
html`${translate('compas.compare.noDiff')}`}`;
}

function close() {
return function () {
plugin.dispatchEvent(newWizardEvent());
return [];
};
}

return [
{
title: options.title,
secondary: {
icon: '',
label: get('close'),
action: close(),
},
content: [renderDialogContent()],
},
];
}

/** An editor [[`plugin`]] for selecting the `Substation` section. */
export default class CompasVersionsPlugin extends LitElement {
@property()
Expand Down Expand Up @@ -279,25 +249,33 @@ export default class CompasVersionsPlugin extends LitElement {
return selectedVersions;
}

@state()
private compareDialogTitle: string | undefined;
@state()
private compareLeftElement: Element | undefined;
@state()
private compareLeftTitle: string | undefined;
@state()
private compareRightElement: Element | undefined;
@state()
private compareRightTitle: string | undefined;
@query('mwc-dialog#compareDialog')
private compareDialog!: Dialog;

async compareCurrentVersion(): Promise<void> {
const selectedVersions = this.getSelectedVersions();
if (selectedVersions.length === 1) {
const oldVersion = selectedVersions[0];

const oldScl = await this.getVersion(oldVersion);
const newScl = this.doc.documentElement;

if (oldScl && newScl) {
this.dispatchEvent(
newWizardEvent(
compareWizard(this, oldScl, newScl, {
title: get('compas.compare.titleCurrent', {
oldVersion: oldVersion,
}),
})
)
);
}
this.compareLeftTitle = selectedVersions[0];
this.compareLeftElement =
(await this.getVersion(this.compareLeftTitle)) ?? undefined;
this.compareRightTitle = 'Latest';
this.compareRightElement = this.doc.documentElement;

this.compareDialogTitle = get('compas.compare.titleCurrent', {
oldVersion: this.compareLeftTitle,
});

this.compareDialog.open = true;
} else {
this.dispatchEvent(
newWizardEvent(
Expand All @@ -316,24 +294,20 @@ export default class CompasVersionsPlugin extends LitElement {
const selectedVersions = this.getSelectedVersions();
if (selectedVersions.length === 2) {
const sortedVersions = selectedVersions.slice().sort(compareVersions);
const oldVersion = sortedVersions[0];
const newVersion = sortedVersions[1];

const oldScl = await this.getVersion(oldVersion);
const newScl = await this.getVersion(newVersion);

if (oldScl && newScl) {
this.dispatchEvent(
newWizardEvent(
compareWizard(this, oldScl, newScl, {
title: get('compas.compare.title', {
oldVersion: oldVersion,
newVersion: newVersion,
}),
})
)
);
}

this.compareLeftTitle = sortedVersions[0];
this.compareLeftElement =
(await this.getVersion(this.compareLeftTitle)) ?? undefined;
this.compareRightTitle = sortedVersions[1];
this.compareRightElement =
(await this.getVersion(this.compareRightTitle)) ?? undefined;

this.compareDialogTitle = get('compas.compare.title', {
oldVersion: this.compareLeftTitle,
newVersion: this.compareRightTitle,
});

this.compareDialog.open = true;
} else {
this.dispatchEvent(
newWizardEvent(
Expand All @@ -348,6 +322,35 @@ export default class CompasVersionsPlugin extends LitElement {
}
}

private onClosedCompareDialog(): void {
this.compareDialogTitle = undefined;
this.compareLeftElement = undefined;
this.compareRightElement = undefined;
}

private renderCompareDialog(): TemplateResult {
return html`<mwc-dialog
id="compareDialog"
heading="${this.compareDialogTitle}"
@closed=${this.onClosedCompareDialog}
>
${this.compareLeftElement && this.compareRightElement
? html`<plain-compare-list
.leftHandObject=${this.compareLeftElement}
.rightHandObject=${this.compareRightElement}
.leftHandTitle=${this.compareLeftTitle ?? ''}
.rightHandTitle=${this.compareRightTitle ?? ''}
></plain-compare-list>`
: html``}
<mwc-button
slot="secondaryAction"
dialogAction="close"
label="${translate('close')}"
style="--mdc-theme-primary: var(--mdc-theme-error)"
></mwc-button>
</mwc-dialog>`;
}

private showMessageWizard(title: string, message: string): Wizard {
return [
{
Expand Down Expand Up @@ -540,12 +543,17 @@ export default class CompasVersionsPlugin extends LitElement {
label="${translate('compas.versions.compareButton')}"
@click=${this.compareVersions}
></mwc-fab>
</div>`;
</div>
${this.renderCompareDialog()}`;
}

static styles = css`
${styles}
mwc-dialog {
--mdc-dialog-min-width: 64vw;
}
mwc-list-item#no-scl-versions > span {
color: var(--base1);
}
Expand Down
29 changes: 17 additions & 12 deletions src/plain-compare-list.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,10 +60,7 @@ export class PlainCompareList extends LitElement {

render(): TemplateResult {
return html`
<div class="container">
<div class="flex"></div>
${this.renderFilterCheckbox()}
</div>
${this.renderFilterCheckbox()}
<div class="container container--alt">
<div class="list__container list__container--left">
<h3 class="mdc-dialog__title">${this.leftHandTitle}</h3>
Expand All @@ -83,8 +80,8 @@ export class PlainCompareList extends LitElement {
${this.leftHandObject && this.rightHandObject
? html`
${renderDiff(
this.leftHandObject,
this.rightHandObject,
this.leftHandObject,
this.filterMutables ? this.filterToIgnore : {}
)}
`
Expand All @@ -93,13 +90,21 @@ export class PlainCompareList extends LitElement {
}

protected renderFilterCheckbox(): TemplateResult {
return html`<mwc-formfield label="${translate('compare.filterMutables')}">
<mwc-checkbox
?checked=${this.filterMutables}
@change=${() => (this.filterMutables = !this.filterMutables)}
>
</mwc-checkbox>
</mwc-formfield> `;
if (this.filterToIgnore) {
return html`
<div class="container">
<div class="flex"></div>
<mwc-formfield label="${translate('compare.filterMutables')}">
<mwc-checkbox
?checked=${this.filterMutables}
@change=${() => (this.filterMutables = !this.filterMutables)}
>
</mwc-checkbox>
</mwc-formfield>
</div>
`;
}
return html``;
}

static styles = css`
Expand Down
12 changes: 12 additions & 0 deletions test/integration/compas-editors/__snapshots__/CompasVersions.test.snap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,6 +157,18 @@ snapshots["compas-versions-plugin items-in-list looks like the latest snapshot"]
>
</mwc-fab>
</div>
<mwc-dialog
heading="undefined"
id="compareDialog"
>
<mwc-button
dialogaction="close"
label="[close]"
slot="secondaryAction"
style="--mdc-theme-primary: var(--mdc-theme-error)"
>
</mwc-button>
</mwc-dialog>
<wizard-dialog>
</wizard-dialog>
`;
Expand Down
30 changes: 3 additions & 27 deletions test/unit/__snapshots__/plain-compare-list.test.snap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,7 @@
export const snapshots = {};

snapshots["Plain Compare List Empty list looks like the latest snapshot"] =
`<div class="container">
<div class="flex">
</div>
<mwc-formfield label="[compare.filterMutables]">
<mwc-checkbox checked="">
</mwc-checkbox>
</mwc-formfield>
</div>
<div class="container container--alt">
`<div class="container container--alt">
<div class="list__container list__container--left">
<h3 class="mdc-dialog__title">
</h3>
Expand All @@ -24,15 +16,7 @@ snapshots["Plain Compare List Empty list looks like the latest snapshot"] =
/* end snapshot Plain Compare List Empty list looks like the latest snapshot */

snapshots["Plain Compare List Basic List looks like the latest snapshot"] =
`<div class="container">
<div class="flex">
</div>
<mwc-formfield label="[compare.filterMutables]">
<mwc-checkbox checked="">
</mwc-checkbox>
</mwc-formfield>
</div>
<div class="container container--alt">
`<div class="container container--alt">
<div class="list__container list__container--left">
<h3 class="mdc-dialog__title">
Project doc
Expand All @@ -48,15 +32,7 @@ snapshots["Plain Compare List Basic List looks like the latest snapshot"] =
/* end snapshot Plain Compare List Basic List looks like the latest snapshot */

snapshots["Plain Compare List Basic List Has a subtitlte, so looks like the latest snapshot"] =
`<div class="container">
<div class="flex">
</div>
<mwc-formfield label="[compare.filterMutables]">
<mwc-checkbox checked="">
</mwc-checkbox>
</mwc-formfield>
</div>
<div class="container container--alt">
`<div class="container container--alt">
<div class="list__container list__container--left">
<h3 class="mdc-dialog__title">
Project doc
Expand Down
Loading

0 comments on commit 3c07a72

Please sign in to comment.