chore: move xaxis to superset-ui (#20438)

apache · Jun 20, 2022 · 111affd · 111affd
1 parent 60eb109
commit 111affd
Show file tree

Hide file tree

Showing 32 changed files with 191 additions and 173 deletions.
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/index.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/index.tsx
@@ -67,6 +67,8 @@ import {
   ExtraControlProps,
   SelectControlConfig,
   Dataset,
+  ControlState,
+  ControlPanelState,
 } from '../types';
 import { ColumnOption } from '../components/ColumnOption';
 
@@ -544,6 +546,30 @@ const enableExploreDnd = isFeatureEnabled(
   FeatureFlag.ENABLE_EXPLORE_DRAG_AND_DROP,
 );
 
+const x_axis: SharedControlConfig = {
+  ...(enableExploreDnd ? dndGroupByControl : groupByControl),
+  label: t('X-axis'),
+  default: (
+    control: ControlState,
+    controlPanel: Partial<ControlPanelState>,
+  ) => {
+    // default to the chosen time column if x-axis is unset and the
+    // GENERIC_CHART_AXES feature flag is enabled
+    const { value } = control;
+    if (value) {
+      return value;
+    }
+    const timeColumn = controlPanel?.form_data?.granularity_sqla;
+    if (isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) && timeColumn) {
+      return timeColumn;
+    }
+    return null;
+  },
+  multi: false,
+  description: t('Dimension to use on x-axis.'),
+  validators: [validateNonEmpty],
+};
+
 const sharedControls = {
   metrics: enableExploreDnd ? dnd_adhoc_metrics : metrics,
   metric: enableExploreDnd ? dnd_adhoc_metric : metric,
@@ -579,6 +605,7 @@ const sharedControls = {
   series_limit_metric: enableExploreDnd ? dnd_sort_by : sort_by,
   legacy_order_by: enableExploreDnd ? dnd_sort_by : sort_by,
   truncate_metric,
+  x_axis,
 };
 
 export { sharedControls, dndEntity, dndColumnsControl };
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/types.ts
@@ -25,7 +25,8 @@ import {
   SetDataMaskHook,
 } from '@superset-ui/core';
 import { EChartsCoreOption } from 'echarts';
-import { EchartsTitleFormData, DEFAULT_TITLE_FORM_DATA } from '../types';
+import { EchartsTitleFormData } from '../types';
+import { DEFAULT_TITLE_FORM_DATA } from '../constants';
 
 export type BoxPlotQueryFormData = QueryFormData & {
   numberFormat?: string;

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/transformProps.ts
@@ -35,15 +35,14 @@ import {
   EchartsFunnelLabelTypeType,
   FunnelChartTransformedProps,
 } from './types';
-import { DEFAULT_LEGEND_FORM_DATA } from '../types';
 import {
   extractGroupbyLabel,
   getChartPadding,
   getLegendProps,
   sanitizeHtml,
 } from '../utils/series';
 import { defaultGrid, defaultTooltip } from '../defaults';
-import { OpacityEnum } from '../constants';
+import { OpacityEnum, DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 const percentFormatter = getNumberFormatter(NumberFormats.PERCENT_2_POINT);
 

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/types.ts
@@ -25,12 +25,8 @@ import {
   QueryFormData,
   SetDataMaskHook,
 } from '@superset-ui/core';
-import {
-  DEFAULT_LEGEND_FORM_DATA,
-  EchartsLegendFormData,
-  LegendOrientation,
-  LegendType,
-} from '../types';
+import { EchartsLegendFormData, LegendOrientation, LegendType } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 export type EchartsFunnelFormData = QueryFormData &
   EchartsLegendFormData & {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Gauge/types.ts
@@ -22,7 +22,8 @@ import {
   QueryFormColumn,
   QueryFormData,
 } from '@superset-ui/core';
-import { DEFAULT_LEGEND_FORM_DATA, EChartTransformedProps } from '../types';
+import { EChartTransformedProps } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 export type AxisTickLineStyle = {
   width: number;

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Graph/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Graph/types.ts
@@ -19,12 +19,8 @@
 import { QueryFormData } from '@superset-ui/core';
 import { GraphNodeItemOption } from 'echarts/types/src/chart/graph/GraphSeries';
 import { SeriesTooltipOption } from 'echarts/types/src/util/types';
-import {
-  DEFAULT_LEGEND_FORM_DATA,
-  EchartsLegendFormData,
-  LegendOrientation,
-  LegendType,
-} from '../types';
+import { EchartsLegendFormData, LegendOrientation, LegendType } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 export type EdgeSymbol = 'none' | 'circle' | 'arrow';
 

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
@@ -36,7 +36,7 @@ import {
 
 import { DEFAULT_FORM_DATA } from './types';
 import { EchartsTimeseriesSeriesType } from '../Timeseries/types';
-import { legendSection, richTooltipSection, xAxisControl } from '../controls';
+import { legendSection, richTooltipSection } from '../controls';
 
 const {
   area,
@@ -295,7 +295,7 @@ const config: ControlPanelConfig = {
       ? {
           label: t('Shared query fields'),
           expanded: true,
-          controlSetRows: [[xAxisControl]],
+          controlSetRows: [['x_axis']],
         }
       : null,
     createQuerySection(t('Query A'), ''),

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/types.ts
@@ -28,17 +28,17 @@ import {
   QueryFormColumn,
 } from '@superset-ui/core';
 import {
-  DEFAULT_LEGEND_FORM_DATA,
   EchartsLegendFormData,
   EchartsTitleFormData,
-  DEFAULT_TITLE_FORM_DATA,
   StackType,
+  EchartsTimeseriesContributionType,
+  EchartsTimeseriesSeriesType,
 } from '../types';
 import {
+  DEFAULT_LEGEND_FORM_DATA,
+  DEFAULT_TITLE_FORM_DATA,
   DEFAULT_FORM_DATA as TIMESERIES_DEFAULTS,
-  EchartsTimeseriesContributionType,
-  EchartsTimeseriesSeriesType,
-} from '../Timeseries/types';
+} from '../constants';
 
 export type EchartsMixedTimeseriesFormData = QueryFormData & {
   annotationLayers: AnnotationLayer[];

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/transformProps.ts
@@ -36,7 +36,7 @@ import {
   EchartsPieLabelType,
   PieChartTransformedProps,
 } from './types';
-import { DEFAULT_LEGEND_FORM_DATA } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA, OpacityEnum } from '../constants';
 import {
   extractGroupbyLabel,
   getChartPadding,
@@ -45,7 +45,6 @@ import {
   sanitizeHtml,
 } from '../utils/series';
 import { defaultGrid, defaultTooltip } from '../defaults';
-import { OpacityEnum } from '../constants';
 import { convertInteger } from '../utils/convertInteger';
 
 const percentFormatter = getNumberFormatter(NumberFormats.PERCENT_2_POINT);

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/types.ts
@@ -25,12 +25,8 @@ import {
   QueryFormData,
   SetDataMaskHook,
 } from '@superset-ui/core';
-import {
-  DEFAULT_LEGEND_FORM_DATA,
-  EchartsLegendFormData,
-  LegendOrientation,
-  LegendType,
-} from '../types';
+import { EchartsLegendFormData, LegendOrientation, LegendType } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 export type EchartsPieFormData = QueryFormData &
   EchartsLegendFormData & {

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Radar/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Radar/transformProps.ts
@@ -36,15 +36,14 @@ import {
   EchartsRadarLabelType,
   RadarChartTransformedProps,
 } from './types';
-import { DEFAULT_LEGEND_FORM_DATA } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA, OpacityEnum } from '../constants';
 import {
   extractGroupbyLabel,
   getChartPadding,
   getColtypesMapping,
   getLegendProps,
 } from '../utils/series';
 import { defaultGrid, defaultTooltip } from '../defaults';
-import { OpacityEnum } from '../constants';
 
 export function formatLabel({
   params,

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Radar/types.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Radar/types.ts
@@ -27,12 +27,12 @@ import {
   SetDataMaskHook,
 } from '@superset-ui/core';
 import {
-  DEFAULT_LEGEND_FORM_DATA,
   EchartsLegendFormData,
   LabelPositionEnum,
   LegendOrientation,
   LegendType,
 } from '../types';
+import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
 
 type RadarColumnConfig = Record<string, { radarMetricMaxValue?: number }>;
 

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 import React from 'react';
-import { FeatureFlag, isFeatureEnabled, t } from '@superset-ui/core';
+import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
   ControlPanelsContainerProps,
@@ -28,10 +28,10 @@ import {
 } from '@superset-ui/chart-controls';
 
 import {
-  DEFAULT_FORM_DATA,
   EchartsTimeseriesContributionType,
   EchartsTimeseriesSeriesType,
 } from '../types';
+import { DEFAULT_FORM_DATA } from '../constants';
 import {
   legendSection,
   onlyTotalControl,
@@ -62,7 +62,7 @@ const config: ControlPanelConfig = {
       label: t('Query'),
       expanded: true,
       controlSetRows: [
-        isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) ? [xAxisControl] : [],
+        [xAxisControl],
         ['metrics'],
         ['groupby'],
         [

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 import React from 'react';
-import { FeatureFlag, isFeatureEnabled, t } from '@superset-ui/core';
+import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
   ControlPanelsContainerProps,
@@ -31,10 +31,10 @@ import {
 } from '@superset-ui/chart-controls';
 
 import {
-  DEFAULT_FORM_DATA,
   EchartsTimeseriesContributionType,
   OrientationType,
 } from '../../types';
+import { DEFAULT_FORM_DATA } from '../../constants';
 import {
   legendSection,
   richTooltipSection,
@@ -269,7 +269,7 @@ const config: ControlPanelConfig = {
       label: t('Query'),
       expanded: true,
       controlSetRows: [
-        isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) ? [xAxisControl] : [],
+        [xAxisControl],
         ['metrics'],
         ['groupby'],
         [

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/index.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/index.ts
@@ -25,15 +25,15 @@ import {
   isFeatureEnabled,
   t,
 } from '@superset-ui/core';
-import buildQuery from '../../buildQuery';
-import controlPanel from './controlPanel';
-import transformProps from '../../transformProps';
-import thumbnail from './images/thumbnail.png';
 import {
   EchartsTimeseriesChartProps,
   EchartsTimeseriesFormData,
   EchartsTimeseriesSeriesType,
 } from '../../types';
+import buildQuery from '../../buildQuery';
+import controlPanel from './controlPanel';
+import transformProps from '../../transformProps';
+import thumbnail from './images/thumbnail.png';
 import example1 from './images/Bar1.png';
 import example2 from './images/Bar2.png';
 import example3 from './images/Bar3.png';

diff --git a/...t-echarts/src/Timeseries/controlPanel.tsx → .../Timeseries/Regular/Line/controlPanel.tsx b/...t-echarts/src/Timeseries/controlPanel.tsx → .../Timeseries/Regular/Line/controlPanel.tsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 import React from 'react';
-import { FeatureFlag, isFeatureEnabled, t } from '@superset-ui/core';
+import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
   ControlPanelsContainerProps,
@@ -28,16 +28,16 @@ import {
 } from '@superset-ui/chart-controls';
 
 import {
-  DEFAULT_FORM_DATA,
   EchartsTimeseriesContributionType,
   EchartsTimeseriesSeriesType,
-} from './types';
+} from '../../types';
+import { DEFAULT_FORM_DATA } from '../../constants';
 import {
   legendSection,
   richTooltipSection,
   showValueSection,
   xAxisControl,
-} from '../controls';
+} from '../../../controls';
 
 const {
   area,
@@ -61,7 +61,7 @@ const config: ControlPanelConfig = {
       label: t('Query'),
       expanded: true,
       controlSetRows: [
-        isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) ? [xAxisControl] : [],
+        [xAxisControl],
         ['metrics'],
         ['groupby'],
         [

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/index.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/index.ts
@@ -25,15 +25,15 @@ import {
   isFeatureEnabled,
   t,
 } from '@superset-ui/core';
-import buildQuery from '../../buildQuery';
-import controlPanel from '../controlPanel';
-import transformProps from '../../transformProps';
-import thumbnail from './images/thumbnail.png';
 import {
   EchartsTimeseriesChartProps,
   EchartsTimeseriesFormData,
   EchartsTimeseriesSeriesType,
 } from '../../types';
+import buildQuery from '../../buildQuery';
+import controlPanel from './controlPanel';
+import transformProps from '../../transformProps';
+import thumbnail from './images/thumbnail.png';
 import example1 from './images/Line1.png';
 import example2 from './images/Line2.png';
 

diff --git a/...set-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx b/...set-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 import React from 'react';
-import { FeatureFlag, isFeatureEnabled, t } from '@superset-ui/core';
+import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
   ControlPanelsContainerProps,
@@ -27,7 +27,7 @@ import {
   sharedControls,
 } from '@superset-ui/chart-controls';
 
-import { DEFAULT_FORM_DATA } from '../../types';
+import { DEFAULT_FORM_DATA } from '../../constants';
 import {
   legendSection,
   richTooltipSection,
@@ -53,7 +53,7 @@ const config: ControlPanelConfig = {
       label: t('Query'),
       expanded: true,
       controlSetRows: [
-        isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) ? [xAxisControl] : [],
+        [xAxisControl],
         ['metrics'],
         ['groupby'],
         ['adhoc_filters'],