[pve-devel] [PATCH manager v2 1/2] ui: dc: backup: improve UX for the different 'notification-mode's

[Lukas Wagner <l.wagner@proxmox.com>]

  - Switch order of 'mailto' and 'mailnotification' field
  - When mode is 'auto', disable 'mailtnotification' field
  - When mode is 'auto' and 'mailto' is empty, show
    hint that the notification system will be used

Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
Tested-by: Maximiliano Sandoval <m.sandoval@proxmox.com>
---

Notes:
    Changes since v1:
      - Set 'mailNotification' in viewModel to 'always'
        to  avoid the combobox being empty initially

 www/manager6/dc/Backup.js | 36 ++++++++++++++++++++++++++++++------
 1 file changed, 30 insertions(+), 6 deletions(-)

diff --git a/www/manager6/dc/Backup.js b/www/manager6/dc/Backup.js
index 70903bdc..70b5604e 100644
--- a/www/manager6/dc/Backup.js
+++ b/www/manager6/dc/Backup.js
@@ -207,13 +207,25 @@ Ext.define('PVE.dc.BackupEdit', {
 	data: {
 	    selMode: 'include',
 	    notificationMode: '__default__',
+	    mailto: '',
+	    mailNotification: 'always',
 	},
 
 	formulas: {
 	    poolMode: (get) => get('selMode') === 'pool',
-	    disableVMSelection: (get) => get('selMode') !== 'include' && get('selMode') !== 'exclude',
+	    disableVMSelection: (get) => get('selMode') !== 'include' &&
+		get('selMode') !== 'exclude',
 	    showMailtoFields: (get) =>
 		['auto', 'legacy-sendmail', '__default__'].includes(get('notificationMode')),
+	    enableMailnotificationField: (get) => {
+		let mode = get('notificationMode');
+		let mailto = get('mailto');
+
+		return (['auto', '__default__'].includes(mode) && mailto) ||
+		    mode === 'legacy-sendmail';
+	    },
+	    hintTextVisible: (get) =>
+		['auto', '__default__'].includes(get('notificationMode')) && !get('mailto'),
 	},
     },
 
@@ -325,6 +337,15 @@ Ext.define('PVE.dc.BackupEdit', {
 					value: '{notificationMode}',
 				    },
 				},
+				{
+				    xtype: 'textfield',
+				    fieldLabel: gettext('Send email to'),
+				    name: 'mailto',
+				    bind: {
+					hidden: '{!showMailtoFields}',
+					value: '{mailto}',
+				    },
+				},
 				{
 				    xtype: 'pveEmailNotificationSelector',
 				    fieldLabel: gettext('Send email'),
@@ -334,15 +355,18 @@ Ext.define('PVE.dc.BackupEdit', {
 					deleteEmpty: '{!isCreate}',
 				    },
 				    bind: {
-					disabled: '{!showMailtoFields}',
+					hidden: '{!showMailtoFields}',
+					disabled: '{!enableMailnotificationField}',
+					value: '{mailNotification}',
 				    },
 				},
 				{
-				    xtype: 'textfield',
-				    fieldLabel: gettext('Send email to'),
-				    name: 'mailto',
+				    xtype: 'displayfield',
+				    userCls: 'pmx-hint',
+				    hidden: true,
+				    value: gettext('No email configured, the notification system will be used'),
 				    bind: {
-					disabled: '{!showMailtoFields}',
+					hidden: '{!hintTextVisible}',
 				    },
 				},
 				{
-- 
2.39.2