[PATCH pve-manager v6 26/28] ui: firewall: groups: add controls for dangling references

[Arthur Bied-Charreton <a.bied-charreton@proxmox.com>]

Add the reference action selector the ipset and alias dialogs have for
security groups as well.

The edit dialog has it in its advanced section, preselected to 'rename'.
The remove button becomes a FirewallObjectRemove, preselected to
'drop'. Both dialogs wait on the task the API returns.

Signed-off-by: Arthur Bied-Charreton <a.bied-charreton@proxmox.com>
---
 www/manager6/Utils.js             |  2 +
 www/manager6/dc/SecurityGroups.js | 81 +++++++++++++++++++++++++++++--
 2 files changed, 79 insertions(+), 4 deletions(-)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 168e7352..67617ef0 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -2221,6 +2221,8 @@ Ext.define('PVE.Utils', {
             download: [gettext('File'), gettext('Download')],
             'fw-alias-delete': [gettext('Firewall Alias'), gettext('Delete')],
             'fw-alias-rename': [gettext('Firewall Alias'), gettext('Rename')],
+            'fw-group-delete': [gettext('Firewall Security Group'), gettext('Delete')],
+            'fw-group-rename': [gettext('Firewall Security Group'), gettext('Rename')],
             'fw-ipset-delete': [gettext('Firewall IPSet'), gettext('Delete')],
             'fw-ipset-rename': [gettext('Firewall IPSet'), gettext('Rename')],
             hamigrate: ['HA', gettext('Migrate')],
diff --git a/www/manager6/dc/SecurityGroups.js b/www/manager6/dc/SecurityGroups.js
index a1454003..43a154ff 100644
--- a/www/manager6/dc/SecurityGroups.js
+++ b/www/manager6/dc/SecurityGroups.js
@@ -12,6 +12,10 @@ Ext.define('PVE.SecurityGroupEdit', {
 
     allow_iface: false,
 
+    showProgress: true,
+
+    onlineHelp: 'pve_firewall_dangling_references',
+
     initComponent: function () {
         var me = this;
 
@@ -49,10 +53,43 @@ Ext.define('PVE.SecurityGroupEdit', {
             });
         }
 
+        let advancedItems = [];
+        if (!me.isCreate) {
+            advancedItems.push({
+                xtype: 'pveFirewallReferenceAction',
+                preferredValue: 'rename',
+                referenceActions: [
+                    {
+                        text: gettext('Keep'),
+                        value: 'keep',
+                        description: gettext('Do not touch firewall rules referencing this security group.'),
+                    },
+                    {
+                        text: gettext('Disable'),
+                        value: 'disable',
+                        description: gettext('Disable firewall rules referencing this security group.'),
+                    },
+                    {
+                        text: gettext('Delete'),
+                        value: 'drop',
+                        description: gettext('Delete firewall rules referencing this security group.'),
+                    },
+                    {
+                        text: gettext('Rename'),
+                        value: 'rename',
+                        description: gettext(
+                            'Rewrite referencing firewall rules to point to the new security group name.',
+                        ),
+                    },
+                ],
+            });
+        }
+
         var ipanel = Ext.create('Proxmox.panel.InputPanel', {
             // InputPanel does not have a 'create' property, does it need a 'isCreate'
             isCreate: me.isCreate,
             items: items,
+            advancedItems: advancedItems.length ? advancedItems : undefined,
         });
 
         Ext.apply(me, {
@@ -148,11 +185,47 @@ Ext.define('PVE.SecurityGroupList', {
             },
         });
 
-        me.removeBtn = Ext.create('Proxmox.button.StdRemoveButton', {
+        me.removeBtn = new Proxmox.button.Button({
+            text: gettext('Remove'),
+            disabled: true,
+            dangerous: true,
             selModel: sm,
-            baseurl: me.base_url + '/',
-            enableFn: (rec) => canEdit && rec && me.base_url,
-            callback: () => reload(),
+            enableFn: (rec) => canEdit && !!rec,
+            handler: function (btn, event, rec) {
+                Ext.create('PVE.window.FirewallObjectRemove', {
+                    item: { id: rec.data.group },
+                    url: me.base_url + '/' + rec.data.group,
+                    text: Ext.String.format(
+                        gettext("Are you sure you want to remove security group '{0}'"),
+                        rec.data.group,
+                    ),
+                    referenceActions: [
+                        {
+                            text: gettext('Keep'),
+                            value: 'keep',
+                            description: gettext(
+                                'Do not touch firewall rules referencing this security group.',
+                            ),
+                        },
+                        {
+                            text: gettext('Disable'),
+                            value: 'disable',
+                            description: gettext(
+                                'Disable firewall rules referencing this security group.',
+                            ),
+                        },
+                        {
+                            text: gettext('Delete'),
+                            value: 'drop',
+                            description: gettext(
+                                'Delete firewall rules referencing this security group.',
+                            ),
+                        },
+                    ],
+                    apiCallDone: reload,
+                    taskDone: reload,
+                }).show();
+            },
         });
 
         Ext.apply(me, {
-- 
2.47.3