all lists on lists.proxmox.com
 help / color / mirror / Atom feed
From: Dominik Csapak <d.csapak@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [PATCH manager v4 05/12] ui: button: add config remove button
Date: Mon, 31 Aug 2026 14:27:40 +0200	[thread overview]
Message-ID: <20260831122953.2980232-6-d.csapak@proxmox.com> (raw)
In-Reply-To: <20260831122953.2980232-1-d.csapak@proxmox.com>

this is a special remove button that has two main features:
* removes properties from configs via PUT/POST instead of DELETE
* can show an alternative text if set

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/manager6/Makefile               |  1 +
 www/manager6/button/ConfigRemove.js | 74 +++++++++++++++++++++++++++++
 www/manager6/qemu/HardwareView.js   | 66 +++----------------------
 3 files changed, 81 insertions(+), 60 deletions(-)
 create mode 100644 www/manager6/button/ConfigRemove.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index ff33e011..79ec91bd 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -13,6 +13,7 @@ JSSRC= 							\
 	button/ConsoleButton.js				\
 	button/Revert.js				\
 	button/Split.js					\
+	button/ConfigRemove.js				\
 	controller/StorageEdit.js			\
 	data/PermPathStore.js				\
 	data/ResourceStore.js				\
diff --git a/www/manager6/button/ConfigRemove.js b/www/manager6/button/ConfigRemove.js
new file mode 100644
index 00000000..ab195dfd
--- /dev/null
+++ b/www/manager6/button/ConfigRemove.js
@@ -0,0 +1,74 @@
+Ext.define('PVE.button.ConfigRemove', {
+    extend: 'Proxmox.button.Button',
+    alias: 'widget.pveConfigRemoveButton',
+
+    text: gettext('Remove'),
+    defaultText: gettext('Remove'),
+    altText: gettext('Detach'),
+    disabled: true,
+    dangerous: true,
+    RESTMethod: 'PUT',
+
+    // overwrite for key rendering
+    renderKey: Ext.htmlEncode,
+    // overwrite for extra message
+    rows: {},
+
+    reloadCallback: Ext.identityFn,
+
+    confirmMsg: function (rec) {
+        let me = this;
+        let warn = gettext('Are you sure you want to remove entry {0}');
+        if (this.text === this.altText) {
+            warn = gettext('Are you sure you want to detach entry {0}');
+        }
+        let rendered = me.renderKey(rec.data.key, {}, rec);
+        let msg = Ext.String.format(warn, `'${rendered}'`);
+
+        if (me.rows[rec.data.key].del_extra_msg) {
+            msg += '<br>' + me.rows[rec.data.key].del_extra_msg;
+        }
+        return msg;
+    },
+    handler: function (btn, e, rec) {
+        let me = this;
+        let params = { delete: rec.data.key };
+        if (btn.RESTMethod === 'POST') {
+            params.background_delay = 5;
+        }
+        Proxmox.Utils.API2Request({
+            url: '/api2/extjs/' + me.baseurl,
+            waitMsgTarget: me,
+            method: btn.RESTMethod,
+            params: params,
+            callback: () => me.reloadCallback(),
+            failure: (response) => Ext.Msg.alert('Error', response.htmlStatus),
+            success: function (response, options) {
+                if (btn.RESTMethod === 'POST' && response.result.data !== null) {
+                    Ext.create('Proxmox.window.TaskProgress', {
+                        autoShow: true,
+                        upid: response.result.data,
+                        listeners: {
+                            destroy: () => me.reloadCallback(),
+                        },
+                    });
+                }
+            },
+        });
+    },
+    listeners: {
+        render: function (btn) {
+            // hack: calculate the max button width on first display to prevent the whole
+            // toolbar to move when we switch between the "Remove" and "Detach" labels
+            var def = btn.getSize().width;
+
+            btn.setText(btn.altText);
+            var alt = btn.getSize().width;
+
+            btn.setText(btn.defaultText);
+
+            var optimal = alt > def ? alt : def;
+            btn.setSize({ width: optimal });
+        },
+    },
+});
diff --git a/www/manager6/qemu/HardwareView.js b/www/manager6/qemu/HardwareView.js
index d1e5d6c1..0ffce89e 100644
--- a/www/manager6/qemu/HardwareView.js
+++ b/www/manager6/qemu/HardwareView.js
@@ -631,67 +631,13 @@ Ext.define('PVE.qemu.HardwareView', {
             },
         });
 
-        let remove_btn = new Proxmox.button.Button({
-            text: gettext('Remove'),
-            defaultText: gettext('Remove'),
-            altText: gettext('Detach'),
-            selModel: sm,
-            disabled: true,
-            dangerous: true,
-            RESTMethod: 'PUT',
-            confirmMsg: function (rec) {
-                let warn = gettext('Are you sure you want to remove entry {0}');
-                if (this.text === this.altText) {
-                    warn = gettext('Are you sure you want to detach entry {0}');
-                }
-                let rendered = me.renderKey(rec.data.key, {}, rec);
-                let msg = Ext.String.format(warn, `'${rendered}'`);
-
-                if (rows[rec.data.key].del_extra_msg) {
-                    msg += '<br>' + rows[rec.data.key].del_extra_msg;
-                }
-                return msg;
-            },
-            handler: function (btn, e, rec) {
-                let params = { delete: rec.data.key };
-                if (btn.RESTMethod === 'POST') {
-                    params.background_delay = 5;
-                }
-                Proxmox.Utils.API2Request({
-                    url: '/api2/extjs/' + baseurl,
-                    waitMsgTarget: me,
-                    method: btn.RESTMethod,
-                    params: params,
-                    callback: () => me.reload(),
-                    failure: (response) => Ext.Msg.alert('Error', response.htmlStatus),
-                    success: function (response, options) {
-                        if (btn.RESTMethod === 'POST' && response.result.data !== null) {
-                            Ext.create('Proxmox.window.TaskProgress', {
-                                autoShow: true,
-                                upid: response.result.data,
-                                listeners: {
-                                    destroy: () => me.reload(),
-                                },
-                            });
-                        }
-                    },
-                });
-            },
-            listeners: {
-                render: function (btn) {
-                    // hack: calculate the max button width on first display to prevent the whole
-                    // toolbar to move when we switch between the "Remove" and "Detach" labels
-                    var def = btn.getSize().width;
-
-                    btn.setText(btn.altText);
-                    var alt = btn.getSize().width;
-
-                    btn.setText(btn.defaultText);
-
-                    var optimal = alt > def ? alt : def;
-                    btn.setSize({ width: optimal });
-                },
+        let remove_btn = new PVE.button.ConfigRemove({
+            baseurl,
+            rows,
+            renderKey: function () {
+                return me.renderKey(...arguments);
             },
+            reloadCallback: () => me.reload(),
         });
 
         let revert_btn = new PVE.button.PendingRevert({
-- 
2.47.3





  parent reply	other threads:[~2026-08-31 12:30 UTC|newest]

Thread overview: 16+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2026-08-31 12:27 [PATCH manager v4 00/12] ui: split out disks and nics into grids Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 01/12] ui: utils: factor out 'media=cdrom' check Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 02/12] ui: factor out the guest key nic regex check Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 03/12] ui: add pending grid Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 04/12] ui: revert button: add parentXType and reloadCallback Dominik Csapak
2026-08-31 12:27 ` Dominik Csapak [this message]
2026-08-31 12:27 ` [PATCH manager v4 06/12] ui: qemu: hardware: wrap in container Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 07/12] ui: qemu: introduce hardware disk grid Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 08/12] ui: qemu: introduce hardware net grid Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 09/12] ui: qemu: hardware view: separate disks into own grid Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 10/12] ui: qemu: hardware view: separate nics " Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 11/12] ui: qemu: hardware view: inline edit/remove/revert button in general grid Dominik Csapak
2026-08-31 12:27 ` [PATCH manager v4 12/12] ui: qemu: hardware view: inline 'add efi' menuitem Dominik Csapak
2026-08-31 13:20 ` [PATCH manager v4 00/12] ui: split out disks and nics into grids Jonas Theisen
2026-08-31 14:11   ` Aaron Lauterer
2026-08-31 14:38   ` Jonas Theisen

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20260831122953.2980232-6-d.csapak@proxmox.com \
    --to=d.csapak@proxmox.com \
    --cc=pve-devel@lists.proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal