[PATCH manager] sdn: subnets: hide irrelevant fields depending on zone type

Theodor Fumics theodor.fumics at gmx.net
Fri Jul 26 15:27:45 CEST 2024


The SNAT option is only applicable to Simple and EVPN zone types.
For other zone types, this field is irrelevant and can cause confusion.
This commit hides the SNAT field when it is not applicable to the
selected zone type, improving clarity for users.

Signed-off-by: Theodor Fumics <theodor.fumics at gmx.net>
---
 www/manager6/sdn/SubnetEdit.js | 18 ++++++++++++++++++
 www/manager6/sdn/SubnetView.js | 16 ++++++++++++++++
 www/manager6/sdn/VnetView.js   |  9 +++++++++
 3 files changed, 43 insertions(+)

diff --git a/www/manager6/sdn/SubnetEdit.js b/www/manager6/sdn/SubnetEdit.js
index 8fc3f52b..d80eeca2 100644
--- a/www/manager6/sdn/SubnetEdit.js
+++ b/www/manager6/sdn/SubnetEdit.js
@@ -2,6 +2,8 @@ Ext.define('PVE.sdn.SubnetInputPanel', {
     extend: 'Proxmox.panel.InputPanel',
     mixins: ['Proxmox.Mixin.CBind'],

+    zoneInfo: undefined,
+
     onGetValues: function(values) {
 	let me = this;

@@ -38,6 +40,7 @@ Ext.define('PVE.sdn.SubnetInputPanel', {
 	},
 	{
 	    xtype: 'proxmoxcheckbox',
+	    itemId: 'snatSubnetCheckbox',
 	    name: 'snat',
 	    uncheckedValue: null,
 	    checked: false,
@@ -57,6 +60,18 @@ Ext.define('PVE.sdn.SubnetInputPanel', {
 	    },
 	},
     ],
+
+    initComponent: function() {
+	let me = this;
+	me.callParent();
+
+	let zoneType = me.zoneInfo?.type;
+
+	var showSNATCheckbox = ['simple', 'evpn'].includes(zoneType);
+
+	var snatCheckbox = me.down('#snatSubnetCheckbox');
+	snatCheckbox.setHidden(!showSNATCheckbox);
+    },
 });

 Ext.define('PVE.sdn.SubnetDhcpRangePanel', {
@@ -243,6 +258,8 @@ Ext.define('PVE.sdn.SubnetEdit', {

     base_url: undefined,

+    zoneInfo: undefined,
+
     bodyPadding: 0,

     initComponent: function() {
@@ -261,6 +278,7 @@ Ext.define('PVE.sdn.SubnetEdit', {
 	let ipanel = Ext.create('PVE.sdn.SubnetInputPanel', {
 	    isCreate: me.isCreate,
 	    title: gettext('General'),
+	    zoneInfo: me.zoneInfo,
 	});

 	let dhcpPanel = Ext.create('PVE.sdn.SubnetDhcpRangePanel', {
diff --git a/www/manager6/sdn/SubnetView.js b/www/manager6/sdn/SubnetView.js
index d342f0ba..fd103d78 100644
--- a/www/manager6/sdn/SubnetView.js
+++ b/www/manager6/sdn/SubnetView.js
@@ -7,6 +7,9 @@ Ext.define('PVE.sdn.SubnetView', {

     base_url: undefined,

+    zoneName: undefined,
+    zoneInfo: undefined,
+
     remove_btn: undefined,

     setBaseUrl: function(url) {
@@ -28,6 +31,18 @@ Ext.define('PVE.sdn.SubnetView', {
 	}
     },

+    loadZone: function(name) {
+	let me = this;
+
+	Proxmox.Utils.API2Request({
+	    url: `/cluster/sdn/zones/${name}?pending=1`,
+	    method: 'GET',
+	    success: function(response) {
+		me.zoneInfo = response?.result?.data;
+	    },
+	});
+    },
+
     initComponent: function() {
 	let me = this;

@@ -59,6 +74,7 @@ Ext.define('PVE.sdn.SubnetView', {
 		let win = Ext.create('PVE.sdn.SubnetEdit', {
 		    autoShow: true,
 		    base_url: me.base_url,
+		    zoneInfo: me.zoneInfo,
 		    type: 'subnet',
 		});
 		win.on('destroy', reload);
diff --git a/www/manager6/sdn/VnetView.js b/www/manager6/sdn/VnetView.js
index 3fd3c916..9c9dcc5b 100644
--- a/www/manager6/sdn/VnetView.js
+++ b/www/manager6/sdn/VnetView.js
@@ -141,6 +141,15 @@ Ext.define('PVE.sdn.VnetView', {
 		select: function(_sm, rec) {
 		    let url = `/cluster/sdn/vnets/${rec.data.vnet}/subnets`;
 		    me.subnetview_panel.setBaseUrl(url);
+
+		    let zoneName;
+		    if (rec.data.pending) {
+			zoneName = rec.data.pending.zone;
+		    } else {
+			zoneName = rec.data.zone;
+		    }
+
+		    me.subnetview_panel.loadZone(zoneName);
 		},
 		deselect: function() {
 		    me.subnetview_panel.setBaseUrl(undefined);
--
2.39.2




More information about the pve-devel mailing list