[pbs-devel] [PATCH proxmox-backup v6] ui: fix #4260: add dynamic notes in backup group comment

[pbs-devel] [PATCH proxmox-backup v6] ui: fix #4260: add dynamic notes in backup group comment

[Philipp Hufnagl]

When there is no comment for a backup group, the comment of the last
snapshot in this group will be shown slightly grayed out as long as
the group is collapsed.


Changes since v1:
 * code quality improvements
 * remove unused variable

Signed-off-by: Philipp Hufnagl <p.hufnagl@proxmox.com>
---
 www/css/ext6-pbs.css     |  4 ++++
 www/datastore/Content.js | 16 +++++++++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css
index 5fd65d25..95a655cf 100644
--- a/www/css/ext6-pbs.css
+++ b/www/css/ext6-pbs.css
@@ -227,6 +227,10 @@ span.snapshot-comment-column {
     width: calc(100% - 18px);
 }
 
+.pmx-faded {
+    opacity: 0.7;
+}
+
 .x-action-col-icon.good:before {
     color: #21BF4B;
 }
diff --git a/www/datastore/Content.js b/www/datastore/Content.js
index 9fc07d49..68205779 100644
--- a/www/datastore/Content.js
+++ b/www/datastore/Content.js
@@ -287,6 +287,7 @@ Ext.define('PBS.DataStoreContent', {
 		    if (item["backup-time"] > last_backup && item.size !== null) {
 			last_backup = item["backup-time"];
 			group["backup-time"] = last_backup;
+			group["last-comment"] = item.comment;
 			group.files = item.files;
 			group.size = item.size;
 			group.owner = item.owner;
@@ -903,13 +904,22 @@ Ext.define('PBS.DataStoreContent', {
 		if (!data || data.leaf || data.root) {
 		    return '';
 		}
-		if (v === undefined || v === null) {
-		    v = '';
+
+		let additionalClasses = "";
+		// when there is no group comment and the section is collapsed,
+		// display the most recent snapshot comment
+		if (v === undefined || v === null|| v === '') {
+		    if (data.expanded === false) {
+			v = data['last-comment'] ?? '';
+			additionalClasses = "pmx-faded";
+		    } else {
+			v = '';
+		    }
 		}
 		v = Ext.String.htmlEncode(v);
 		let icon = 'x-action-col-icon fa fa-fw fa-pencil pointer';
 
-		return `<span class="snapshot-comment-column">${v}</span>
+		return `<span class="snapshot-comment-column ${additionalClasses}">${v}</span>
 		    <i data-qtip="${gettext('Edit')}" style="float: right; margin: 0px;" class="${icon}"></i>`;
 	    },
 	    listeners: {
-- 
2.39.2

Re: [pbs-devel] [PATCH proxmox-backup v6] ui: fix #4260: add dynamic notes in backup group comment

[Thomas Lamprecht]

Am 12/10/2023 um 15:58 schrieb Philipp Hufnagl:
> When there is no comment for a backup group, the comment of the last
> snapshot in this group will be shown slightly grayed out as long as
> the group is collapsed.
> 

Looks OK, but as the commit message is wrong (see below), some style nits,
that I'd have just fixed up on applying otherwise, inline.

> 
> Changes since v1:
>  * code quality improvements
>  * remove unused variable

As Dominik already told you once [0], please put the change log outside
of the commit message, after the "---" and before the diff-stat.

[0]: https://lists.proxmox.com/pipermail/pbs-devel/2023-October/006780.html

> 
> Signed-off-by: Philipp Hufnagl <p.hufnagl@proxmox.com>
> ---

-> changelog goes here

>  www/css/ext6-pbs.css     |  4 ++++
>  www/datastore/Content.js | 16 +++++++++++++---
>  2 files changed, 17 insertions(+), 3 deletions(-)
> 

> @@ -903,13 +904,22 @@ Ext.define('PBS.DataStoreContent', {
>  		if (!data || data.leaf || data.root) {
>  		    return '';
>  		}
> -		if (v === undefined || v === null) {
> -		    v = '';
> +
> +		let additionalClasses = "";
> +		// when there is no group comment and the section is collapsed,
> +		// display the most recent snapshot comment

If we really want to add a comment here, I'd keep it short – as when skimming
code and running into longer comments, I expect something odd happening that
needs explanation, not what I can read from the code anyway.

But if you really think it adds some value here, then fine by me, but maybe
go for something shorter like:

// fallback to the most recent snapshot comment for collapsed groups

(it's fine to go to the 100 character column width)

> +		if (v === undefined || v === null|| v === '') {

can now simply be `if (!v) {`

> +		    if (data.expanded === false) {

Please no, an if expression is already a boolean one, no need for `xyz === false`
statements, just use a standard ! negation, like:

if (!data.expanded) {
    ...

or just swap the branches, avoiding the need for any negation, but having to
read things like `expr === false` or `expr === true` (or maybe `!expr !== true`)
just feels wrong.

> +			v = data['last-comment'] ?? '';
> +			additionalClasses = "pmx-faded";
> +		    } else {
> +			v = '';
> +		    }
>  		}