[PATCH pve-manager 11/11] ui: fabrics: hook up wireguard components

[Stefan Hanreich <s.hanreich@proxmox.com>]

Add the newly created Wireguard-specific components to the
FabricsView, so they can be utilized to create / edit WireGuard
fabrics / nodes.

The reference to nodeselector has been renamed, but no further changes
are necessary since it was unused in the existing components. The
WireGuard components utilize the new name for setting bindings
specific to the node selector component.

Since WireGuard nodes can be external as well, do not show an error
message if there are sections for every Proxmox VE node in the
configuration, since it is still possible to create external nodes.

Signed-off-by: Stefan Hanreich <s.hanreich@proxmox.com>
---
 www/manager6/sdn/FabricsView.js      | 12 ++++++++++++
 www/manager6/sdn/fabrics/NodeEdit.js |  9 +++++++--
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/www/manager6/sdn/FabricsView.js b/www/manager6/sdn/FabricsView.js
index 093a70f35..0362df019 100644
--- a/www/manager6/sdn/FabricsView.js
+++ b/www/manager6/sdn/FabricsView.js
@@ -33,6 +33,7 @@ Ext.define('PVE.sdn.Fabric.View', {
                     const PROTOCOL_DISPLAY_NAMES = {
                         openfabric: 'OpenFabric',
                         ospf: 'OSPF',
+                        wireguard: 'WireGuard',
                     };
                     const displayValue = PROTOCOL_DISPLAY_NAMES[value];
                     if (rec.data.state === undefined || rec.data.state === null) {
@@ -194,6 +195,10 @@ Ext.define('PVE.sdn.Fabric.View', {
                             text: 'OSPF',
                             handler: 'addOspf',
                         },
+                        {
+                            text: 'WireGuard',
+                            handler: 'addWireGuard',
+                        },
                     ],
                 },
                 addNodeButton,
@@ -272,6 +277,7 @@ Ext.define('PVE.sdn.Fabric.View', {
             const FABRIC_PANELS = {
                 openfabric: 'PVE.sdn.Fabric.OpenFabric.Fabric.Edit',
                 ospf: 'PVE.sdn.Fabric.Ospf.Fabric.Edit',
+                wireguard: 'PVE.sdn.Fabric.WireGuard.Fabric.Edit',
             };
 
             return FABRIC_PANELS[protocol];
@@ -281,11 +287,17 @@ Ext.define('PVE.sdn.Fabric.View', {
             const NODE_PANELS = {
                 openfabric: 'PVE.sdn.Fabric.OpenFabric.Node.Edit',
                 ospf: 'PVE.sdn.Fabric.Ospf.Node.Edit',
+                wireguard: 'PVE.sdn.Fabric.WireGuard.Node.Edit',
             };
 
             return NODE_PANELS[protocol];
         },
 
+        addWireGuard: function () {
+            let me = this;
+            me.openFabricAddWindow('wireguard');
+        },
+
         addOpenfabric: function () {
             let me = this;
             me.openFabricAddWindow('openfabric');
diff --git a/www/manager6/sdn/fabrics/NodeEdit.js b/www/manager6/sdn/fabrics/NodeEdit.js
index 7cbea9608..55dce3043 100644
--- a/www/manager6/sdn/fabrics/NodeEdit.js
+++ b/www/manager6/sdn/fabrics/NodeEdit.js
@@ -161,7 +161,7 @@ Ext.define('PVE.sdn.Fabric.Node.Edit', {
 
         return {
             xtype: 'pveNodeSelector',
-            reference: 'nodeselector',
+            reference: 'nodeSelector',
             fieldLabel: gettext('Node'),
             labelWidth: 120,
             name: 'node_id',
@@ -225,6 +225,7 @@ Ext.define('PVE.sdn.Fabric.Node.Edit', {
         const INTERFACE_PANELS = {
             openfabric: 'PVE.sdn.Fabric.OpenFabric.InterfacePanel',
             ospf: 'PVE.sdn.Fabric.Ospf.InterfacePanel',
+            wireguard: 'PVE.sdn.Fabric.WireGuard.InterfacePanel',
         };
 
         return INTERFACE_PANELS[protocol];
@@ -233,8 +234,12 @@ Ext.define('PVE.sdn.Fabric.Node.Edit', {
     getInterfaceSelector: function () {
         let me = this;
 
-        return Ext.create(me.getInterfacePanel(me.protocol), {
+        let componentName = me.getInterfacePanel(me.protocol);
+
+        return Ext.create(componentName, {
             name: 'interfaces',
+            reference: 'interfaceSelector',
+            viewModel: me.getViewModel(),
         });
     },
 });
-- 
2.47.3