From df1b947870a0935eb91d11a36061e65f9f88f3ea Mon Sep 17 00:00:00 2001
From: Roman <ixrock@gmail.com>
Date: Tue, 21 Feb 2023 18:23:05 +0200
Subject: [PATCH] [UX]: allow to navigate to namespace-details from other
 resource details view (#7203)

* UX: allow to navigate to namespace (if available) in every kube-resource details view (via: `<KubeObjectMeta/>`)
---
 package-lock.json                             |  1 +
 ...when-cluster-is-not-relevant.test.tsx.snap | 18 +++++++--
 ...hide-kube-object-detail-item.test.tsx.snap | 12 +++++-
 .../kube-object-meta/kube-object-meta.tsx     | 37 ++++++++++++-------
 4 files changed, 50 insertions(+), 18 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index c7a2d70614..475b76734d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32653,6 +32653,7 @@
       }
     },
     "packages/infrastructure/typescript": {
+      "name": "@k8slens/typescript",
       "version": "0.0.1",
       "license": "MIT",
       "dependencies": {
diff --git a/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/disable-kube-object-detail-items-when-cluster-is-not-relevant.test.tsx.snap b/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/disable-kube-object-detail-items-when-cluster-is-not-relevant.test.tsx.snap
index 71d807a43d..885e96a26f 100644
--- a/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/disable-kube-object-detail-items-when-cluster-is-not-relevant.test.tsx.snap
+++ b/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/disable-kube-object-detail-items-when-cluster-is-not-relevant.test.tsx.snap
@@ -79,7 +79,11 @@ exports[`disable kube object detail items when cluster is not relevant given ext
             <span
               class="value"
             >
-              some-namespace
+              <a
+                href="/workloads?kube-details=%2Fapi%2Fv1%2Fnamespaces%2Fsome-namespace&kube-selected=%2Fapis%2Fsome-api-version%2Fnamespaces%2Fsome-namespace%2Fsome-kind%2Fsome-name"
+              >
+                some-namespace
+              </a>
             </span>
           </div>
           <div
@@ -695,7 +699,11 @@ exports[`disable kube object detail items when cluster is not relevant given ext
             <span
               class="value"
             >
-              some-namespace
+              <a
+                href="/workloads?kube-details=%2Fapi%2Fv1%2Fnamespaces%2Fsome-namespace&kube-selected=%2Fapis%2Fsome-api-version%2Fnamespaces%2Fsome-namespace%2Fsome-kind%2Fsome-name"
+              >
+                some-namespace
+              </a>
             </span>
           </div>
           <div>
@@ -1306,7 +1314,11 @@ exports[`disable kube object detail items when cluster is not relevant given not
             <span
               class="value"
             >
-              some-namespace
+              <a
+                href="/workloads?kube-details=%2Fapi%2Fv1%2Fnamespaces%2Fsome-namespace&kube-selected=%2Fapis%2Fsome-api-version%2Fnamespaces%2Fsome-namespace%2Fsome-kind%2Fsome-name"
+              >
+                some-namespace
+              </a>
             </span>
           </div>
           <div>
diff --git a/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/reactively-hide-kube-object-detail-item.test.tsx.snap b/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/reactively-hide-kube-object-detail-item.test.tsx.snap
index 9222e8a538..a1c528bf78 100644
--- a/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/reactively-hide-kube-object-detail-item.test.tsx.snap
+++ b/packages/core/src/features/cluster/kube-object-details/extension-api/__snapshots__/reactively-hide-kube-object-detail-item.test.tsx.snap
@@ -79,7 +79,11 @@ exports[`reactively hide kube object detail item renders 1`] = `
             <span
               class="value"
             >
-              some-namespace
+              <a
+                href="/workloads?kube-details=%2Fapi%2Fv1%2Fnamespaces%2Fsome-namespace&kube-selected=%2Fapis%2Fsome-api-version%2Fnamespaces%2Fsome-namespace%2Fsome-kind%2Fsome-name"
+              >
+                some-namespace
+              </a>
             </span>
           </div>
           <div>
@@ -690,7 +694,11 @@ exports[`reactively hide kube object detail item when the item is shown renders
             <span
               class="value"
             >
-              some-namespace
+              <a
+                href="/workloads?kube-details=%2Fapi%2Fv1%2Fnamespaces%2Fsome-namespace&kube-selected=%2Fapis%2Fsome-api-version%2Fnamespaces%2Fsome-namespace%2Fsome-kind%2Fsome-name"
+              >
+                some-namespace
+              </a>
             </span>
           </div>
           <div
diff --git a/packages/core/src/renderer/components/kube-object-meta/kube-object-meta.tsx b/packages/core/src/renderer/components/kube-object-meta/kube-object-meta.tsx
index a61ee7dd60..b0ad4bac1a 100644
--- a/packages/core/src/renderer/components/kube-object-meta/kube-object-meta.tsx
+++ b/packages/core/src/renderer/components/kube-object-meta/kube-object-meta.tsx
@@ -19,6 +19,8 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import getDetailsUrlInjectable from "../kube-detail-params/get-details-url.injectable";
 import apiManagerInjectable from "../../../common/k8s-api/api-manager/manager.injectable";
 import loggerInjectable from "../../../common/logger.injectable";
+import type { NamespaceApi } from "../../../common/k8s-api/endpoints";
+import namespaceApiInjectable from "../../../common/k8s-api/endpoints/namespace.api.injectable";
 
 export interface KubeObjectMetaProps {
   object: KubeObject;
@@ -28,20 +30,24 @@ export interface KubeObjectMetaProps {
 interface Dependencies {
   getDetailsUrl: GetDetailsUrl;
   apiManager: ApiManager;
+  namespaceApi: NamespaceApi;
   logger: Logger;
 }
 
-const NonInjectedKubeObjectMeta = observer(({
-  apiManager,
-  getDetailsUrl,
-  object,
-  hideFields = [
-    "uid",
-    "resourceVersion",
-    "selfLink",
-  ],
-  logger,
-}: Dependencies & KubeObjectMetaProps) => {
+const NonInjectedKubeObjectMeta = observer((
+  {
+    apiManager,
+    getDetailsUrl,
+    object,
+    hideFields = [
+      "uid",
+      "resourceVersion",
+      "selfLink",
+    ],
+    logger,
+    namespaceApi,
+  }
+    : Dependencies & KubeObjectMetaProps) => {
   if (!object) {
     return null;
   }
@@ -59,6 +65,10 @@ const NonInjectedKubeObjectMeta = observer(({
     getFinalizers, getId, getName, metadata: { creationTimestamp },
   } = object;
   const ownerRefs = object.getOwnerRefs();
+  const namespace = getNs();
+  const namespaceDetailsUrl = namespace ? getDetailsUrl(
+    namespaceApi.formatUrlForNotListing({ name: namespace }),
+  ) : "";
 
   return (
     <>
@@ -71,8 +81,8 @@ const NonInjectedKubeObjectMeta = observer(({
         {getName()}
         <KubeObjectStatusIcon key="icon" object={object} />
       </DrawerItem>
-      <DrawerItem name="Namespace" hidden={isHidden("namespace") || !getNs()}>
-        {getNs()}
+      <DrawerItem name="Namespace" hidden={isHidden("namespace") || !namespace}>
+        <Link to={namespaceDetailsUrl}>{namespace}</Link>
       </DrawerItem>
       <DrawerItem name="UID" hidden={isHidden("uid")}>
         {getId()}
@@ -122,5 +132,6 @@ export const KubeObjectMeta = withInjectables<Dependencies, KubeObjectMetaProps>
     getDetailsUrl: di.inject(getDetailsUrlInjectable),
     apiManager: di.inject(apiManagerInjectable),
     logger: di.inject(loggerInjectable),
+    namespaceApi: di.inject(namespaceApiInjectable),
   }),
 });