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 2023/12/08 16:37:11 UTC

(superset) branch master updated: chore: Moves xAxisLabelRotation to shared controls (#26212)

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 005cf5947b chore: Moves xAxisLabelRotation to shared controls (#26212)
005cf5947b is described below

commit 005cf5947b430543cef841f44f29a816ef884931
Author: Michael S. Molina <70...@users.noreply.github.com>
AuthorDate: Fri Dec 8 13:37:06 2023 -0300

    chore: Moves xAxisLabelRotation to shared controls (#26212)
---
 .../plugin-chart-echarts/src/Bubble/constants.ts   |  3 +-
 .../src/Bubble/controlPanel.tsx                    | 35 +++++++---------------
 .../src/MixedTimeseries/controlPanel.tsx           | 29 ++++--------------
 .../src/Timeseries/Area/controlPanel.tsx           | 24 ++-------------
 .../src/Timeseries/Regular/Bar/controlPanel.tsx    | 19 ++----------
 .../src/Timeseries/Regular/Line/controlPanel.tsx   | 24 ++-------------
 .../Timeseries/Regular/Scatter/controlPanel.tsx    | 24 ++-------------
 .../Timeseries/Regular/SmoothLine/controlPanel.tsx | 24 ++-------------
 .../src/Timeseries/Step/controlPanel.tsx           | 24 ++-------------
 .../src/Timeseries/constants.ts                    |  3 +-
 .../plugins/plugin-chart-echarts/src/controls.tsx  | 19 ++++++++++++
 .../plugins/plugin-chart-echarts/src/defaults.ts   |  5 ++++
 12 files changed, 57 insertions(+), 176 deletions(-)

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/constants.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/constants.ts
index 9c157d33ac..89b03d5e90 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/constants.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/constants.ts
@@ -17,6 +17,7 @@
  * under the License.
  */
 import { DEFAULT_LEGEND_FORM_DATA } from '../constants';
+import { defaultXAxis } from '../defaults';
 import { EchartsBubbleFormData } from './types';
 
 export const DEFAULT_FORM_DATA: Partial<EchartsBubbleFormData> = {
@@ -29,7 +30,7 @@ export const DEFAULT_FORM_DATA: Partial<EchartsBubbleFormData> = {
   truncateXAxis: false,
   truncateYAxis: false,
   yAxisBounds: [null, null],
-  xAxisLabelRotation: 0,
+  xAxisLabelRotation: defaultXAxis.xAxisLabelRotation,
   opacity: 0.6,
 };
 
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/controlPanel.tsx
index 532888b485..521ae98130 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Bubble/controlPanel.tsx
@@ -26,10 +26,15 @@ import {
 } from '@superset-ui/chart-controls';
 
 import { DEFAULT_FORM_DATA } from './constants';
-import { legendSection, truncateXAxis, xAxisBounds } from '../controls';
+import {
+  legendSection,
+  truncateXAxis,
+  xAxisBounds,
+  xAxisLabelRotation,
+} from '../controls';
+import { defaultYAxis } from '../defaults';
 
-const { logAxis, truncateYAxis, yAxisBounds, xAxisLabelRotation, opacity } =
-  DEFAULT_FORM_DATA;
+const { logAxis, truncateYAxis, yAxisBounds, opacity } = DEFAULT_FORM_DATA;
 
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -127,27 +132,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         [
           {
             name: 'x_axis_title_margin',
@@ -212,7 +197,7 @@ const config: ControlPanelConfig = {
                 [0, '0°'],
                 [45, '45°'],
               ],
-              default: xAxisLabelRotation,
+              default: defaultYAxis.yAxisLabelRotation,
               renderTrigger: true,
               description: t(
                 'Input field supports custom rotation. e.g. 30 for 30°',
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
index ec2443bb60..f54b3d01dc 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
@@ -32,7 +32,11 @@ import {
 
 import { DEFAULT_FORM_DATA } from './types';
 import { EchartsTimeseriesSeriesType } from '../Timeseries/types';
-import { legendSection, richTooltipSection } from '../controls';
+import {
+  legendSection,
+  richTooltipSection,
+  xAxisLabelRotation,
+} from '../controls';
 
 const {
   area,
@@ -49,7 +53,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
   yAxisIndex,
 } = DEFAULT_FORM_DATA;
 
@@ -314,27 +317,7 @@ const config: ControlPanelConfig = {
         ...legendSection,
         [<ControlSubSectionHeader>{t('X Axis')}</ControlSubSectionHeader>],
         ['x_axis_time_format'],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],
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
index 018038772c..1ca2805b2f 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
@@ -37,6 +37,7 @@ import {
   richTooltipSection,
   seriesOrderSection,
   percentageThresholdControl,
+  xAxisLabelRotation,
   truncateXAxis,
   xAxisBounds,
 } from '../../controls';
@@ -53,7 +54,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
 } = DEFAULT_FORM_DATA;
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -193,27 +193,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],
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
index c3002a2498..1fecf64e6a 100644
--- 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
@@ -37,6 +37,7 @@ import {
   showValueSection,
   truncateXAxis,
   xAxisBounds,
+  xAxisLabelRotation,
 } from '../../../controls';
 
 import { OrientationType } from '../../types';
@@ -51,7 +52,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
   orientation,
 } = DEFAULT_FORM_DATA;
 
@@ -165,22 +165,9 @@ function createAxisControl(axis: 'x' | 'y'): ControlSetRow[] {
     ],
     [
       {
-        name: 'xAxisLabelRotation',
+        name: xAxisLabelRotation.name,
         config: {
-          type: 'SelectControl',
-          freeForm: true,
-          clearable: false,
-          label: t('Rotate axis label'),
-          choices: [
-            [0, '0°'],
-            [45, '45°'],
-            [90, '90°'],
-          ],
-          default: xAxisLabelRotation,
-          renderTrigger: true,
-          description: t(
-            'Input field supports custom rotation. e.g. 30 for 30°',
-          ),
+          ...xAxisLabelRotation.config,
           visibility: ({ controls }: ControlPanelsContainerProps) =>
             isXAxis ? isVertical(controls) : isHorizontal(controls),
         },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
index 5c5f7a0ab1..488dac0738 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
@@ -40,6 +40,7 @@ import {
   showValueSection,
   truncateXAxis,
   xAxisBounds,
+  xAxisLabelRotation,
 } from '../../../controls';
 
 const {
@@ -54,7 +55,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
 } = DEFAULT_FORM_DATA;
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -181,27 +181,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx
index 6701647694..436000c62d 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Scatter/controlPanel.tsx
@@ -39,6 +39,7 @@ import {
   showValueSection,
   truncateXAxis,
   xAxisBounds,
+  xAxisLabelRotation,
 } from '../../../controls';
 
 const {
@@ -50,7 +51,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
 } = DEFAULT_FORM_DATA;
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -124,27 +124,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         // eslint-disable-next-line react/jsx-key
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/SmoothLine/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/SmoothLine/controlPanel.tsx
index 0c6623f216..2e05ab8202 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/SmoothLine/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/SmoothLine/controlPanel.tsx
@@ -39,6 +39,7 @@ import {
   showValueSectionWithoutStack,
   truncateXAxis,
   xAxisBounds,
+  xAxisLabelRotation,
 } from '../../../controls';
 
 const {
@@ -50,7 +51,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
 } = DEFAULT_FORM_DATA;
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -123,27 +123,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         // eslint-disable-next-line react/jsx-key
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
index 021c306d05..311b85cac0 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
@@ -37,6 +37,7 @@ import {
   showValueSection,
   truncateXAxis,
   xAxisBounds,
+  xAxisLabelRotation,
 } from '../../controls';
 
 const {
@@ -50,7 +51,6 @@ const {
   truncateYAxis,
   yAxisBounds,
   zoomable,
-  xAxisLabelRotation,
 } = DEFAULT_FORM_DATA;
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -175,27 +175,7 @@ const config: ControlPanelConfig = {
             },
           },
         ],
-        [
-          {
-            name: 'xAxisLabelRotation',
-            config: {
-              type: 'SelectControl',
-              freeForm: true,
-              clearable: false,
-              label: t('Rotate x axis label'),
-              choices: [
-                [0, '0°'],
-                [45, '45°'],
-                [90, '90°'],
-              ],
-              default: xAxisLabelRotation,
-              renderTrigger: true,
-              description: t(
-                'Input field supports custom rotation. e.g. 30 for 30°',
-              ),
-            },
-          },
-        ],
+        [xAxisLabelRotation],
         ...richTooltipSection,
         // eslint-disable-next-line react/jsx-key
         [<ControlSubSectionHeader>{t('Y Axis')}</ControlSubSectionHeader>],
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts
index a95a14077d..215996ab12 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/constants.ts
@@ -30,6 +30,7 @@ import {
   DEFAULT_LEGEND_FORM_DATA,
   DEFAULT_TITLE_FORM_DATA,
 } from '../constants';
+import { defaultXAxis } from '../defaults';
 
 // @ts-ignore
 export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = {
@@ -62,7 +63,7 @@ export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = {
   yAxisBounds: [null, null],
   zoomable: false,
   richTooltip: true,
-  xAxisLabelRotation: 0,
+  xAxisLabelRotation: defaultXAxis.xAxisLabelRotation,
   groupby: [],
   showValue: false,
   onlyTotal: false,
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx
index 093617446a..13fe754d99 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/controls.tsx
@@ -29,6 +29,7 @@ import {
 } from '@superset-ui/chart-controls';
 import { DEFAULT_LEGEND_FORM_DATA, StackControlOptions } from './constants';
 import { DEFAULT_FORM_DATA } from './Timeseries/constants';
+import { defaultXAxis } from './defaults';
 
 const { legendMargin, legendOrientation, legendType, showLegend } =
   DEFAULT_LEGEND_FORM_DATA;
@@ -243,6 +244,24 @@ const sortSeriesAscending: ControlSetItem = {
   },
 };
 
+export const xAxisLabelRotation = {
+  name: 'xAxisLabelRotation',
+  config: {
+    type: 'SelectControl',
+    freeForm: true,
+    clearable: false,
+    label: t('Rotate x axis label'),
+    choices: [
+      [0, '0°'],
+      [45, '45°'],
+      [90, '90°'],
+    ],
+    default: defaultXAxis.xAxisLabelRotation,
+    renderTrigger: true,
+    description: t('Input field supports custom rotation. e.g. 30 for 30°'),
+  },
+};
+
 export const seriesOrderSection: ControlSetRow[] = [
   [<ControlSubSectionHeader>{t('Series Order')}</ControlSubSectionHeader>],
   [sortSeriesType],
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/defaults.ts b/superset-frontend/plugins/plugin-chart-echarts/src/defaults.ts
index c5ada14932..be37d6fcbf 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/defaults.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/defaults.ts
@@ -24,6 +24,11 @@ export const defaultGrid = {
 
 export const defaultYAxis = {
   scale: true,
+  yAxisLabelRotation: 0,
+};
+
+export const defaultXAxis = {
+  xAxisLabelRotation: 0,
 };
 
 export const defaultLegendPadding = {