Add pod details metrics injection token.

Signed-off-by: Juho Heikka <juho.heikka@gmail.com>

package-lock.json

@@ -4634,6 +4634,10 @@
       "resolved": "packages/technical-features/messaging/electron/renderer",
       "link": true
     },
+    "node_modules/@k8slens/metrics": {
+      "resolved": "packages/metrics",
+      "link": true
+    },
     "node_modules/@k8slens/node-fetch": {
       "resolved": "packages/node-fetch",
       "link": true
@@ -10979,6 +10983,35 @@
         "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
+    "node_modules/acorn-node": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/acorn-node/-/acorn-node-1.8.2.tgz",
+      "integrity": "sha512-8mt+fslDufLYntIoPAaIMUe/lrbrehIiwmR3t2k9LljIzoigEPF27eLk2hy8zSGzmR/ogr7zbRKINMo1u0yh5A==",
+      "dependencies": {
+        "acorn": "^7.0.0",
+        "acorn-walk": "^7.0.0",
+        "xtend": "^4.0.2"
+      }
+    },
+    "node_modules/acorn-node/node_modules/acorn": {
+      "version": "7.4.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
+      "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
+      "bin": {
+        "acorn": "bin/acorn"
+      },
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/acorn-node/node_modules/acorn-walk": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz",
+      "integrity": "sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/acorn-walk": {
       "version": "8.2.0",
       "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz",
@@ -14617,6 +14650,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/defined": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.1.tgz",
+      "integrity": "sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/del": {
       "version": "6.1.1",
       "resolved": "https://registry.npmjs.org/del/-/del-6.1.1.tgz",
@@ -14722,6 +14763,22 @@
       "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==",
       "devOptional": true
     },
+    "node_modules/detective": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/detective/-/detective-5.2.1.tgz",
+      "integrity": "sha512-v9XE1zRnz1wRtgurGu0Bs8uHKFSTdteYZNbIPFVhUZ39L/S79ppMpdmVOZAnoz1jfEFodc48n6MX483Xo3t1yw==",
+      "dependencies": {
+        "acorn-node": "^1.8.2",
+        "defined": "^1.0.0",
+        "minimist": "^1.2.6"
+      },
+      "bin": {
+        "detective": "bin/detective.js"
+      },
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
     "node_modules/diacritics-map": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/diacritics-map/-/diacritics-map-0.1.0.tgz",
@@ -38145,6 +38202,8 @@
         "@astronautlabs/jsonpath": "^1.1.0",
         "@hapi/call": "^9.0.1",
         "@hapi/subtext": "^7.1.0",
+        "@k8slens/cluster-settings": "^6.5.0-alpha.1",
+        "@k8slens/metrics": "^6.5.0-alpha.1",
         "@k8slens/node-fetch": "^6.5.0-alpha.1",
         "@k8slens/react-application": "^1.0.0-alpha.0",
         "@kubernetes/client-node": "^0.18.1",
@@ -42409,6 +42468,18 @@
         "node": ">=10.13.0"
       }
     },
+    "packages/metrics": {
+      "name": "@k8slens/metrics",
+      "version": "6.5.0-alpha.1",
+      "license": "MIT",
+      "devDependencies": {
+        "@k8slens/eslint-config": "6.5.0-alpha.1"
+      },
+      "peerDependencies": {
+        "@ogre-tools/injectable": "^15.1.2",
+        "react": "^17.0.2"
+      }
+    },
     "packages/node-fetch": {
       "name": "@k8slens/node-fetch",
       "version": "6.5.0-alpha.1",

packages/core/src/features/metrics/metrics-feature.ts

@@ -3,10 +3,11 @@
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
 import { getFeature } from "@k8slens/feature-core";
-import { clusterOverviewUIBlockInjectionToken } from "@k8slens/metrics";
+import { clusterOverviewUIBlockInjectionToken, podDetailsMetricsInjectionToken } from "@k8slens/metrics";
 import { getInjectable } from "@ogre-tools/injectable";
 import { ClusterMetrics } from "../../renderer/components/+cluster/cluster-metrics";
 import { ClusterPieCharts } from "../../renderer/components/+cluster/cluster-pie-charts";
+import PodMetricsDetailsComponent from "../../renderer/components/+workloads-pods/pod-metrics-details-component";
 
 const clusterPieChartsClusterOverviewInjectable = getInjectable({
   id: "cluster-pie-charts-cluster-overview",
@@ -32,11 +33,22 @@ const clusterMetricsOverviewBlockInjectable = getInjectable({
   injectionToken: clusterOverviewUIBlockInjectionToken,
 });
 
+const podMetricsDetailsComponentInjectable = getInjectable({
+  id: "pod-metrics-details-component-injectable",
+  instantiate: () => ({
+    id: "pod-metrics-details-component-injectable",
+    Component: PodMetricsDetailsComponent,
+  }),
+  injectionToken: podDetailsMetricsInjectionToken,
+});
+
 export const metricsFeature = getFeature({
   id: "core-metrics-feature",
 
   register: (di) => {
     di.register(clusterPieChartsClusterOverviewInjectable);
     di.register(clusterMetricsOverviewBlockInjectable);
+
+    di.register(podMetricsDetailsComponentInjectable);
   },
 });

packages/core/src/renderer/components/+workloads-pods/pod-metrics-details-component.tsx

@@ -2,15 +2,11 @@
  * Copyright (c) OpenLens Authors. All rights reserved.
  * Licensed under MIT License. See LICENSE in root directory for more information.
  */
-import { getInjectable } from "@ogre-tools/injectable";
 import { type IAsyncComputed, withInjectables } from "@ogre-tools/injectable-react";
 import React from "react";
-import { ClusterMetricsResourceType } from "../../../common/cluster-types";
 import type { Pod } from "../../../common/k8s-api/endpoints";
 import type { PodMetricData } from "../../../common/k8s-api/endpoints/metrics.api/request-pod-metrics.injectable";
-import metricsDetailsComponentEnabledInjectable from "../../api/catalog/entity/metrics-details-component-enabled.injectable";
 import type { KubeObjectDetailsProps } from "../kube-object-details";
-import { kubeObjectDetailItemInjectionToken } from "../kube-object-details/kube-object-detail-items/kube-object-detail-item-injection-token";
 import { ResourceMetrics } from "../resource-metrics";
 import podMetricsInjectable from "./metrics.injectable";
 import { PodCharts, podMetricTabs } from "./pod-charts";
@@ -39,14 +35,4 @@ const PodMetricsDetailsComponent = withInjectables<Dependencies, KubeObjectDetai
   }),
 });
 
-const podMetricsDetailsComponentInjectable = getInjectable({
-  id: "pod-metrics-details-container",
-  instantiate: (di) => ({
-    Component: PodMetricsDetailsComponent,
-    enabled: di.inject(metricsDetailsComponentEnabledInjectable, ClusterMetricsResourceType.Pod),
-    orderNumber: -1,
-  }),
-  injectionToken: kubeObjectDetailItemInjectionToken,
-});
-
-export default podMetricsDetailsComponentInjectable;
+export default PodMetricsDetailsComponent;

packages/core/src/renderer/components/kube-object-details/kube-object-detail-items/kube-object-metrics.injectable.tsx

@@ -0,0 +1,31 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import React from "react";
+import { podDetailsMetricsInjectionToken } from "@k8slens/metrics";
+import { getInjectable } from "@ogre-tools/injectable";
+import { ClusterMetricsResourceType } from "../../../../common/cluster-types";
+import metricsDetailsComponentEnabledInjectable from "../../../api/catalog/entity/metrics-details-component-enabled.injectable";
+import { kubeObjectDetailItemInjectionToken } from "./kube-object-detail-item-injection-token";
+
+const Empty = () => <></>;
+
+const podMetricsInjectable = getInjectable({
+  id: "kube-object-pod-metrics-injectable",
+  instantiate: (di) => {
+    const podMetrics = di.injectMany(podDetailsMetricsInjectionToken);
+    const first = podMetrics[0];
+
+    const Component = first?.Component ?? Empty;
+
+    return {
+      Component,
+      enabled: di.inject(metricsDetailsComponentEnabledInjectable, ClusterMetricsResourceType.Pod),
+      orderNumber: -1,
+    };
+  },
+  injectionToken: kubeObjectDetailItemInjectionToken,
+});
+
+export default podMetricsInjectable;

packages/metrics/index.ts

@@ -15,3 +15,12 @@ export type ClusterOverviewUIBlock = {
 export const clusterOverviewUIBlockInjectionToken = getInjectionToken<ClusterOverviewUIBlock>({
   id: "cluster-overview-ui-block-injection-token",
 });
+
+export type KubeObjectDetailMetrics = {
+  id: string;
+  Component: React.ElementType;
+};
+
+export const podDetailsMetricsInjectionToken = getInjectionToken<KubeObjectDetailMetrics>({
+  id: "pod-details-metrics-injection-token",
+});