You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by mi...@apache.org on 2022/08/22 16:52:57 UTC
[superset] branch master updated: fix: Drill to detail on values with comma (#21151)
This is an automated email from the ASF dual-hosted git repository.
michaelsmolina pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 0bf4e56dc3 fix: Drill to detail on values with comma (#21151)
0bf4e56dc3 is described below
commit 0bf4e56dc3e129d2b9239f055212249ba95521e4
Author: Michael S. Molina <70...@users.noreply.github.com>
AuthorDate: Mon Aug 22 13:52:39 2022 -0300
fix: Drill to detail on values with comma (#21151)
---
.../superset-ui-core/src/query/types/Query.ts | 4 +-
.../src/query/types/QueryResponse.ts | 1 +
.../src/Gauge/EchartsGauge.tsx | 48 ++++++----------------
.../src/MixedTimeseries/EchartsMixedTimeseries.tsx | 4 +-
.../src/MixedTimeseries/transformProps.ts | 21 +++-------
.../src/Timeseries/EchartsTimeseries.tsx | 4 +-
.../src/Timeseries/transformProps.ts | 17 ++------
.../src/utils/eventHandlers.ts | 11 ++---
8 files changed, 34 insertions(+), 76 deletions(-)
diff --git a/superset-frontend/packages/superset-ui-core/src/query/types/Query.ts b/superset-frontend/packages/superset-ui-core/src/query/types/Query.ts
index ec600da862..a3cfa88618 100644
--- a/superset-frontend/packages/superset-ui-core/src/query/types/Query.ts
+++ b/superset-frontend/packages/superset-ui-core/src/query/types/Query.ts
@@ -39,12 +39,12 @@ export type QueryObjectFilterClause = {
} & (
| {
op: BinaryOperator;
- val: string | number | boolean;
+ val: string | number | boolean | null | Date;
formattedVal?: string;
}
| {
op: SetOperator;
- val: (string | number | boolean)[];
+ val: (string | number | boolean | null | Date)[];
formattedVal?: string[];
}
| {
diff --git a/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts b/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts
index 74d33f6e94..0ae58202c1 100644
--- a/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts
+++ b/superset-frontend/packages/superset-ui-core/src/query/types/QueryResponse.ts
@@ -83,6 +83,7 @@ export interface ChartDataResponseResult {
export interface TimeseriesChartDataResponseResult
extends ChartDataResponseResult {
data: TimeseriesDataRecord[];
+ label_map: Record<string, DataRecordValue[]>;
}
/**
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/EchartsGauge.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/EchartsGauge.tsx
index ef81b6ece6..118783b47e 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/EchartsGauge.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/EchartsGauge.tsx
@@ -17,22 +17,21 @@
* under the License.
*/
import React, { useCallback } from 'react';
-import { QueryObjectFilterClause } from '@superset-ui/core';
import { GaugeChartTransformedProps } from './types';
import Echart from '../components/Echart';
-import { Event, clickEventHandler } from '../utils/eventHandlers';
+import { allEventHandlers } from '../utils/eventHandlers';
-export default function EchartsGauge({
- height,
- width,
- echartOptions,
- setDataMask,
- labelMap,
- groupby,
- selectedValues,
- formData: { emitFilter },
- onContextMenu,
-}: GaugeChartTransformedProps) {
+export default function EchartsGauge(props: GaugeChartTransformedProps) {
+ const {
+ height,
+ width,
+ echartOptions,
+ setDataMask,
+ labelMap,
+ groupby,
+ selectedValues,
+ formData: { emitFilter },
+ } = props;
const handleChange = useCallback(
(values: string[]) => {
if (!emitFilter) {
@@ -69,28 +68,7 @@ export default function EchartsGauge({
[groupby, labelMap, setDataMask, selectedValues],
);
- const eventHandlers = {
- click: clickEventHandler(selectedValues, handleChange),
- contextmenu: (e: Event) => {
- if (onContextMenu) {
- e.event.stop();
- const pointerEvent = e.event.event;
- const filters: QueryObjectFilterClause[] = [];
- if (groupby.length > 0) {
- const values = e.name.split(',');
- groupby.forEach((dimension, i) =>
- filters.push({
- col: dimension,
- op: '==',
- val: values[i].split(': ')[1],
- formattedVal: values[i].split(': ')[1],
- }),
- );
- }
- onContextMenu(filters, pointerEvent.offsetX, pointerEvent.offsetY);
- }
- },
- };
+ const eventHandlers = allEventHandlers(props, handleChange);
return (
<Echart
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx
index f11729f76c..0a3834681c 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx
@@ -116,7 +116,7 @@ export default function EchartsMixedTimeseries({
const { data, seriesIndex } = eventParams;
if (data) {
const pointerEvent = eventParams.event.event;
- const values = eventParams.seriesName.split(',');
+ const values = labelMap[eventParams.seriesName];
const { queryIndex } = (echartOptions.series as any)[seriesIndex];
const groupby = queryIndex > 0 ? formData.groupbyB : formData.groupby;
const filters: QueryObjectFilterClause[] = [];
@@ -132,7 +132,7 @@ export default function EchartsMixedTimeseries({
col: dimension,
op: '==',
val: values[i],
- formattedVal: values[i],
+ formattedVal: String(values[i]),
}),
);
onContextMenu(filters, pointerEvent.offsetX, pointerEvent.offsetY);
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts
index 7b8448e306..fc4f1f82df 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/transformProps.ts
@@ -20,7 +20,6 @@
import {
AnnotationLayer,
CategoricalColorNamespace,
- DataRecordValue,
DTTM_ALIAS,
GenericDataType,
getColumnLabel,
@@ -29,6 +28,7 @@ import {
isFormulaAnnotationLayer,
isIntervalAnnotationLayer,
isTimeseriesAnnotationLayer,
+ TimeseriesChartDataResponseResult,
TimeseriesDataRecord,
} from '@superset-ui/core';
import { EChartsCoreOption, SeriesOption } from 'echarts';
@@ -90,6 +90,10 @@ export default function transformProps(
inContextMenu,
} = chartProps;
const { verboseMap = {} } = datasource;
+ const { label_map: labelMap } =
+ queriesData[0] as TimeseriesChartDataResponseResult;
+ const { label_map: labelMapB } =
+ queriesData[1] as TimeseriesChartDataResponseResult;
const data1 = (queriesData[0].data || []) as TimeseriesDataRecord[];
const data2 = (queriesData[1].data || []) as TimeseriesDataRecord[];
const annotationData = getAnnotationData(chartProps);
@@ -352,21 +356,6 @@ export default function transformProps(
convertInteger(yAxisTitleMargin),
convertInteger(xAxisTitleMargin),
);
- const labelMap = rawSeriesA.reduce((acc, datum) => {
- const label = datum.name as string;
- return {
- ...acc,
- [label]: label.split(', '),
- };
- }, {}) as Record<string, DataRecordValue[]>;
-
- const labelMapB = rawSeriesB.reduce((acc, datum) => {
- const label = datum.name as string;
- return {
- ...acc,
- [label]: label.split(', '),
- };
- }, {}) as Record<string, DataRecordValue[]>;
const { setDataMask = () => {}, onContextMenu } = hooks;
const alignTicks = yAxisIndex !== yAxisIndexB;
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx
index 3ac7ed464c..5779ef697d 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx
@@ -182,7 +182,7 @@ export default function EchartsTimeseries({
const { data } = eventParams;
if (data) {
const pointerEvent = eventParams.event.event;
- const values = eventParams.seriesName.split(',');
+ const values = labelMap[eventParams.seriesName];
const filters: QueryObjectFilterClause[] = [];
filters.push({
col: formData.granularitySqla,
@@ -196,7 +196,7 @@ export default function EchartsTimeseries({
col: dimension,
op: '==',
val: values[i],
- formattedVal: values[i],
+ formattedVal: String(values[i]),
}),
);
onContextMenu(filters, pointerEvent.offsetX, pointerEvent.offsetY);
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
index 39361abdd7..5a90818e9c 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
@@ -20,7 +20,6 @@
import {
AnnotationLayer,
CategoricalColorNamespace,
- DataRecordValue,
DTTM_ALIAS,
GenericDataType,
getColumnLabel,
@@ -101,7 +100,8 @@ export default function transformProps(
} = chartProps;
const { verboseMap = {} } = datasource;
const [queryData] = queriesData;
- const { data = [] } = queryData as TimeseriesChartDataResponseResult;
+ const { data = [], label_map: labelMap } =
+ queryData as TimeseriesChartDataResponseResult;
const dataTypes = getColtypesMapping(queryData);
const annotationData = getAnnotationData(chartProps);
@@ -291,20 +291,9 @@ export default function transformProps(
? getXAxisFormatter(xAxisTimeFormat)
: String;
- const labelMap = series.reduce(
- (acc: Record<string, DataRecordValue[]>, datum) => {
- const name: string = datum.name as string;
- return {
- ...acc,
- [name]: [name],
- };
- },
- {},
- );
-
const {
setDataMask = () => {},
- setControlValue = (...args: unknown[]) => {},
+ setControlValue = () => {},
onContextMenu,
} = hooks;
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts b/superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts
index 002596e3ea..e40e77b4b8 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts
@@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { QueryObjectFilterClause } from '@superset-ui/core';
+import { DataRecordValue, QueryObjectFilterClause } from '@superset-ui/core';
import { EChartTransformedProps, EventHandlers } from '../types';
export type Event = {
@@ -42,6 +42,7 @@ export const contextMenuEventHandler =
(
groupby: EChartTransformedProps<any>['groupby'],
onContextMenu: EChartTransformedProps<any>['onContextMenu'],
+ labelMap: Record<string, DataRecordValue[]>,
) =>
(e: Event) => {
if (onContextMenu) {
@@ -49,13 +50,13 @@ export const contextMenuEventHandler =
const pointerEvent = e.event.event;
const filters: QueryObjectFilterClause[] = [];
if (groupby.length > 0) {
- const values = e.name.split(',');
+ const values = labelMap[e.name];
groupby.forEach((dimension, i) =>
filters.push({
col: dimension,
op: '==',
val: values[i],
- formattedVal: values[i],
+ formattedVal: String(values[i]),
}),
);
}
@@ -67,10 +68,10 @@ export const allEventHandlers = (
transformedProps: EChartTransformedProps<any>,
handleChange: (values: string[]) => void,
) => {
- const { groupby, selectedValues, onContextMenu } = transformedProps;
+ const { groupby, selectedValues, onContextMenu, labelMap } = transformedProps;
const eventHandlers: EventHandlers = {
click: clickEventHandler(selectedValues, handleChange),
- contextmenu: contextMenuEventHandler(groupby, onContextMenu),
+ contextmenu: contextMenuEventHandler(groupby, onContextMenu, labelMap),
};
return eventHandlers;
};