From: Stefan Hanreich <s.hanreich@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [PATCH pve-manager 12/13] ui: fabric content: add wireguard protocol
Date: Wed, 17 Jun 2026 13:10:09 +0200 [thread overview]
Message-ID: <20260617111012.312710-13-s.hanreich@proxmox.com> (raw)
In-Reply-To: <20260617111012.312710-1-s.hanreich@proxmox.com>
WireGuard returns a lot of additional options compared to the other,
FRR-based, fabric types. Hide the routes panel completely and change
the neighbor / interface panel to add the additional columns if the
fabric has the type wireguard.
Signed-off-by: Stefan Hanreich <s.hanreich@proxmox.com>
---
www/manager6/sdn/FabricsContentView.js | 173 +++++++++++++++++++------
www/manager6/sdn/NetworkBrowser.js | 40 +++---
2 files changed, 154 insertions(+), 59 deletions(-)
diff --git a/www/manager6/sdn/FabricsContentView.js b/www/manager6/sdn/FabricsContentView.js
index 47e8bce7f..ebed8eea5 100644
--- a/www/manager6/sdn/FabricsContentView.js
+++ b/www/manager6/sdn/FabricsContentView.js
@@ -28,50 +28,143 @@ Ext.define('PVE.sdn.FabricNeighborsContentView', {
extend: 'Ext.grid.GridPanel',
alias: 'widget.pveSDNFabricNeighborsContentView',
- columns: [
- {
- header: gettext('Neighbor'),
- sortable: true,
- dataIndex: 'neighbor',
- flex: 1,
- },
- {
- header: gettext('Status'),
- sortable: true,
- dataIndex: 'status',
- flex: 0.5,
- },
- {
- header: gettext('Uptime'),
- sortable: true,
- dataIndex: 'uptime',
- flex: 0.5,
- },
- ],
+ protocol: null,
+
+ initComponent: function() {
+ let me = this;
+
+ me.columns = [
+ {
+ header: gettext('Neighbor'),
+ sortable: true,
+ dataIndex: 'neighbor',
+ flex: 1,
+ },
+ ];
+
+ if (me.protocol === 'wireguard') {
+ me.columns.unshift({
+ header: gettext('Name'),
+ sortable: true,
+ dataIndex: 'name',
+ flex: 1,
+ });
+
+ me.columns = me.columns.concat([
+ {
+ header: gettext('Interface'),
+ sortable: true,
+ dataIndex: 'interface',
+ flex: 0.5,
+ },
+ {
+ header: gettext('Public Key'),
+ sortable: true,
+ dataIndex: 'public-key',
+ flex: 1,
+ },
+ {
+ header: gettext('Allowed IPs'),
+ sortable: true,
+ dataIndex: 'allowed-ips',
+ flex: 1,
+ },
+ {
+ header: gettext('Latest Handshake'),
+ sortable: true,
+ dataIndex: 'latest-handshake',
+ flex: 1,
+ renderer: function(value) {
+ if (!value) {
+ return "-"
+ }
+
+ return Proxmox.Utils.render_timestamp(value);
+ }
+ },
+ {
+ header: gettext('Bytes transmitted'),
+ sortable: true,
+ dataIndex: 'bytes-tx',
+ flex: 0.5,
+ renderer: Proxmox.Utils.render_size,
+ },
+ {
+ header: gettext('Bytes received'),
+ sortable: true,
+ dataIndex: 'bytes-rx',
+ flex: 0.5,
+ renderer: Proxmox.Utils.render_size,
+ },
+ ]);
+ } else {
+ me.columns = me.columns.concat([
+ {
+ header: gettext('Status'),
+ sortable: true,
+ dataIndex: 'status',
+ flex: 0.5,
+ },
+ {
+ header: gettext('Uptime'),
+ sortable: true,
+ dataIndex: 'uptime',
+ flex: 0.5,
+ },
+ ]);
+ }
+
+ me.callParent();
+ }
});
Ext.define('PVE.sdn.FabricInterfacesContentView', {
extend: 'Ext.grid.GridPanel',
alias: 'widget.pveSDNFabricInterfacesContentView',
- columns: [
- {
- header: gettext('Name'),
- sortable: true,
- dataIndex: 'name',
- flex: 1,
- },
- {
- header: gettext('Type'),
- sortable: true,
- dataIndex: 'type',
- flex: 1,
- },
- {
- header: gettext('State'),
- sortable: true,
- dataIndex: 'state',
- flex: 1,
- },
- ],
+ protocol: null,
+
+ initComponent: function() {
+ let me = this;
+
+ me.columns = [
+ {
+ header: gettext('Name'),
+ sortable: true,
+ dataIndex: 'name',
+ flex: 1,
+ },
+ {
+ header: gettext('Type'),
+ sortable: true,
+ dataIndex: 'type',
+ flex: 1,
+ },
+ {
+ header: gettext('State'),
+ sortable: true,
+ dataIndex: 'state',
+ flex: 1,
+ },
+ ];
+
+ if (me.protocol === 'wireguard') {
+ me.columns = me.columns.concat([
+ {
+ header: gettext('Public Key'),
+ sortable: true,
+ dataIndex: 'public-key',
+ flex: 1,
+ },
+ {
+ header: gettext('Listen Port'),
+ sortable: true,
+ dataIndex: 'listen-port',
+ flex: 1,
+ },
+ ]);
+ }
+
+ me.callParent();
+ }
});
diff --git a/www/manager6/sdn/NetworkBrowser.js b/www/manager6/sdn/NetworkBrowser.js
index f94b27d35..edb00fb38 100644
--- a/www/manager6/sdn/NetworkBrowser.js
+++ b/www/manager6/sdn/NetworkBrowser.js
@@ -26,27 +26,29 @@ Ext.define('PVE.network.Browser', {
if (networkType === 'fabric') {
me.onlineHelp = 'pvesdn_config_fabrics';
- me.items.push({
- nodename: node,
- fabricId: name,
- protocol: me.pveSelNode.data.protocol,
- xtype: 'pveSDNFabricRoutesContentView',
- title: gettext('Routes'),
- iconCls: 'fa fa-exchange',
- itemId: 'routes',
- width: '100%',
- store: {
- proxy: {
- type: 'proxmox',
- url: `/api2/json/nodes/${node}/sdn/fabrics/${name}/routes`,
- reader: {
- type: 'json',
- rootProperty: 'data',
+ if (me.pveSelNode.data.protocol !== 'wireguard') {
+ me.items.push({
+ nodename: node,
+ fabricId: name,
+ protocol: me.pveSelNode.data.protocol,
+ xtype: 'pveSDNFabricRoutesContentView',
+ title: gettext('Routes'),
+ iconCls: 'fa fa-exchange',
+ itemId: 'routes',
+ width: '100%',
+ store: {
+ proxy: {
+ type: 'proxmox',
+ url: `/api2/json/nodes/${node}/sdn/fabrics/${name}/routes`,
+ reader: {
+ type: 'json',
+ rootProperty: 'data',
+ },
},
+ autoLoad: true,
},
- autoLoad: true,
- },
- });
+ });
+ }
me.items.push({
nodename: node,
--
2.47.3
next prev parent reply other threads:[~2026-06-17 11:12 UTC|newest]
Thread overview: 14+ messages / expand[flat|nested] mbox.gz Atom feed top
2026-06-17 11:09 [PATCH docs/manager/network/proxmox{,-backup,-datacenter-manager,-firewall,-network-interface-pinning,-ve-rs,-perl-rs} 00/13] Status reporting for wireguard fabrics Stefan Hanreich
2026-06-17 11:09 ` [PATCH proxmox 01/13] iproute2: schema: move iproute2 helpers to new create / schema Stefan Hanreich
2026-06-17 11:09 ` [PATCH proxmox 02/13] iproute2: add missing getters Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox 03/13] iproute2: add support for parsing interface flags Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox 04/13] wireguard: derive additional traits for public key Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-backup 05/13] metric_collection: switch to proxmox-iproute2 crate Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-datacenter-manager 06/13] " Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-firewall 07/13] firewall config: " Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-network-interface-pinning 08/13] network-interface-pinning: " Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-ve-rs 09/13] fabric: wireguard: add helper for findings peer based on endpoint Stefan Hanreich
2026-06-17 11:10 ` [PATCH proxmox-perl-rs 10/13] sdn status: fabrics: add status reporting for wireguard Stefan Hanreich
2026-06-17 11:10 ` [PATCH pve-network 11/13] api: fabric status: add schema for wireguard properties Stefan Hanreich
2026-06-17 11:10 ` Stefan Hanreich [this message]
2026-06-17 11:10 ` [PATCH pve-docs 13/13] sdn: add documentation for wireguard status reporting Stefan Hanreich
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=20260617111012.312710-13-s.hanreich@proxmox.com \
--to=s.hanreich@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 a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox