- Added Custom Port Selection for port forwarding

- Implemented Random Port if custom port is not provided

Signed-off-by: rdeepc <12953177+rdeepc@users.noreply.github.com>

src/main/routes/port-forward-route.ts

@@ -45,10 +45,10 @@ class PortForward {
   static getPortforward(forward: PortForwardArgs) {
     return PortForward.portForwards.find((pf) => (
       pf.clusterId == forward.clusterId &&
-        pf.kind == forward.kind &&
+      pf.kind == forward.kind &&
-        pf.name == forward.name &&
+      pf.name == forward.name &&
-        pf.namespace == forward.namespace &&
+      pf.namespace == forward.namespace &&
-        pf.port == forward.port
+      pf.port == forward.port
     ));
   }
 
@@ -59,7 +59,7 @@ class PortForward {
   public name: string;
   public port: string;
   public internalPort?: number;
-  public forwardPort: string;
+  public forwardPort?: string;
 
   constructor(public kubeConfig: string, args: PortForwardArgs) {
     this.clusterId = args.clusterId;
@@ -148,17 +148,21 @@ export class PortForwardRoute {
         const started = await portForward.start();
 
         if (!started) {
+          logger.error("[PORT-FORWARD-ROUTE]: failed to start a port-forward", { namespace, port, resourceType, resourceName });
+
           return respondJson(response, {
-            message: `Failed to forward port ${port} to ${forwardPort}`
+            message: `Failed to forward port ${port}`
           }, 400);
         }
       }
 
       portForward.open();
-      respondJson(response, {port: portForward.forwardPort});
+      respondJson(response, {port: portForward.internalPort});
-    } catch (e) {
+    } catch (error) {
+      logger.error(`[PORT-FORWARD-ROUTE]: failed to open a port-forward: ${error}`, { namespace, port, resourceType, resourceName });
+
       return respondJson(response, {
-        message: `Failed to forward port ${port} to ${forwardPort}`
+        message: `Failed to forward port ${port}`
       }, 400);
     }
   }
@@ -172,13 +176,7 @@ export class PortForwardRoute {
       namespace, port, forwardPort
     });
 
-    let forwardedPort = -1;
+    respondJson(response, {port: portForward?.internalPort?? null});
-
-    if (portForward) {
-      forwardedPort = Number(portForward.forwardPort);
-    }
-
-    respondJson(response, {port: forwardedPort});
   }
 
   static async routeCurrentPortForwardStop(request: LensApiRequest) {
@@ -190,8 +188,11 @@ export class PortForwardRoute {
       namespace, port, forwardPort,
     });
 
-    portForward.stop().then( () => {
+    try {
+      await portForward.stop();
       respondJson(response, {status: true});
-    }).catch(error => logger.error(error));
+    } catch (error) {
+      logger.error(error);
+    }
   }
 }

src/renderer/components/+network-services/service-port-component.scss

@@ -37,7 +37,7 @@
 
   .portInput {
     display: inline-block !important;
-    width: 65px;
+    width: 70px;
     margin-left: 10px;
     margin-right: 10px;
   }

src/renderer/components/+network-services/service-port-component.tsx

@@ -43,7 +43,7 @@ interface PortForwardResult {
 @observer
 export class ServicePortComponent extends React.Component<Props> {
   @observable waiting = false;
-  @observable forwardPort = -1;
+  @observable forwardPort = 0;
   @observable isPortForwarded = false;
 
   constructor(props: Props) {
@@ -53,7 +53,9 @@ export class ServicePortComponent extends React.Component<Props> {
   }
 
   init() {
-    this.checkExistingPortForwarding().then();
+    this.checkExistingPortForwarding().catch(error => {
+      console.error(error);
+    });
   }
 
   async checkExistingPortForwarding() {
@@ -62,7 +64,7 @@ export class ServicePortComponent extends React.Component<Props> {
 
     const activePort = response.port;
 
-    if (activePort && activePort != -1) {
+    if (activePort) {
       this.forwardPort = activePort;
       this.isPortForwarded = true;
     }
@@ -78,7 +80,6 @@ export class ServicePortComponent extends React.Component<Props> {
 
       this.forwardPort = response.port;
       this.isPortForwarded = true;
-
     } catch(error) {
       Notifications.error(error);
     } finally {
@@ -104,10 +105,6 @@ export class ServicePortComponent extends React.Component<Props> {
   render() {
     const { port } = this.props;
 
-    if (this.forwardPort == -1) {
-      this.forwardPort = port.port;
-    }
-
     const portForwardAction = async () => {
       if (this.isPortForwarded) {
         await this.stopPortForward();
@@ -125,8 +122,9 @@ export class ServicePortComponent extends React.Component<Props> {
           type="number"
           min="0"
           max="65535"
-          value= {String(this.forwardPort)}
+          value= {this.forwardPort != 0? String(this.forwardPort) : ""}
           disabled={this.isPortForwarded}
+          placeholder={"Random"}
           onChange={(value) => this.forwardPort = Number(value)}
         />
         <Button onClick={() => portForwardAction()}> {this.isPortForwarded ? "Stop":"Forward"} </Button>

src/renderer/components/+workloads-pods/pod-container-port.scss

@@ -38,7 +38,7 @@
 
   .portInput {
     display: inline-block !important;
-    width: 65px;
+    width: 70px;
     margin-left: 10px;
     margin-right: 10px;
   }

src/renderer/components/+workloads-pods/pod-container-port.tsx

@@ -47,7 +47,7 @@ interface PortForwardResult {
 @observer
 export class PodContainerPort extends React.Component<Props> {
   @observable waiting = false;
-  @observable forwardPort = -1;
+  @observable forwardPort = 0;
   @observable isPortForwarded = false;
 
   constructor(props: Props) {
@@ -57,7 +57,9 @@ export class PodContainerPort extends React.Component<Props> {
   }
 
   init() {
-    this.checkExistingPortForwarding().then();
+    this.checkExistingPortForwarding().catch(error => {
+      console.error(error);
+    });
   }
 
   async checkExistingPortForwarding() {
@@ -66,7 +68,7 @@ export class PodContainerPort extends React.Component<Props> {
 
     const activePort = response.port;
 
-    if (activePort && activePort != -1) {
+    if (activePort) {
       this.forwardPort = activePort;
       this.isPortForwarded = true;
     }
@@ -109,14 +111,10 @@ export class PodContainerPort extends React.Component<Props> {
     const { name, containerPort, protocol } = port;
     const text = `${name ? `${name}: ` : ""}${containerPort}/${protocol}`;
 
-    if (this.forwardPort == -1) {
-      this.forwardPort = containerPort;
-    }
-
     const portForwardAction = async () => {
       if (this.isPortForwarded) {
         await this.stopPortForward();
-      }else {
+      } else {
         await this.portForward();
       }
     };
@@ -130,8 +128,9 @@ export class PodContainerPort extends React.Component<Props> {
           type="number"
           min="0"
           max="65535"
-          value= {String(this.forwardPort)}
+          value={this.forwardPort != 0? String(this.forwardPort) : ""}
           disabled={this.isPortForwarded}
+          placeholder={"Random"}
           onChange={(value) => this.forwardPort = Number(value)}
         />
         <Button onClick={() => portForwardAction()}> {this.isPortForwarded ? "Stop":"Forward"} </Button>