changes after rebase

Signed-off-by: Abhay Pandey <[email protected]>
abhaypersistent · Sep 27, 2022 · d83cf27 · d83cf27
1 parent 2a7822f
commit d83cf27
Show file tree

Hide file tree

Showing 2 changed files with 88 additions and 83 deletions.
diff --git a/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx b/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx
@@ -925,7 +925,6 @@ export const Explorer = ({
 
       if (selectedContentTabId === TAB_CHART_ID) {
         // parse stats section on every search
-        const qm = new QueryManager();
         const statsTokens = qm.queryParser().parse(tempQuery).getStats();
 
         const updatedDataConfig = getUpdatedDataConfig(statsTokens);

diff --git a/dashboards-observability/public/components/visualizations/charts/financial/gauge/gauge.tsx b/dashboards-observability/public/components/visualizations/charts/financial/gauge/gauge.tsx
@@ -64,7 +64,7 @@ export const Gauge = ({ visualizations, layout, config }: any) => {
     xaxes = [timestampField, ...xaxes];
   }
 
-  const dimensionsLength = xaxes.length;
+  const xaxesLength = xaxes.length;
 
   const getAggValue = (metric: any) => {
     return metric.alias ? metric.alias : metric.aggregation + '' + '(' + metric.name + ')';
@@ -74,93 +74,99 @@ export const Gauge = ({ visualizations, layout, config }: any) => {
 
   const gaugeData: Plotly.Data[] = useMemo(() => {
     let calculatedGaugeData: Plotly.Data[] = [];
-    if (dimensionsLength || seriesLength) {
-      // case 1 and 2 is removed because dimension is not blank in any case.
-      // case 3: multiple dimensions and multiple metrics
-
-      if (dimensionsLength && seriesLength) {
-        const selectedDimensionsData = xaxes
-          .map((dimension: any) => {
-            return queriedVizData[dimension.name]
-              ? queriedVizData[dimension.name].slice(0, numberOfGauges)
-              : [];
-          })
-          .reduce((prev, cur) => {
-            return prev.map((i, j) => `${i}, ${cur[j]}`);
-          });
-        const selectedSeriesData = series.map((seriesItem: any) => {
-          const val = getAggValue(seriesItem);
-          return queriedVizData[`${val}`] ? queriedVizData[`${val}`].slice(0, numberOfGauges) : [];
-        });
+    // case 1,2: no dimension, single/multiple metrics
+    if (!xaxesLength && seriesLength >= 1) {
+      calculatedGaugeData = series.map((seriesItem: any) => {
+        return {
+          field_name: getAggValue(seriesItem),
+          value: queriedVizData[getAggValue(seriesItem)][0],
+        };
+      });
+    }
 
-        selectedSeriesData.map((seriesSlice: any, seriesSliceIndex: number) => {
-          calculatedGaugeData = [
-            ...calculatedGaugeData,
-            ...seriesSlice.map((seriesSliceData: any, seriesSliceDataIndex: number) => {
-              return {
-                field_name: `${selectedDimensionsData[seriesSliceDataIndex]}, ${getAggValue(
-                  series[seriesSliceData]
-                )}`,
-                value: seriesSliceData,
-              };
-            }),
-          ];
+    // case 3: multiple dimensions and multiple metrics
+
+    if (xaxesLength && seriesLength) {
+      const selectedDimensionsData = xaxes
+        .map((dimension: any) => {
+          return queriedVizData[dimension.name]
+            ? queriedVizData[dimension.name].slice(0, numberOfGauges)
+            : [];
+        })
+        .reduce((prev, cur) => {
+          return prev.map((i, j) => `${i}, ${cur[j]}`);
         });
-      }
+      const selectedSeriesData = series.map((seriesItem: any) => {
+        const val = getAggValue(seriesItem);
+        return queriedVizData[`${val}`] ? queriedVizData[`${val}`].slice(0, numberOfGauges) : [];
+      });
 
-      return calculatedGaugeData.map((gauge, index) => {
-        return {
-          type: 'indicator',
-          mode: 'gauge+number+delta',
-          value: gauge.value || 0,
-          title: {
-            text: gauge.field_name,
-            font: { size: titleSize },
-            align: legendPlacement,
-          },
-          ...(valueSize && {
-            number: {
-              font: {
-                size: valueSize,
-              },
-            },
+      selectedSeriesData.map((seriesSlice: any, seriesSliceIndex: number) => {
+        calculatedGaugeData = [
+          ...calculatedGaugeData,
+          ...seriesSlice.map((seriesSliceData: any, seriesSliceDataIndex: number) => {
+            return {
+              field_name: `${selectedDimensionsData[seriesSliceDataIndex]}, ${getAggValue(
+                series[seriesSliceIndex]
+              )}`,
+              value: seriesSliceData,
+            };
           }),
-          domain: {
-            ...(orientation === 'auto' || orientation === 'h'
-              ? {
-                  row: Math.floor(index / PLOTLY_GAUGE_COLUMN_NUMBER),
-                  column: index % PLOTLY_GAUGE_COLUMN_NUMBER,
-                }
-              : {
-                  column: Math.floor(index / PLOTLY_GAUGE_COLUMN_NUMBER),
-                  row: index % PLOTLY_GAUGE_COLUMN_NUMBER,
-                }),
-          },
-          gauge: {
-            ...(showThresholdMarkers &&
-              thresholds &&
-              thresholds.length && {
-                threshold: {
-                  line: { color: thresholds[0]?.color || 'red', width: 4 },
-                  thickness: 0.75,
-                  value: thresholds[0]?.value || 0,
-                },
-              }),
-            // threshold labels
-            ...(showThresholdLabels && thresholds && thresholds.length
-              ? {
-                  axis: {
-                    ticktext: [gauge.value, ...thresholds.map((t: ThresholdUnitType) => t.name)],
-                    tickvals: [gauge.value, ...thresholds.map((t: ThresholdUnitType) => t.value)],
-                    ticklen: TickLength,
-                  },
-                }
-              : {}),
-          },
-        };
+        ];
       });
     }
-    return calculatedGaugeData;
+
+    return calculatedGaugeData.map((gauge, index) => {
+      return {
+        type: 'indicator',
+        mode: 'gauge+number+delta',
+        value: gauge.value || 0,
+        title: {
+          text: gauge.field_name,
+          font: { size: titleSize },
+          align: legendPlacement,
+        },
+        ...(valueSize && {
+          number: {
+            font: {
+              size: valueSize,
+            },
+          },
+        }),
+        domain: {
+          ...(orientation === 'auto' || orientation === 'h'
+            ? {
+                row: Math.floor(index / PLOTLY_GAUGE_COLUMN_NUMBER),
+                column: index % PLOTLY_GAUGE_COLUMN_NUMBER,
+              }
+            : {
+                column: Math.floor(index / PLOTLY_GAUGE_COLUMN_NUMBER),
+                row: index % PLOTLY_GAUGE_COLUMN_NUMBER,
+              }),
+        },
+        gauge: {
+          ...(showThresholdMarkers &&
+            thresholds &&
+            thresholds.length && {
+              threshold: {
+                line: { color: thresholds[0]?.color || 'red', width: 4 },
+                thickness: 0.75,
+                value: thresholds[0]?.value || 0,
+              },
+            }),
+          // threshold labels
+          ...(showThresholdLabels && thresholds && thresholds.length
+            ? {
+                axis: {
+                  ticktext: [gauge.value, ...thresholds.map((t: ThresholdUnitType) => t.name)],
+                  tickvals: [gauge.value, ...thresholds.map((t: ThresholdUnitType) => t.value)],
+                  ticklen: TickLength,
+                },
+              }
+            : {}),
+        },
+      };
+    });
   }, [
     xaxes,
     series,