diff --git a/src/renderer/components/+network-ingresses/ingress-details.tsx b/src/renderer/components/+network-ingresses/ingress-details.tsx index 7fe7665041..6c762d1beb 100644 --- a/src/renderer/components/+network-ingresses/ingress-details.tsx +++ b/src/renderer/components/+network-ingresses/ingress-details.tsx @@ -23,7 +23,7 @@ import "./ingress-details.scss"; import React from "react"; import { disposeOnUnmount, observer } from "mobx-react"; -import { observable, reaction } from "mobx"; +import { makeObservable, observable, reaction } from "mobx"; import { DrawerItem, DrawerTitle } from "../drawer"; import type { ILoadBalancerIngress, Ingress } from "../../../common/k8s-api/endpoints"; import { Table, TableCell, TableHead, TableRow } from "../table"; @@ -34,6 +34,7 @@ import { KubeObjectMeta } from "../kube-object-meta"; import { getBackendServiceNamePort, getMetricsForIngress, IIngressMetrics } from "../../../common/k8s-api/endpoints/ingress.api"; import { getActiveClusterEntity } from "../../api/catalog-entity-registry"; import { ClusterMetricsResourceType } from "../../../common/cluster-types"; +import { boundMethod } from "../../utils"; interface Props extends KubeObjectDetailsProps { } @@ -42,11 +43,17 @@ interface Props extends KubeObjectDetailsProps { export class IngressDetails extends React.Component { @observable metrics: IIngressMetrics = null; + constructor(props: Props) { + super(props); + makeObservable(this); + } + @disposeOnUnmount clean = reaction(() => this.props.object, () => { this.metrics = null; }); + @boundMethod async loadMetrics() { const { object: ingress } = this.props; 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 2836d33f91..4d515a0056 100644 --- a/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx +++ b/src/renderer/components/+storage-volume-claims/volume-claim-details.tsx @@ -22,7 +22,7 @@ import "./volume-claim-details.scss"; import React, { Fragment } from "react"; -import { action, observable, reaction } from "mobx"; +import { makeObservable, observable, reaction } from "mobx"; import { disposeOnUnmount, observer } from "mobx-react"; import { DrawerItem, DrawerTitle } from "../drawer"; import { Badge } from "../badge"; @@ -36,6 +36,7 @@ import { getActiveClusterEntity } from "../../api/catalog-entity-registry"; import { ClusterMetricsResourceType } from "../../../common/cluster-types"; import { KubeObjectMeta } from "../kube-object-meta"; import { getDetailsUrl } from "../kube-detail-params"; +import { boundMethod } from "../../utils"; interface Props extends KubeObjectDetailsProps { } @@ -44,12 +45,17 @@ interface Props extends KubeObjectDetailsProps { export class PersistentVolumeClaimDetails extends React.Component { @observable metrics: IPvcMetrics = null; + constructor(props: Props) { + super(props); + makeObservable(this); + } + @disposeOnUnmount clean = reaction(() => this.props.object, () => { this.metrics = null; }); - @action + @boundMethod async loadMetrics() { const { object: volumeClaim } = this.props; diff --git a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx index ff116105c9..dc8581dec3 100644 --- a/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx +++ b/src/renderer/components/+workloads-statefulsets/statefulset-details.tsx @@ -83,7 +83,7 @@ export class StatefulSetDetails extends React.Component {
{!isMetricHidden && podsStore.isLoaded && ( this.loadMetrics} + loader={this.loadMetrics} tabs={podMetricTabs} object={statefulSet} params={{ metrics: this.metrics }} >