diff --git a/package-lock.json b/package-lock.json index 44103eb6c9..866bfc01d8 100644 --- a/package-lock.json +++ b/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", diff --git a/packages/core/src/features/metrics/metrics-feature.ts b/packages/core/src/features/metrics/metrics-feature.ts index 13a374ae2f..bac4ff6739 100644 --- a/packages/core/src/features/metrics/metrics-feature.ts +++ b/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); }, }); diff --git a/packages/core/src/renderer/components/+workloads-pods/metrics-detail-container.injectable.tsx b/packages/core/src/renderer/components/+workloads-pods/pod-metrics-details-component.tsx similarity index 60% rename from packages/core/src/renderer/components/+workloads-pods/metrics-detail-container.injectable.tsx rename to packages/core/src/renderer/components/+workloads-pods/pod-metrics-details-component.tsx index aab325ab9b..0647a57f6c 100644 --- a/packages/core/src/renderer/components/+workloads-pods/metrics-detail-container.injectable.tsx +++ b/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 ({ - Component: PodMetricsDetailsComponent, - enabled: di.inject(metricsDetailsComponentEnabledInjectable, ClusterMetricsResourceType.Pod), - orderNumber: -1, - }), - injectionToken: kubeObjectDetailItemInjectionToken, -}); - -export default podMetricsDetailsComponentInjectable; +export default PodMetricsDetailsComponent; diff --git a/packages/core/src/renderer/components/kube-object-details/kube-object-detail-items/kube-object-metrics.injectable.tsx b/packages/core/src/renderer/components/kube-object-details/kube-object-detail-items/kube-object-metrics.injectable.tsx new file mode 100644 index 0000000000..4a943b571c --- /dev/null +++ b/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; diff --git a/packages/metrics/index.ts b/packages/metrics/index.ts index 0375f957b2..bc9aff8809 100644 --- a/packages/metrics/index.ts +++ b/packages/metrics/index.ts @@ -15,3 +15,12 @@ export type ClusterOverviewUIBlock = { export const clusterOverviewUIBlockInjectionToken = getInjectionToken({ id: "cluster-overview-ui-block-injection-token", }); + +export type KubeObjectDetailMetrics = { + id: string; + Component: React.ElementType; +}; + +export const podDetailsMetricsInjectionToken = getInjectionToken({ + id: "pod-details-metrics-injection-token", +});