add getColtypesMapping to transformProps

apache · Apr 25, 2023 · 49302fa · 49302fa
1 parent 3c04763
commit 49302fa
Show file tree

Hide file tree

Showing 18 changed files with 94 additions and 47 deletions.
diff --git a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/WorldMap.js
@@ -168,7 +168,7 @@ function WorldMap(element, props) {
     }
   };
 
-  const handleContextMenu = async source => {
+  const handleContextMenu = source => {
     const pointerEvent = d3.event;
     pointerEvent.preventDefault();
     const key = source.id || source.country;

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts
@@ -297,5 +297,6 @@ export default function transformProps(
     selectedValues,
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/transformProps.ts
@@ -37,6 +37,7 @@ import {
 import {
   extractGroupbyLabel,
   getChartPadding,
+  getColtypesMapping,
   getLegendProps,
   sanitizeHtml,
 } from '../utils/series';
@@ -95,7 +96,7 @@ export default function transformProps(
     emitCrossFilters,
   } = chartProps;
   const data: DataRecord[] = queriesData[0].data || [];
-
+  const coltypeMapping = getColtypesMapping(queriesData[0]);
   const {
     colorScheme,
     groupby,
@@ -244,5 +245,6 @@ export default function transformProps(
     selectedValues,
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts
@@ -46,6 +46,7 @@ import {
 import { OpacityEnum } from '../constants';
 import { getDefaultTooltip } from '../utils/tooltip';
 import { Refs } from '../types';
+import { getColtypesMapping } from '../utils/series';
 
 const setIntervalBoundsAndColors = (
   intervals: string,
@@ -130,6 +131,7 @@ export default function transformProps(
   }: EchartsGaugeFormData = { ...DEFAULT_GAUGE_FORM_DATA, ...formData };
   const refs: Refs = {};
   const data = (queriesData[0]?.data || []) as DataRecord[];
+  const coltypeMapping = getColtypesMapping(queriesData[0]);
   const numberFormatter = getNumberFormatter(numberFormat);
   const colorFn = CategoricalColorNamespace.getScale(colorScheme as string);
   const axisLineWidth = calculateAxisLineWidth(data, fontSize, overlap);
@@ -341,5 +343,6 @@ export default function transformProps(
     selectedValues: filterState.selectedValues || [],
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Graph/EchartsGraph.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Graph/EchartsGraph.tsx
@@ -17,9 +17,15 @@
  * under the License.
  */
 import React from 'react';
+import {
+  getColumnLabel,
+  getNumberFormatter,
+  getTimeFormatter,
+} from '@superset-ui/core';
 import { EventHandlers } from '../types';
 import Echart from '../components/Echart';
 import { GraphChartTransformedProps } from './types';
+import { formatSeriesName } from '../utils/series';
 
 type DataRow = {
   source?: string;
@@ -46,6 +52,7 @@ export default function EchartsGraph({
   filterState,
   emitCrossFilters,
   refs,
+  coltypeMapping,
 }: GraphChartTransformedProps) {
   const getCrossFilterDataMask = (node: DataRow | undefined) => {
     if (!node?.name || !node?.col) {
@@ -143,7 +150,18 @@ export default function EchartsGraph({
           drillToDetail: drillToDetailFilters,
           crossFilter: getCrossFilterDataMask(node),
           drillBy: node && {
-            filters: [{ col: node.col, op: '==', val: node.name }],
+            filters: [
+              {
+                col: node.col,
+                op: '==',
+                val: node.name,
+                formattedVal: formatSeriesName(node.name, {
+                  timeFormatter: getTimeFormatter(node.name),
+                  numberFormatter: getNumberFormatter(node.name),
+                  coltype: coltypeMapping?.[getColumnLabel(node.col)],
+                }),
+              },
+            ],
             groupbyFieldName:
               node.col === formData.source ? 'source' : 'target',
           },

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Graph/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Graph/transformProps.ts
@@ -34,7 +34,12 @@ import {
   EchartsGraphChartProps,
 } from './types';
 import { DEFAULT_GRAPH_SERIES_OPTION } from './constants';
-import { getChartPadding, getLegendProps, sanitizeHtml } from '../utils/series';
+import {
+  getChartPadding,
+  getColtypesMapping,
+  getLegendProps,
+  sanitizeHtml,
+} from '../utils/series';
 import { getDefaultTooltip } from '../utils/tooltip';
 import { Refs } from '../types';
 
@@ -174,7 +179,7 @@ export default function transformProps(
     theme,
   } = chartProps;
   const data: DataRecord[] = queriesData[0].data || [];
-
+  const coltypeMapping = getColtypesMapping(queriesData[0]);
   const {
     source,
     target,
@@ -343,5 +348,6 @@ export default function transformProps(
     filterState,
     refs,
     emitCrossFilters,
+    coltypeMapping,
   };
 }
diff --git a/...rset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx b/...rset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx
@@ -23,12 +23,13 @@ import {
   DTTM_ALIAS,
   DataRecordValue,
   getColumnLabel,
+  getNumberFormatter,
   getTimeFormatter,
 } from '@superset-ui/core';
 import { EchartsMixedTimeseriesChartTransformedProps } from './types';
 import Echart from '../components/Echart';
 import { EventHandlers } from '../types';
-import { currentSeries } from '../utils/series';
+import { currentSeries, formatSeriesName } from '../utils/series';
 
 export default function EchartsMixedTimeseries({
   height,
@@ -47,6 +48,7 @@ export default function EchartsMixedTimeseries({
   xValueFormatter,
   xAxis,
   refs,
+  coltypeMapping,
 }: EchartsMixedTimeseriesChartTransformedProps) {
   const isFirstQuery = useCallback(
     (seriesIndex: number) => seriesIndex < seriesBreakdown,
@@ -135,8 +137,6 @@ export default function EchartsMixedTimeseries({
         const drillToDetailFilters: BinaryQueryObjectFilterClause[] = [];
         const drillByFilters: BinaryQueryObjectFilterClause[] = [];
         const isFirst = isFirstQuery(seriesIndex);
-        const timestampFormatter = (value: any) =>
-          getTimeFormatter(formData.dateFormat)(value);
         const values = [
           ...(eventParams.name ? [eventParams.name] : []),
           ...(isFirst ? labelMap : labelMapB)[eventParams.seriesName],
@@ -171,10 +171,11 @@ export default function EchartsMixedTimeseries({
               col: dimension,
               op: '==',
               val: values[i],
-              formattedVal:
-                DTTM_ALIAS === getColumnLabel(dimension)
-                  ? String(timestampFormatter(values[i]))
-                  : String(values[i]),
+              formattedVal: formatSeriesName(String(values[i]), {
+                timeFormatter: getTimeFormatter(values[i]),
+                numberFormatter: getNumberFormatter(values[i]),
+                coltype: coltypeMapping?.[getColumnLabel(dimension)],
+              }),
             }),
         );
         onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts
@@ -105,7 +105,10 @@ export default function transformProps(
   const data1 = (queriesData[0].data || []) as TimeseriesDataRecord[];
   const data2 = (queriesData[1].data || []) as TimeseriesDataRecord[];
   const annotationData = getAnnotationData(chartProps);
-
+  const coltypeMapping = {
+    ...getColtypesMapping(queriesData[0]),
+    ...getColtypesMapping(queriesData[1]),
+  };
   const {
     area,
     areaB,
@@ -523,5 +526,6 @@ export default function transformProps(
       type: xAxisType,
     },
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/transformProps.ts
@@ -345,5 +345,6 @@ export default function transformProps(
     onContextMenu,
     refs,
     emitCrossFilters,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Radar/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Radar/transformProps.ts
@@ -259,5 +259,6 @@ export default function transformProps(
     selectedValues,
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Sunburst/EchartsSunburst.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Sunburst/EchartsSunburst.tsx
@@ -20,11 +20,13 @@ import React, { useCallback } from 'react';
 import {
   BinaryQueryObjectFilterClause,
   getColumnLabel,
+  getNumberFormatter,
   getTimeFormatter,
 } from '@superset-ui/core';
 import { SunburstTransformedProps } from './types';
 import Echart from '../components/Echart';
 import { EventHandlers, TreePathInfo } from '../types';
+import { formatSeriesName } from '../utils/series';
 
 export const extractTreePathInfo = (treePathInfo: TreePathInfo[] | undefined) =>
   (treePathInfo ?? [])
@@ -43,6 +45,7 @@ export default function EchartsSunburst(props: SunburstTransformedProps) {
     onContextMenu,
     refs,
     emitCrossFilters,
+    coltypeMapping,
   } = props;
   const { columns } = formData;
 
@@ -115,8 +118,6 @@ export default function EchartsSunburst(props: SunburstTransformedProps) {
         const pointerEvent = eventParams.event.event;
         const drillToDetailFilters: BinaryQueryObjectFilterClause[] = [];
         const drillByFilters: BinaryQueryObjectFilterClause[] = [];
-        const timestampFormatter = (value: any) =>
-          getTimeFormatter(formData.dateFormat)(value);
         if (columns?.length) {
           treePath.forEach((path, i) =>
             drillToDetailFilters.push({
@@ -131,11 +132,12 @@ export default function EchartsSunburst(props: SunburstTransformedProps) {
             col: columns[treePath.length - 1],
             op: '==',
             val,
-            formattedVal:
-              getColumnLabel(columns[treePath.length - 1]) ===
-              formData.granularitySqla
-                ? String(timestampFormatter(val))
-                : String(val),
+            formattedVal: formatSeriesName(String(val), {
+              timeFormatter: getTimeFormatter(val),
+              numberFormatter: getNumberFormatter(val),
+              coltype:
+                coltypeMapping?.[getColumnLabel(columns[treePath.length - 1])],
+            }),
           });
         }
         onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Sunburst/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Sunburst/transformProps.ts
@@ -377,5 +377,6 @@ export default function transformProps(
     selectedValues: filterState.selectedValues || [],
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx
@@ -23,14 +23,15 @@ import {
   AxisType,
   getTimeFormatter,
   getColumnLabel,
+  getNumberFormatter,
 } from '@superset-ui/core';
 import { ViewRootGroup } from 'echarts/types/src/util/types';
 import GlobalModel from 'echarts/types/src/model/Global';
 import ComponentModel from 'echarts/types/src/model/Component';
 import { EchartsHandler, EventHandlers } from '../types';
 import Echart from '../components/Echart';
 import { TimeseriesChartTransformedProps } from './types';
-import { currentSeries } from '../utils/series';
+import { currentSeries, formatSeriesName } from '../utils/series';
 import { ExtraControls } from '../components/ExtraControls';
 
 const TIMER_DURATION = 300;
@@ -52,6 +53,7 @@ export default function EchartsTimeseries({
   xAxis,
   refs,
   emitCrossFilters,
+  coltypeMapping,
 }: TimeseriesChartTransformedProps) {
   const { stack } = formData;
   const echartRef = useRef<EchartsHandler | null>(null);
@@ -205,8 +207,6 @@ export default function EchartsTimeseries({
         const drillToDetailFilters: BinaryQueryObjectFilterClause[] = [];
         const drillByFilters: BinaryQueryObjectFilterClause[] = [];
         const pointerEvent = eventParams.event.event;
-        const timestampFormatter = (value: any) =>
-          getTimeFormatter(formData.granularitySqla)(value);
         const values = [
           ...(eventParams.name ? [eventParams.name] : []),
           ...labelMap[seriesName],
@@ -241,10 +241,11 @@ export default function EchartsTimeseries({
             col: dimension,
             op: '==',
             val,
-            formattedVal:
-              DTTM_ALIAS === getColumnLabel(dimension)
-                ? String(timestampFormatter(val))
-                : String(val),
+            formattedVal: formatSeriesName(String(values[i]), {
+              timeFormatter: getTimeFormatter(values[i]),
+              numberFormatter: getNumberFormatter(values[i]),
+              coltype: coltypeMapping?.[getColumnLabel(dimension)],
+            }),
           });
         });
 

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
@@ -533,5 +533,6 @@ export default function transformProps(
       type: xAxisType,
     },
     refs,
+    coltypeMapping: dataTypes,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/EchartsTreemap.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/EchartsTreemap.tsx
@@ -21,13 +21,15 @@ import {
   BinaryQueryObjectFilterClause,
   getTimeFormatter,
   getColumnLabel,
+  getNumberFormatter,
 } from '@superset-ui/core';
 import React, { useCallback } from 'react';
 import Echart from '../components/Echart';
 import { NULL_STRING } from '../constants';
 import { EventHandlers } from '../types';
 import { extractTreePathInfo } from './constants';
 import { TreemapTransformedProps } from './types';
+import { formatSeriesName } from '../utils/series';
 
 export default function EchartsTreemap({
   echartOptions,
@@ -41,6 +43,7 @@ export default function EchartsTreemap({
   selectedValues,
   width,
   formData,
+  coltypeMapping,
 }: TreemapTransformedProps) {
   const getCrossFilterDataMask = useCallback(
     (data, treePathInfo) => {
@@ -116,8 +119,6 @@ export default function EchartsTreemap({
         eventParams.event.stop();
         const { data, treePathInfo } = eventParams;
         const { treePath } = extractTreePathInfo(treePathInfo);
-        const timestampFormatter = (value: any) =>
-          getTimeFormatter(formData.dateFormat)(value);
         if (treePath.length > 0) {
           const pointerEvent = eventParams.event.event;
           const drillToDetailFilters: BinaryQueryObjectFilterClause[] = [];
@@ -134,10 +135,11 @@ export default function EchartsTreemap({
               col: groupby[i],
               op: '==',
               val,
-              formattedVal:
-                getColumnLabel(groupby[i]) === formData.granularitySqla
-                  ? String(timestampFormatter(val))
-                  : String(val),
+              formattedVal: formatSeriesName(String(val), {
+                timeFormatter: getTimeFormatter(val),
+                numberFormatter: getNumberFormatter(val),
+                coltype: coltypeMapping?.[getColumnLabel(groupby[i])],
+              }),
             });
           });
           onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/transformProps.ts
@@ -294,5 +294,6 @@ export default function transformProps(
     selectedValues: filterState.selectedValues || [],
     onContextMenu,
     refs,
+    coltypeMapping,
   };
 }
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/types.ts
@@ -131,6 +131,7 @@ export interface BaseTransformedProps<F> {
   refs: Refs;
   width: number;
   emitCrossFilters?: boolean;
+  coltypeMapping?: Record<string, number>;
 }
 
 export type CrossFilterTransformedProps = {
-Original file line number
+Diff line change
@@ Expand Up / @@ -533,5 +533,6 @@ export default function transformProps( @@
           type: xAxisType,
         },
         refs,
+        coltypeMapping: dataTypes,
       };
     }