[pve-devel] [PATCH manager v2] ui: backup: hide change mode detection for vms and non-pbs storage

[pve-devel] [PATCH manager v2] ui: backup: hide change mode detection for vms and non-pbs storage

[Dominik Csapak]

Since it does not do anything for non-pbs storages and vms, this is only
distracting in these cases, so hide the selector + tooltip help icon.

Refactor the help icon into a variable, so we can more easily
disable/hide it.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
replacement for:
https://lore.proxmox.com/pve-devel/20250410080821.1297854-1-d.csapak@proxmox.com/

changes from v1:
* hide the selctor and tooltip completely instead of disabling
* also hide it for non-pbs storages

Side note: looking at the component, I'd love to refactor it into more
"modern" extjs (view/viewmodel/controller), but for now this is IMHO
good enough.

 www/manager6/window/Backup.js | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/www/manager6/window/Backup.js b/www/manager6/window/Backup.js
index cb09c7b9..68e9565b 100644
--- a/www/manager6/window/Backup.js
+++ b/www/manager6/window/Backup.js
@@ -53,8 +53,17 @@ Ext.define('PVE.window.Backup', {
 	    },
 	});
 
+	let pbsChangeDetectionHelp = Ext.create('Ext.Component', {
+	    hidden: true,
+	    html: `<i class="fa fa-question-circle" data-qtip="
+		${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")}
+	    "></i>`,
+	});
+
 	let pbsChangeDetectionModeSelector = Ext.create({
 	    xtype: 'proxmoxKVComboBox',
+	    hidden: true,
+	    disabled: true,
 	    fieldLabel: gettext('PBS change detection mode'),
 	    name: 'pbs-change-detection-mode',
 	    deleteEmpty: true,
@@ -126,12 +135,20 @@ Ext.define('PVE.window.Backup', {
 			if (me.vmtype === 'lxc') {
 			    pbsChangeDetectionModeSelector.setValue('__default__');
 			    pbsChangeDetectionModeSelector.setDisabled(false);
+			    pbsChangeDetectionModeSelector.setHidden(false);
+			    pbsChangeDetectionHelp.setHidden(false);
+			} else {
+			    pbsChangeDetectionModeSelector.setDisabled(true);
+			    pbsChangeDetectionModeSelector.setHidden(true);
+			    pbsChangeDetectionHelp.setHidden(true);
 			}
 		    } else {
 			if (!compressionSelector.getEditable()) {
 			    compressionSelector.setDisabled(false);
 			}
 			pbsChangeDetectionModeSelector.setDisabled(true);
+			pbsChangeDetectionModeSelector.setHidden(true);
+			pbsChangeDetectionHelp.setHidden(true);
 		    }
 
 
@@ -214,12 +231,7 @@ Ext.define('PVE.window.Backup', {
 		storagesel,
 		modeSelector,
 		protectedCheckbox,
-		{
-		    xtype: 'box',
-		    html: `<i class="fa fa-question-circle" data-qtip="
-			${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")}
-		    "></i>`,
-		},
+		pbsChangeDetectionHelp,
 		pbsChangeDetectionModeSelector,
 	    ],
 	    column2: [
-- 
2.39.5



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel

[pve-devel] [PATCH follow-up manager] ui: backup: move change detection help tooltip behind field

[Dominik Csapak]

instead of having it in a separate line. This could be confusing on
first glance, e.g. if it belongs to the line above or below.

To make it more clear, put it in line with the field itself.

Because this uses a FieldContainer now, we can use that to hide and show
both at the same time, reducing the amount of code a bit.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
this is a follow up to:
https://lore.proxmox.com/all/20250410083333.1781596-1-d.csapak@proxmox.com/

could be squashed in if wanted

 www/manager6/window/Backup.js | 41 ++++++++++++++++++++---------------
 1 file changed, 24 insertions(+), 17 deletions(-)

diff --git a/www/manager6/window/Backup.js b/www/manager6/window/Backup.js
index 68e9565b..70b51409 100644
--- a/www/manager6/window/Backup.js
+++ b/www/manager6/window/Backup.js
@@ -53,18 +53,10 @@ Ext.define('PVE.window.Backup', {
 	    },
 	});
 
-	let pbsChangeDetectionHelp = Ext.create('Ext.Component', {
-	    hidden: true,
-	    html: `<i class="fa fa-question-circle" data-qtip="
-		${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")}
-	    "></i>`,
-	});
-
 	let pbsChangeDetectionModeSelector = Ext.create({
 	    xtype: 'proxmoxKVComboBox',
-	    hidden: true,
+	    flex: 1,
 	    disabled: true,
-	    fieldLabel: gettext('PBS change detection mode'),
 	    name: 'pbs-change-detection-mode',
 	    deleteEmpty: true,
 	    value: '__default__',
@@ -75,6 +67,25 @@ Ext.define('PVE.window.Backup', {
 	    ],
 	});
 
+	let pbsChangeDetection = Ext.create('Ext.form.FieldContainer', {
+	    fieldLabel: gettext('PBS change detection mode'),
+	    hidden: true,
+	    layout: {
+		type: 'hbox',
+		align: 'center',
+	    },
+	    items: [
+		pbsChangeDetectionModeSelector,
+		{
+		    xtype: 'box',
+		    html: `<i class="fa fa-question-circle" data-qtip="
+			${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")}
+		    "></i>`,
+		    padding: 5,
+		},
+	    ],
+	});
+
 	const keepNames = [
 	    ['keep-last', gettext('Keep Last')],
 	    ['keep-hourly', gettext('Keep Hourly')],
@@ -135,20 +146,17 @@ Ext.define('PVE.window.Backup', {
 			if (me.vmtype === 'lxc') {
 			    pbsChangeDetectionModeSelector.setValue('__default__');
 			    pbsChangeDetectionModeSelector.setDisabled(false);
-			    pbsChangeDetectionModeSelector.setHidden(false);
-			    pbsChangeDetectionHelp.setHidden(false);
+			    pbsChangeDetection.setHidden(false);
 			} else {
 			    pbsChangeDetectionModeSelector.setDisabled(true);
-			    pbsChangeDetectionModeSelector.setHidden(true);
-			    pbsChangeDetectionHelp.setHidden(true);
+			    pbsChangeDetection.setHidden(true);
 			}
 		    } else {
 			if (!compressionSelector.getEditable()) {
 			    compressionSelector.setDisabled(false);
 			}
 			pbsChangeDetectionModeSelector.setDisabled(true);
-			pbsChangeDetectionModeSelector.setHidden(true);
-			pbsChangeDetectionHelp.setHidden(true);
+			pbsChangeDetection.setHidden(true);
 		    }
 
 
@@ -231,8 +239,7 @@ Ext.define('PVE.window.Backup', {
 		storagesel,
 		modeSelector,
 		protectedCheckbox,
-		pbsChangeDetectionHelp,
-		pbsChangeDetectionModeSelector,
+		pbsChangeDetection,
 	    ],
 	    column2: [
 		compressionSelector,
-- 
2.39.5



_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel

[pve-devel] applied-series: [PATCH manager v2] ui: backup: hide change mode detection for vms and non-pbs storage

[Fiona Ebner]

Am 10.04.25 um 10:33 schrieb Dominik Csapak:
> Since it does not do anything for non-pbs storages and vms, this is only
> distracting in these cases, so hide the selector + tooltip help icon.
> 
> Refactor the help icon into a variable, so we can more easily
> disable/hide it.
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>

For the record, both patches were applied yesterday:
https://git.proxmox.com/?p=pve-manager.git;a=commit;h=129777f3d5d5014913565827680991e6d10e1e89
https://git.proxmox.com/?p=pve-manager.git;a=commit;h=8a14d5d91bbc189e3260fec81bc4a9fc53d05953


_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel