diff --git a/src/renderer/components/+storage-volume-claims/metrics-details-component.injectable.tsx b/src/renderer/components/+storage-volume-claims/metrics-details-component.injectable.tsx
new file mode 100644
index 0000000000..771645a74c
--- /dev/null
+++ b/src/renderer/components/+storage-volume-claims/metrics-details-component.injectable.tsx
@@ -0,0 +1,34 @@
+/**
+ * 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 React from "react";
+import { ClusterMetricsResourceType } from "../../../common/cluster-types";
+import enabledMetricsInjectable from "../../api/catalog/entity/metrics-enabled.injectable";
+import { kubeObjectDetailItemInjectionToken } from "../kube-object-details/kube-object-detail-items/kube-object-detail-item-injection-token";
+import { ResourceMetrics } from "../resource-metrics";
+import persistentVolumeClaimMetricsInjectable from "./metrics.injectable";
+import { VolumeClaimDiskChart } from "./volume-claim-disk-chart";
+
+const persistentVolumeClaimMetricsDetailsComponentInjectable = getInjectable({
+ id: "persistent-volume-claim-metrics-details-component",
+ instantiate: (di) => ({
+ Component: ({ object }) => (
+
+
+
+ ),
+ enabled: di.inject(enabledMetricsInjectable, ClusterMetricsResourceType.VolumeClaim),
+ orderNumber: -1,
+ }),
+ injectionToken: kubeObjectDetailItemInjectionToken,
+});
+
+export default persistentVolumeClaimMetricsDetailsComponentInjectable;
diff --git a/src/renderer/components/+storage-volume-claims/metrics.injectable.ts b/src/renderer/components/+storage-volume-claims/metrics.injectable.ts
new file mode 100644
index 0000000000..edd74b50e6
--- /dev/null
+++ b/src/renderer/components/+storage-volume-claims/metrics.injectable.ts
@@ -0,0 +1,27 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
+import { asyncComputed } from "@ogre-tools/injectable-react";
+import { now } from "mobx-utils";
+import type { PersistentVolumeClaim } from "../../../common/k8s-api/endpoints";
+import requestPersistentVolumeClaimMetricsInjectable from "../../../common/k8s-api/endpoints/metrics.api/request-persistent-volume-claim-metrics.injectable";
+
+const persistentVolumeClaimMetricsInjectable = getInjectable({
+ id: "persistent-volume-claim-metrics",
+ instantiate: (di, persistentVolumeClaim) => {
+ const requestPersistentVolumeClaimMetrics = di.inject(requestPersistentVolumeClaimMetricsInjectable);
+
+ return asyncComputed(() => {
+ now(60 * 1000); // update every minute
+
+ return requestPersistentVolumeClaimMetrics(persistentVolumeClaim);
+ });
+ },
+ lifecycle: lifecycleEnum.keyedSingleton({
+ getInstanceKey: (di, persistentVolumeClaim: PersistentVolumeClaim) => persistentVolumeClaim.getId(),
+ }),
+});
+
+export default persistentVolumeClaimMetricsInjectable;
diff --git a/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx b/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
index 250ab2e713..954bad9bc5 100644
--- a/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
+++ b/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx
@@ -6,64 +6,37 @@
import "./volume-claim-details.scss";
import React, { Fragment } from "react";
-import { makeObservable, observable, reaction } from "mobx";
-import { disposeOnUnmount, observer } from "mobx-react";
+import { observer } from "mobx-react";
import { DrawerItem, DrawerTitle } from "../drawer";
import { Badge } from "../badge";
import { Link } from "react-router-dom";
-import { ResourceMetrics } from "../resource-metrics";
-import { VolumeClaimDiskChart } from "./volume-claim-disk-chart";
import type { KubeObjectDetailsProps } from "../kube-object-details";
-import { PersistentVolumeClaim, storageClassApi } from "../../../common/k8s-api/endpoints";
-import { ClusterMetricsResourceType } from "../../../common/cluster-types";
-import { KubeObjectMeta } from "../kube-object-meta";
-import logger from "../../../common/logger";
-import type { PersistentVolumeClaimMetricData, RequestPersistentVolumeClaimMetrics } from "../../../common/k8s-api/endpoints/metrics.api/request-persistent-volume-claim-metrics.injectable";
+import type { StorageClassApi } from "../../../common/k8s-api/endpoints";
+import { PersistentVolumeClaim } from "../../../common/k8s-api/endpoints";
+import type { Logger } from "../../../common/logger";
import { withInjectables } from "@ogre-tools/injectable-react";
-import requestPersistentVolumeClaimMetricsInjectable from "../../../common/k8s-api/endpoints/metrics.api/request-persistent-volume-claim-metrics.injectable";
-import type { GetActiveClusterEntity } from "../../api/catalog/entity/get-active-cluster-entity.injectable";
import type { GetDetailsUrl } from "../kube-detail-params/get-details-url.injectable";
import type { PodStore } from "../+workloads-pods/store";
-import getActiveClusterEntityInjectable from "../../api/catalog/entity/get-active-cluster-entity.injectable";
import getDetailsUrlInjectable from "../kube-detail-params/get-details-url.injectable";
import podStoreInjectable from "../+workloads-pods/store.injectable";
import { stopPropagation } from "../../../renderer/utils";
+import storageClassApiInjectable from "../../../common/k8s-api/endpoints/storage-class.api.injectable";
+import loggerInjectable from "../../../common/logger.injectable";
export interface PersistentVolumeClaimDetailsProps extends KubeObjectDetailsProps {
}
interface Dependencies {
- requestPersistentVolumeClaimMetrics: RequestPersistentVolumeClaimMetrics;
- getActiveClusterEntity: GetActiveClusterEntity;
getDetailsUrl: GetDetailsUrl;
podStore: PodStore;
+ storageClassApi: StorageClassApi;
+ logger: Logger;
}
@observer
class NonInjectedPersistentVolumeClaimDetails extends React.Component {
- @observable metrics: PersistentVolumeClaimMetricData | null = null;
-
- constructor(props: PersistentVolumeClaimDetailsProps & Dependencies) {
- super(props);
- makeObservable(this);
- }
-
- componentDidMount() {
- disposeOnUnmount(this, [
- reaction(() => this.props.object, () => {
- this.metrics = null;
- }),
- ]);
- }
-
- loadMetrics = async () => {
- const { object: volumeClaim, requestPersistentVolumeClaimMetrics } = this.props;
-
- this.metrics = await requestPersistentVolumeClaimMetrics(volumeClaim);
- };
-
render() {
- const { object: volumeClaim, getActiveClusterEntity, podStore, getDetailsUrl } = this.props;
+ const { object: volumeClaim, podStore, getDetailsUrl, storageClassApi, logger } = this.props;
if (!volumeClaim) {
return null;
@@ -77,27 +50,13 @@ class NonInjectedPersistentVolumeClaimDetails extends React.Component
- {!isMetricHidden && (
-
-
-
- )}
-
{accessModes?.join(", ")}
@@ -147,9 +106,9 @@ class NonInjectedPersistentVolumeClaimDetails extends React.Component(NonInjectedPersistentVolumeClaimDetails, {
getProps: (di, props) => ({
...props,
- requestPersistentVolumeClaimMetrics: di.inject(requestPersistentVolumeClaimMetricsInjectable),
- getActiveClusterEntity: di.inject(getActiveClusterEntityInjectable),
getDetailsUrl: di.inject(getDetailsUrlInjectable),
podStore: di.inject(podStoreInjectable),
+ storageClassApi: di.inject(storageClassApiInjectable),
+ logger: di.inject(loggerInjectable),
}),
});