From 5d7f39695ac0c9ebc7dad2de5db87e55a163cdeb Mon Sep 17 00:00:00 2001 From: Juergen Kunz Date: Fri, 17 Apr 2026 10:21:53 +0000 Subject: [PATCH] feat(dees-updater): enhance updater progress and completion views with version metadata cards --- changelog.md | 7 + ts_web/00_commitinfo_data.ts | 2 +- .../dees-updater/dees-updater.ts | 125 +++++++++++++++--- 3 files changed, 112 insertions(+), 22 deletions(-) diff --git a/changelog.md b/changelog.md index 6cdbdd4..bfb562b 100644 --- a/changelog.md +++ b/changelog.md @@ -1,5 +1,12 @@ # Changelog +## 2026-04-17 - 3.81.0 - feat(dees-updater) +enhance updater progress and completion views with version metadata cards + +- add reusable version metadata rendering for current, incoming, and installed versions +- refresh progress and ready states with clearer headings, descriptive copy, and automatic action summary +- apply monospace styling to displayed version numbers for improved readability + ## 2026-04-16 - 3.80.0 - feat(stepper,updater) add progress-aware stepper flows and updater countdown states diff --git a/ts_web/00_commitinfo_data.ts b/ts_web/00_commitinfo_data.ts index 8bcd4dd..9764cfd 100644 --- a/ts_web/00_commitinfo_data.ts +++ b/ts_web/00_commitinfo_data.ts @@ -3,6 +3,6 @@ */ export const commitinfo = { name: '@design.estate/dees-catalog', - version: '3.80.0', + version: '3.81.0', description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.' } diff --git a/ts_web/elements/00group-utility/dees-updater/dees-updater.ts b/ts_web/elements/00group-utility/dees-updater/dees-updater.ts index 83caf9a..c5b8dca 100644 --- a/ts_web/elements/00group-utility/dees-updater/dees-updater.ts +++ b/ts_web/elements/00group-utility/dees-updater/dees-updater.ts @@ -12,6 +12,7 @@ import { type IStep, type IStepProgressState, } from '../../00group-layout/dees-stepper/dees-stepper.js'; +import { monoFontFamily } from '../../00fonts.js'; export type TDeesUpdaterSuccessAction = 'close' | 'reload'; @@ -301,20 +302,71 @@ export class DeesUpdater extends DeesElement { return menuOptions; } + private renderVersionMeta(labelArg: string, valueArg: string): TemplateResult { + return html` +
+
+ ${labelArg} +
+
+ ${valueArg} +
+
+ `; + } + private renderProgressContent(): TemplateResult { return html` -
-

- Downloading and applying the latest application release. - ${this.currentVersion && this.updatedVersion - ? html`Moving from ${this.currentVersion} to ${this.updatedVersion}.` - : this.updatedVersion - ? html`Preparing ${this.updatedVersion}.` - : ''} -

-

- The updater advances automatically once the new build is installed and verified. -

+
+
+
+ Application update +
+
+ Downloading and applying the latest release. +
+

+ ${this.currentVersion && this.updatedVersion + ? html`Moving from ${this.currentVersion} to ${this.updatedVersion}.` + : this.updatedVersion + ? html`Preparing ${this.updatedVersion} for installation.` + : 'The updater is fetching the newest build and preparing it for installation.'} +

+
+ + ${this.currentVersion || this.updatedVersion + ? html` +
+ ${this.currentVersion + ? this.renderVersionMeta('Current version', this.currentVersion) + : ''} + ${this.updatedVersion + ? this.renderVersionMeta('Incoming version', this.updatedVersion) + : ''} +
+ ` + : ''} + +
+
+ Automatic flow +
+
+ The updater continues on its own once the new build is installed and verified. +
+
`; } @@ -323,15 +375,46 @@ export class DeesUpdater extends DeesElement { const successDelaySeconds = this.getSuccessDelaySeconds(); return html` -
-

- ${this.updatedVersion - ? html`Version ${this.updatedVersion} is ready to use.` - : 'The new version is ready to use.'} -

-

- Configured next action: ${this.getSuccessActionDisplayLabel()}. It runs automatically in ${successDelaySeconds} seconds. -

+
+
+
+ Update complete +
+
+ ${this.updatedVersion + ? html`Version ${this.updatedVersion} is ready to use.` + : 'The new version is ready to use.'} +
+

+ The new build has been installed and verified. You can review release details below while the next action runs automatically. +

+
+ + ${this.updatedVersion + ? html` +
+ ${this.renderVersionMeta('Installed version', this.updatedVersion)} +
+ ` + : ''} + +
+
+ Next action +
+
+ ${this.getSuccessActionDisplayLabel()} +
+
+ Runs automatically in ${successDelaySeconds} seconds. +
+
`; }