From 36c1c2cde6144c98bea44abd2330cebd382ef514 Mon Sep 17 00:00:00 2001
From: devodev <abalexandrebarone@gmail.com>
Date: Sat, 17 Jul 2021 15:41:08 -0400
Subject: [PATCH] Use BadgeNavigatable for pod and node selectors

Signed-off-by: devodev <abalexandrebarone@gmail.com>
---
 .../components/+network-services/service-details.tsx |  4 ++--
 .../+workloads-daemonsets/daemonset-details.tsx      | 10 +++-------
 .../+workloads-deployments/deployment-details.tsx    | 12 +++---------
 .../components/+workloads-pods/pod-details.tsx       |  8 ++------
 .../+workloads-replicasets/replicaset-details.tsx    | 10 +++-------
 .../+workloads-statefulsets/statefulset-details.tsx  | 12 +++---------
 6 files changed, 16 insertions(+), 40 deletions(-)

diff --git a/src/renderer/components/+network-services/service-details.tsx b/src/renderer/components/+network-services/service-details.tsx
index ec10cd5f94..bd54e038c1 100644
--- a/src/renderer/components/+network-services/service-details.tsx
+++ b/src/renderer/components/+network-services/service-details.tsx
@@ -24,7 +24,7 @@ import "./service-details.scss";
 import React from "react";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { DrawerItem, DrawerTitle } from "../drawer";
-import { Badge } from "../badge";
+import { Badge, BadgeNavigatable } from "../badge";
 import type { KubeObjectDetailsProps } from "../kube-object";
 import type { Service } from "../../api/endpoints";
 import { KubeObjectMeta } from "../kube-object/kube-object-meta";
@@ -61,7 +61,7 @@ export class ServiceDetails extends React.Component<Props> {
         <KubeObjectMeta object={service}/>
 
         <DrawerItem name="Selector" labelsOnly>
-          {service.getSelector().map(selector => <Badge key={selector} label={selector}/>)}
+          {service.getSelector().map(selector => <BadgeNavigatable key={selector} searchFilter={selector} resource="pods"/>)}
         </DrawerItem>
 
         <DrawerItem name="Type">
diff --git a/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx b/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
index 199385a1f4..56a3640a31 100644
--- a/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
+++ b/src/renderer/components/+workloads-daemonsets/daemonset-details.tsx
@@ -24,7 +24,7 @@ import "./daemonset-details.scss";
 import React from "react";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { DrawerItem } from "../drawer";
-import { Badge } from "../badge";
+import { BadgeNavigatable } from "../badge";
 import { PodDetailsStatuses } from "../+workloads-pods/pod-details-statuses";
 import { PodDetailsTolerations } from "../+workloads-pods/pod-details-tolerations";
 import { PodDetailsAffinities } from "../+workloads-pods/pod-details-affinities";
@@ -83,16 +83,12 @@ export class DaemonSetDetails extends React.Component<Props> {
         <KubeObjectMeta object={daemonSet}/>
         {selectors.length > 0 &&
         <DrawerItem name="Selector" labelsOnly>
-          {
-            selectors.map(label => <Badge key={label} label={label}/>)
-          }
+          {selectors.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="pods"/>)}
         </DrawerItem>
         }
         {nodeSelector.length > 0 &&
         <DrawerItem name="Node Selector" labelsOnly>
-          {
-            nodeSelector.map(label => (<Badge key={label} label={label}/>))
-          }
+          {nodeSelector.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="nodes"/>)}
         </DrawerItem>
         }
         {images.length > 0 &&
diff --git a/src/renderer/components/+workloads-deployments/deployment-details.tsx b/src/renderer/components/+workloads-deployments/deployment-details.tsx
index 87f4e08378..877eac60c0 100644
--- a/src/renderer/components/+workloads-deployments/deployment-details.tsx
+++ b/src/renderer/components/+workloads-deployments/deployment-details.tsx
@@ -25,7 +25,7 @@ import React from "react";
 import kebabCase from "lodash/kebabCase";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { DrawerItem } from "../drawer";
-import { Badge } from "../badge";
+import { Badge, BadgeNavigatable } from "../badge";
 import type { Deployment } from "../../api/endpoints";
 import { PodDetailsTolerations } from "../+workloads-pods/pod-details-tolerations";
 import { PodDetailsAffinities } from "../+workloads-pods/pod-details-affinities";
@@ -91,18 +91,12 @@ export class DeploymentDetails extends React.Component<Props> {
         </DrawerItem>
         {selectors.length > 0 &&
         <DrawerItem name="Selector" labelsOnly>
-          {
-            selectors.map(label => <Badge key={label} label={label}/>)
-          }
+          {selectors.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="pods"/>)}
         </DrawerItem>
         }
         {nodeSelector.length > 0 &&
         <DrawerItem name="Node Selector">
-          {
-            nodeSelector.map(label => (
-              <Badge key={label} label={label}/>
-            ))
-          }
+          {nodeSelector.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="nodes"/>)}
         </DrawerItem>
         }
         <DrawerItem name="Strategy Type">
diff --git a/src/renderer/components/+workloads-pods/pod-details.tsx b/src/renderer/components/+workloads-pods/pod-details.tsx
index 2bb08deeff..185c6bcaea 100644
--- a/src/renderer/components/+workloads-pods/pod-details.tsx
+++ b/src/renderer/components/+workloads-pods/pod-details.tsx
@@ -28,7 +28,7 @@ import { Link } from "react-router-dom";
 import { autorun, observable, reaction, makeObservable } from "mobx";
 import { IPodMetrics, nodesApi, Pod, pvcApi, configMapApi } from "../../api/endpoints";
 import { DrawerItem, DrawerTitle } from "../drawer";
-import { Badge } from "../badge";
+import { Badge, BadgeNavigatable } from "../badge";
 import { boundMethod, cssNames, interval, toJS } from "../../utils";
 import { PodDetailsContainer } from "./pod-details-container";
 import { PodDetailsAffinities } from "./pod-details-affinities";
@@ -152,11 +152,7 @@ export class PodDetails extends React.Component<Props> {
         }
         {nodeSelector.length > 0 &&
         <DrawerItem name="Node Selector">
-          {
-            nodeSelector.map(label => (
-              <Badge key={label} label={label}/>
-            ))
-          }
+          {nodeSelector.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="nodes"/>)}
         </DrawerItem>
         }
         <PodDetailsTolerations workload={pod}/>
diff --git a/src/renderer/components/+workloads-replicasets/replicaset-details.tsx b/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
index 7818be6765..6985b19761 100644
--- a/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
+++ b/src/renderer/components/+workloads-replicasets/replicaset-details.tsx
@@ -23,7 +23,7 @@ import "./replicaset-details.scss";
 import React from "react";
 import { reaction } from "mobx";
 import { DrawerItem } from "../drawer";
-import { Badge } from "../badge";
+import { BadgeNavigatable } from "../badge";
 import { replicaSetStore } from "./replicasets.store";
 import { PodDetailsStatuses } from "../+workloads-pods/pod-details-statuses";
 import { PodDetailsTolerations } from "../+workloads-pods/pod-details-tolerations";
@@ -83,16 +83,12 @@ export class ReplicaSetDetails extends React.Component<Props> {
         <KubeObjectMeta object={replicaSet}/>
         {selectors.length > 0 &&
         <DrawerItem name="Selector" labelsOnly>
-          {
-            selectors.map(label => <Badge key={label} label={label}/>)
-          }
+          {selectors.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="pods"/>)}
         </DrawerItem>
         }
         {nodeSelector.length > 0 &&
         <DrawerItem name="Node Selector" labelsOnly>
-          {
-            nodeSelector.map(label => <Badge key={label} label={label}/>)
-          }
+          {nodeSelector.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="nodes"/>)}
         </DrawerItem>
         }
         {images.length > 0 &&
diff --git a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
index dafe8c16b6..d9f51cc8d3 100644
--- a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
+++ b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx
@@ -24,7 +24,7 @@ import "./statefulset-details.scss";
 import React from "react";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { reaction } from "mobx";
-import { Badge } from "../badge";
+import { BadgeNavigatable } from "../badge";
 import { DrawerItem } from "../drawer";
 import { PodDetailsStatuses } from "../+workloads-pods/pod-details-statuses";
 import { PodDetailsTolerations } from "../+workloads-pods/pod-details-tolerations";
@@ -82,18 +82,12 @@ export class StatefulSetDetails extends React.Component<Props> {
         <KubeObjectMeta object={statefulSet}/>
         {selectors.length &&
         <DrawerItem name="Selector" labelsOnly>
-          {
-            selectors.map(label => <Badge key={label} label={label}/>)
-          }
+          {selectors.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="pods"/>)}
         </DrawerItem>
         }
         {nodeSelector.length > 0 &&
         <DrawerItem name="Node Selector" labelsOnly>
-          {
-            nodeSelector.map(label => (
-              <Badge key={label} label={label}/>
-            ))
-          }
+          {nodeSelector.map(label => <BadgeNavigatable key={label} searchFilter={label} resource="nodes"/>)}
         </DrawerItem>
         }
         {images.length > 0 &&