fix: Incorrect hovered items in tooltips (apache#30405)

preset-io · Sep 26, 2024 · 36f7a3f · 36f7a3f
1 parent 0fdcd8b
commit 36f7a3f
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 11 deletions.
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts
@@ -593,6 +593,7 @@ export default function transformProps(
           extractForecastValuesFromTooltipParams(forecastValue);
 
         const keys = Object.keys(forecastValues);
+        let focusedRow;
         keys.forEach(key => {
           const value = forecastValues[key];
           // if there are no dimensions, key is a verbose name of a metric,
@@ -627,12 +628,11 @@ export default function transformProps(
               : tooltipFormatterSecondary,
           });
           rows.push(row);
+          if (key === focusedSeries) {
+            focusedRow = rows.length - 1;
+          }
         });
-        return tooltipHtml(
-          rows,
-          tooltipFormatter(xValue),
-          keys.findIndex(key => key === focusedSeries),
-        );
+        return tooltipHtml(rows, tooltipFormatter(xValue), focusedRow);
       },
     },
     legend: {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
@@ -569,6 +569,7 @@ export default function transformProps(
         const showTotal = Boolean(isMultiSeries) && richTooltip && !isForecast;
         const showPercentage = showTotal && !forcePercentFormatter;
         const keys = Object.keys(forecastValues);
+        let focusedRow;
         keys.forEach(key => {
           const value = forecastValues[key];
           if (value.observation === 0 && stack) {
@@ -583,10 +584,15 @@ export default function transformProps(
             row.push(percentFormatter.format(value.observation / (total || 1)));
           }
           rows.push(row);
+          if (key === focusedSeries) {
+            focusedRow = rows.length - 1;
+          }
         });
         if (stack) {
-          keys.reverse();
           rows.reverse();
+          if (focusedRow) {
+            focusedRow = rows.length - focusedRow - 1;
+          }
         }
         if (showTotal) {
           const totalRow = ['Total', formatter.format(total)];
@@ -595,11 +601,7 @@ export default function transformProps(
           }
           rows.push(totalRow);
         }
-        return tooltipHtml(
-          rows,
-          tooltipFormatter(xValue),
-          keys.findIndex(key => key === focusedSeries),
-        );
+        return tooltipHtml(rows, tooltipFormatter(xValue), focusedRow);
       },
     },
     legend: {