feat(generic-x-axis): add x sorting on series limit metric (#23274)

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts

@@ -19,21 +19,25 @@
 /* eslint-disable camelcase */
 import {
   AnnotationLayer,
+  AxisType,
   CategoricalColorNamespace,
   GenericDataType,
+  getMetricLabel,
   getNumberFormatter,
+  getXAxisLabel,
+  isDefined,
   isEventAnnotationLayer,
   isFormulaAnnotationLayer,
   isIntervalAnnotationLayer,
-  isTimeseriesAnnotationLayer,
-  TimeseriesChartDataResponseResult,
-  t,
-  AxisType,
-  getXAxisLabel,
   isPhysicalColumn,
-  isDefined,
+  isTimeseriesAnnotationLayer,
+  t,
+  TimeseriesChartDataResponseResult,
 } from '@superset-ui/core';
-import { isDerivedSeries } from '@superset-ui/chart-controls';
+import {
+  extractExtraMetrics,
+  isDerivedSeries,
+} from '@superset-ui/chart-controls';
 import { EChartsCoreOption, SeriesOption } from 'echarts';
 import { ZRLineType } from 'echarts/types/src/util/types';
 import {
@@ -114,39 +118,39 @@ export default function transformProps(
     colorScheme,
     contributionMode,
     forecastEnabled,
+    groupby,
     legendOrientation,
     legendType,
     legendMargin,
     logAxis,
     markerEnabled,
     markerSize,
-    opacity,
     minorSplitLine,
+    onlyTotal,
+    opacity,
+    orientation,
+    percentageThreshold,
+    richTooltip,
     seriesType,
     showLegend,
-    stack,
-    truncateYAxis,
-    yAxisFormat,
-    xAxisTimeFormat,
-    yAxisBounds,
-    tooltipTimeFormat,
-    tooltipSortByMetric,
-    zoomable,
-    richTooltip,
-    xAxis: xAxisOrig,
-    xAxisLabelRotation,
-    groupby,
     showValue,
-    onlyTotal,
-    percentageThreshold,
-    xAxisTitle,
-    yAxisTitle,
-    xAxisTitleMargin,
-    yAxisTitleMargin,
-    yAxisTitlePosition,
     sliceId,
     timeGrainSqla,
-    orientation,
+    stack,
+    tooltipTimeFormat,
+    tooltipSortByMetric,
+    truncateYAxis,
+    xAxis: xAxisOrig,
+    xAxisLabelRotation,
+    xAxisTimeFormat,
+    xAxisTitle,
+    xAxisTitleMargin,
+    yAxisBounds,
+    yAxisFormat,
+    yAxisTitle,
+    yAxisTitleMargin,
+    yAxisTitlePosition,
+    zoomable,
   }: EchartsTimeseriesFormData = { ...DEFAULT_FORM_DATA, ...formData };
   const refs: Refs = {};
 
@@ -168,9 +172,14 @@ export default function transformProps(
       xAxisCol: xAxisLabel,
     },
   );
+  const extraMetricLabels = extractExtraMetrics(chartProps.rawFormData).map(
+    getMetricLabel,
+  );
+
   const rawSeries = extractSeries(rebasedData, {
     fillNeighborValue: stack && !forecastEnabled ? 0 : undefined,
     xAxis: xAxisLabel,
+    extraMetricLabels,
     removeNulls: seriesType === EchartsTimeseriesSeriesType.Scatter,
     stack,
     totalStackedValues,