Also introduce a local viewModel that is linked to a parent viewModel,
allowing us to move the formulas to the panel.
This should make the code more cohesive and easier to follow.

No functional changes.

Signed-off-by: Lukas Wagner <l.wag...@proxmox.com>
Tested-by: Maximiliano Sandoval <m.sando...@proxmox.com>
---
 src/window/NotificationMatcherEdit.js | 129 ++++++++++++++++----------
 1 file changed, 80 insertions(+), 49 deletions(-)

diff --git a/src/window/NotificationMatcherEdit.js 
b/src/window/NotificationMatcherEdit.js
index 47f6e18..3e2449f 100644
--- a/src/window/NotificationMatcherEdit.js
+++ b/src/window/NotificationMatcherEdit.js
@@ -380,34 +380,7 @@ Ext.define('Proxmox.panel.NotificationRulesEditPanel', {
                }
                return !record.isRoot();
            },
-           typeIsMatchSeverity: {
-               bind: {
-                   bindTo: '{selectedRecord}',
-                   deep: true,
-               },
-               get: function(record) {
-                   return record?.get('type') === 'match-severity';
-               },
-           },
-           matchSeverityValue: {
-               bind: {
-                   bindTo: '{selectedRecord}',
-                   deep: true,
-               },
-               set: function(value) {
-                   let record = this.get('selectedRecord');
-                   let currentData = record.get('data');
-                   record.set({
-                       data: {
-                           ...currentData,
-                           value: value,
-                       },
-                   });
-               },
-               get: function(record) {
-                   return record?.get('data')?.value;
-               },
-           },
+
            rootMode: {
                bind: {
                    bindTo: '{selectedRecord}',
@@ -944,27 +917,7 @@ Ext.define('Proxmox.panel.NotificationMatchRuleSettings', {
            },
        },
        {
-           xtype: 'proxmoxKVComboBox',
-           fieldLabel: gettext('Severities to match'),
-           isFormField: false,
-           allowBlank: true,
-           multiSelect: true,
-           field: 'value',
-           // Hide initially to avoid glitches when opening the window
-           hidden: true,
-           bind: {
-               value: '{matchSeverityValue}',
-               hidden: '{!typeIsMatchSeverity}',
-               disabled: '{!typeIsMatchSeverity}',
-           },
-
-           comboItems: [
-               ['info', gettext('Info')],
-               ['notice', gettext('Notice')],
-               ['warning', gettext('Warning')],
-               ['error', gettext('Error')],
-               ['unknown', gettext('Unknown')],
-           ],
+           xtype: 'pmxNotificationMatchSeveritySettings',
        },
        {
            xtype: 'pmxNotificationMatchCalendarSettings',
@@ -1047,6 +1000,84 @@ Ext.define('Proxmox.panel.MatchCalendarSettings', {
     },
 });
 
+Ext.define('Proxmox.panel.MatchSeveritySettings', {
+    extend: 'Ext.panel.Panel',
+    xtype: 'pmxNotificationMatchSeveritySettings',
+    border: false,
+    layout: 'anchor',
+    // Hide initially to avoid glitches when opening the window
+    hidden: true,
+    bind: {
+       hidden: '{!typeIsMatchSeverity}',
+    },
+    viewModel: {
+       // parent is set in `initComponents`
+       formulas: {
+           typeIsMatchSeverity: {
+               bind: {
+                   bindTo: '{selectedRecord}',
+                   deep: true,
+               },
+               get: function(record) {
+                   return record?.get('type') === 'match-severity';
+               },
+           },
+           matchSeverityValue: {
+               bind: {
+                   bindTo: '{selectedRecord}',
+                   deep: true,
+               },
+               set: function(value) {
+                   let record = this.get('selectedRecord');
+                   let currentData = record.get('data');
+                   record.set({
+                       data: {
+                           ...currentData,
+                           value: value,
+                       },
+                   });
+               },
+               get: function(record) {
+                   return record?.get('data')?.value;
+               },
+           },
+       },
+    },
+    items: [
+       {
+           xtype: 'proxmoxKVComboBox',
+           fieldLabel: gettext('Severities to match'),
+           isFormField: false,
+           allowBlank: true,
+           multiSelect: true,
+           field: 'value',
+           // Hide initially to avoid glitches when opening the window
+           hidden: true,
+           bind: {
+               value: '{matchSeverityValue}',
+               hidden: '{!typeIsMatchSeverity}',
+               disabled: '{!typeIsMatchSeverity}',
+           },
+
+           comboItems: [
+               ['info', gettext('Info')],
+               ['notice', gettext('Notice')],
+               ['warning', gettext('Warning')],
+               ['error', gettext('Error')],
+               ['unknown', gettext('Unknown')],
+           ],
+       },
+    ],
+
+    initComponent: function() {
+       let me = this;
+       Ext.apply(me.viewModel, {
+           parent: me.up('pmxNotificationMatchRulesEditPanel').getViewModel(),
+       });
+       me.callParent();
+    },
+});
+
 Ext.define('Proxmox.panel.MatchFieldSettings', {
     extend: 'Ext.panel.Panel',
     xtype: 'pmxNotificationMatchFieldSettings',
-- 
2.39.2



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

Reply via email to