Considers the newly added options from both browser local storage(preferred)
or from the datacenter config we have to save the last sorting mechanism
there, so we can detect if it changes and trigger the movement/text changes
(otherwise the tree nodes won't be updated/moved)

Signed-off-by: Dominik Csapak <d.csa...@proxmox.com>
---
 www/manager6/Utils.js             | 12 +++++++
 www/manager6/tree/ResourceTree.js | 54 ++++++++++++++++++++++++-------
 2 files changed, 54 insertions(+), 12 deletions(-)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 0c57e0844..14f03e6d1 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -1930,6 +1930,18 @@ Ext.define('PVE.Utils', {
        Ext.GlobalEvents.fireEvent('loadedUiOptions');
     },
 
+    getTreeSortingValue: function(key) {
+       let sp = Ext.state.Manager.getProvider();
+       let browserValues = sp.get('pve-tree-sorting');
+       let defaults = {
+           'sort-field': 'vmid',
+           'group-templates': true,
+           'group-guest-types': true,
+       };
+
+       return browserValues?.[key] ?? PVE.UIOptions?.['tree-sorting']?.[key] 
?? defaults[key];
+    },
+
     tagTreeStyles: {
        '__default__': `${Proxmox.Utils.defaultText} (${gettext('Circle')})`,
        'full': gettext('Full'),
diff --git a/www/manager6/tree/ResourceTree.js 
b/www/manager6/tree/ResourceTree.js
index 5c92d4128..5456a7eda 100644
--- a/www/manager6/tree/ResourceTree.js
+++ b/www/manager6/tree/ResourceTree.js
@@ -44,24 +44,34 @@ Ext.define('PVE.tree.ResourceTree', {
 
     // private
     nodeSortFn: function(node1, node2) {
+       let me = this;
        let n1 = node1.data, n2 = node2.data;
 
        if (!n1.groupbyid === !n2.groupbyid) {
-           // first sort (group) by type
-           if (n1.type > n2.type) {
-               return 1;
-           } else if (n1.type < n2.type) {
-               return -1;
+           let n1IsGuest = n1.type === 'qemu' || n1.type === 'lxc';
+           let n2IsGuest = n2.type === 'qemu' || n2.type === 'lxc';
+           if (me['group-guest-types'] || !n1IsGuest || !n2IsGuest) {
+               // first sort (group) by type
+               if (n1.type > n2.type) {
+                   return 1;
+               } else if (n1.type < n2.type) {
+                   return -1;
+               }
            }
+
            // then sort (group) by ID
-           if (n1.type === 'qemu' || n2.type === 'lxc') {
-               if (!n1.template !== !n2.template) {
+           if (n1IsGuest) {
+               if (me['group-templates'] && (!n1.template !== !n2.template)) {
                    return n1.template ? 1 : -1; // sort templates after 
regular VMs
                }
-               if (n1.vmid > n2.vmid) { // prefer VMID as metric for guests
-                   return 1;
-               } else if (n1.vmid < n2.vmid) {
-                   return -1;
+               if (me['sort-field'] === 'vmid') {
+                   if (n1.vmid > n2.vmid) { // prefer VMID as metric for guests
+                       return 1;
+                   } else if (n1.vmid < n2.vmid) {
+                       return -1;
+                   }
+               } else {
+                   return n1.name.localeCompare(n2.name);
                }
            }
            // same types but not a guest
@@ -115,6 +125,11 @@ Ext.define('PVE.tree.ResourceTree', {
                status += '</div> ';
            }
        }
+       if (Ext.isNumeric(info.vmid) && info.vmid > 0) {
+           if (PVE.Utils.getTreeSortingValue('sort-field') !== 'vmid') {
+               info.text = `${info.name} (${String(info.vmid)})`;
+           }
+       }
 
        info.text += PVE.Utils.renderTags(info.tags, PVE.Utils.tagOverrides);
 
@@ -203,8 +218,22 @@ Ext.define('PVE.tree.ResourceTree', {
        return me.addChildSorted(node, info);
     },
 
+    saveSortingOptions: function() {
+       let me = this;
+       let changed = false;
+       for (const key of ['sort-field', 'group-templates', 
'group-guest-types']) {
+           let newValue = PVE.Utils.getTreeSortingValue(key);
+           if (me[key] !== newValue) {
+               me[key] = newValue;
+               changed = true;
+           }
+       }
+       return changed;
+    },
+
     initComponent: function() {
        let me = this;
+       me.saveSortingOptions();
 
        let rstore = PVE.data.ResourceStore;
        let sp = Ext.state.Manager.getProvider();
@@ -242,6 +271,7 @@ Ext.define('PVE.tree.ResourceTree', {
            let sm = me.getSelectionModel();
            let lastsel = sm.getSelection()[0];
            let parents = [];
+           let sorting_changed = me.saveSortingOptions();
            for (let node = lastsel; node; node = node.parentNode) {
                parents.push(node);
            }
@@ -258,7 +288,7 @@ Ext.define('PVE.tree.ResourceTree', {
                // getById() use find(), which is slow (ExtJS4 DP5)
                let item = rstore.data.get(olditem.data.id);
 
-               let changed = false, moved = false;
+               let changed = sorting_changed, moved = sorting_changed;
                if (item) {
                    // test if any grouping attributes changed, catches 
migrated tree-nodes in server view too
                    for (const attr of moveCheckAttrs) {
-- 
2.30.2



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

Reply via email to