Handle invalid metric response properly (#464)

* catch undefined and return default empty in normalizeMetrics

* fix crash on drilldown

Signed-off-by: Sebastian Malton <smalton@mirantis.com>

Co-authored-by: Sebastian Malton <smalton@mirantis.com>

dashboard/client/api/endpoints/metrics.api.ts

@@ -56,7 +56,21 @@ export const metricsApi = {
 };
 
 export function normalizeMetrics(metrics: IMetrics, frames = 60): IMetrics {
+  if (!metrics?.data?.result) {
+    return {
+      data: {
+        resultType: "",
+        result: [{
+          metric: {},
+          values: []
+        } as IMetricsResult],
+      },
+      status: "",
+    }
+  }
+
   const { result } = metrics.data;
+
   if (result.length) {
     if (frames > 0) {
       // fill the gaps
@@ -80,13 +94,16 @@ export function normalizeMetrics(metrics: IMetrics, frames = 60): IMetrics {
 }
 
 export function isMetricsEmpty(metrics: { [key: string]: IMetrics }) {
-  return Object.values(metrics).every(metric => !metric.data.result.length);
+  return Object.values(metrics).every(metric => !metric?.data?.result?.length);
 }
 
-export function getItemMetrics(metrics: { [key: string]: IMetrics }, itemName: string) {
+export function getItemMetrics(metrics: { [key: string]: IMetrics }, itemName: string): { [key: string]: IMetrics } {
   if (!metrics) return;
   const itemMetrics = { ...metrics };
   for (const metric in metrics) {
+    if (!metrics[metric]?.data?.result) {
+      continue
+    }
     const results = metrics[metric].data.result;
     const result = results.find(res => Object.values(res.metric)[0] == itemName);
     itemMetrics[metric].data.result = result ? [result] : [];

dashboard/client/components/+cluster/cluster.store.ts

@@ -82,15 +82,15 @@ export class ClusterStore extends KubeObjectStore<Cluster> {
     this.liveMetrics = await this.loadMetrics({ start, end, step, range });
   }
 
-  getMetricsValues(source: Partial<IClusterMetrics>) {
+  getMetricsValues(source: Partial<IClusterMetrics>): [number, string][] {
-    const metrics =
+    switch (this.metricType) {
-      this.metricType === MetricType.CPU ? source.cpuUsage :
+    case MetricType.CPU:
-        this.metricType === MetricType.MEMORY ? source.memoryUsage
+      return normalizeMetrics(source.cpuUsage).data.result[0].values
-          : null;
+    case MetricType.MEMORY:
-    if (!metrics) {
+      return normalizeMetrics(source.memoryUsage).data.result[0].values
+    default:
       return [];
     }
-    return normalizeMetrics(metrics).data.result[0].values;
   }
 
   resetMetrics() {

dashboard/client/components/+network-ingresses/ingress-charts.tsx

@@ -18,9 +18,9 @@ export const IngressCharts = observer(() => {
   if (!metrics) return null;
   if (isMetricsEmpty(metrics)) return <NoMetrics/>;
 
-  const values = Object.values(metrics).map(metric =>
+  const values = Object.values(metrics)
-    normalizeMetrics(metric).data.result[0].values
+    .map(normalizeMetrics)
-  );
+    .map(({ data }) => data.result[0].values);
   const [
     bytesSentSuccess,
     bytesSentFailure,

dashboard/client/components/+workloads-pods/container-charts.tsx

@@ -17,9 +17,9 @@ export const ContainerCharts = () => {
   if (!metrics) return null;
   if (isMetricsEmpty(metrics)) return <NoMetrics/>;
 
-  const values = Object.values(metrics).map(metric =>
+  const values = Object.values(metrics)
-    normalizeMetrics(metric).data.result[0].values
+    .map(normalizeMetrics)
-  );
+    .map(({ data }) => data.result[0].values);
   const [
     cpuUsage,
     cpuRequests,

dashboard/client/components/+workloads-pods/pod-charts.tsx

@@ -28,9 +28,9 @@ export const PodCharts = observer(() => {
   if (isMetricsEmpty(metrics)) return <NoMetrics/>;
 
   const options = tabId == 0 ? cpuOptions : memoryOptions;
-  const values = Object.values(metrics).map(metric =>
+  const values = Object.values(metrics)
-    normalizeMetrics(metric).data.result[0].values
+    .map(normalizeMetrics)
-  );
+    .map(({ data }) => data.result[0].values);
   const [
     cpuUsage,
     cpuRequests,