Conditionally render node taints upon value existance

Signed-off-by: Sebastian Malton <sebastian@malton.name>

src/common/k8s-api/endpoints/nodes.api.ts

@@ -56,6 +56,21 @@ export interface INodeMetrics<T = IMetrics> {
   fsSize: T;
 }
 
+export interface NodeTaint {
+  key: string;
+  value?: string;
+  effect: string;
+  timeAdded: string;
+}
+
+export function formatNodeTaint(taint: NodeTaint): string {
+  if (taint.value) {
+    return `${taint.key}=${taint.value}:${taint.effect}`;
+  }
+
+  return `${taint.key}:${taint.effect}`;
+}
+
 export interface Node {
   spec: {
     podCIDR?: string;
@@ -65,12 +80,7 @@ export interface Node {
      * @deprecated see https://issues.k8s.io/61966
      */
     externalID?: string;
-    taints?: {
+    taints?: NodeTaint[];
-      key: string;
-      value: string;
-      effect: string;
-      timeAdded: string;
-    }[];
     unschedulable?: boolean;
   };
   status: {

src/renderer/components/+nodes/node-details.tsx

@@ -132,11 +132,7 @@ export class NodeDetails extends React.Component<Props> {
         />
         {taints.length > 0 && (
           <DrawerItem name="Taints" labelsOnly>
-            {
+            {taints.map(taint => <Badge key={taint.key} label={formatNodeTaint(taint)} />)}
-              taints.map(({ key, effect, value }) => (
-                <Badge key={key} label={`${key}=${value}:${effect}`} />
-              ))
-            }
           </DrawerItem>
         )}
         {conditions &&

src/renderer/components/+nodes/nodes.tsx

@@ -227,6 +227,7 @@ export class Nodes extends React.Component<Props> {
           ]}
           renderTableContents={node => {
             const tooltipId = `node-taints-${node.getId()}`;
+            const taints = node.getTaints();
 
             return [
               <Badge flat key="name" label={node.getName()} tooltip={node.getName()} />,
@@ -235,9 +236,9 @@ export class Nodes extends React.Component<Props> {
               this.renderMemoryUsage(node),
               this.renderDiskUsage(node),
               <>
-                <span id={tooltipId}>{node.getTaints().length}</span>
+                <span id={tooltipId}>{taints.length}</span>
                 <Tooltip targetId={tooltipId} tooltipOnParentHover={true} style={{ whiteSpace: "pre-line" }}>
-                  {node.getTaints().map(({ key, value, effect }) => `${key}=${value}:${effect}`).join("\n")}
+                  {taints.map(formatNodeTaint).join("\n")}
                 </Tooltip>
               </>,
               node.getRoleLabels(),