From fe53555fc278010ddd6564d02d94ae120796594d Mon Sep 17 00:00:00 2001 From: Ville Brofeldt <33317356+villebro@users.noreply.github.com> Date: Tue, 24 Mar 2020 21:43:20 +0200 Subject: [PATCH] Migrate unique Heatmap controls (#9360) * Migrate Heatmap controls * Lint --- CONTRIBUTING.md | 5 - .../src/explore/controlPanels/Heatmap.js | 99 ++++++++++++++++++- superset-frontend/src/explore/controls.jsx | 69 ------------- 3 files changed, 95 insertions(+), 78 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 0479e467c2467..51ccd02868901 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1070,7 +1070,6 @@ The filter-box configuration references column names (via the `column` key) and | `y_axis_showminmax` | _boolean_ | The **Y bounds** widget | | `y_axis_zero` | _N/A_ | _Deprecated?_ | | `y_log_scale` | _boolean_ | The **Y Log Scale** widget | -| `yscale_interval` | _N/A_ | _Deprecated?_ | Note the `y_axis_format` is defined under various section for some charts. @@ -1093,7 +1092,6 @@ Note the `y_axis_format` is defined under various section for some charts. | `autozoom` | _N/A_ | | | `bar_stacked` | _N/A_ | | | `cache_timeout` | _N/A_ | | -| `canvas_image_rendering` | _N/A_ | | | `charge` | _N/A_ | | | `clustering_radius` | _N/A_ | | | `code` | _N/A_ | | @@ -1204,15 +1202,12 @@ Note the `y_axis_format` is defined under various section for some charts. | `show_druid_time_granularity` | _N/A_ | | | `show_druid_time_origin` | _N/A_ | | | `show_labels` | _N/A_ | | -| `show_perc` | _N/A_ | | | `show_sqla_time_column` | _N/A_ | | | `show_sqla_time_granularity` | _N/A_ | | | `show_values` | _N/A_ | | | `size_from` | _N/A_ | | | `size_to` | _N/A_ | | | `slice_name` | _N/A_ | | -| `sort_x_axis` | _N/A_ | | -| `sort_y_axis` | _N/A_ | | | `spatial` | _N/A_ | | | `stacked_style` | _N/A_ | | | `start_spatial` | _N/A_ | | diff --git a/superset-frontend/src/explore/controlPanels/Heatmap.js b/superset-frontend/src/explore/controlPanels/Heatmap.js index 0b59c67a260d8..1586f573943c5 100644 --- a/superset-frontend/src/explore/controlPanels/Heatmap.js +++ b/superset-frontend/src/explore/controlPanels/Heatmap.js @@ -18,6 +18,14 @@ */ import { t } from '@superset-ui/translation'; import { nonEmpty } from '../validators'; +import { formatSelectOptionsForRange } from '../../modules/utils'; + +const sortAxisChoices = [ + ['alpha_asc', t('Axis ascending')], + ['alpha_desc', t('Axis descending')], + ['value_asc', t('Metric ascending')], + ['value_desc', t('Metric descending')], +]; export default { controlPanelSections: [ @@ -36,13 +44,96 @@ export default { expanded: true, controlSetRows: [ ['linear_color_scheme'], - ['xscale_interval', 'yscale_interval'], - ['canvas_image_rendering', 'normalize_across'], + [ + { + name: 'xscale_interval', + config: { + type: 'SelectControl', + label: t('XScale Interval'), + renderTrigger: true, + choices: formatSelectOptionsForRange(1, 50), + default: '1', + clearable: false, + description: t( + 'Number of steps to take between ticks when displaying the X scale', + ), + }, + }, + { + name: 'yscale_interval', + config: { + type: 'SelectControl', + label: t('YScale Interval'), + choices: formatSelectOptionsForRange(1, 50), + default: '1', + clearable: false, + renderTrigger: true, + description: t( + 'Number of steps to take between ticks when displaying the Y scale', + ), + }, + }, + ], + [ + { + name: 'canvas_image_rendering', + config: { + type: 'SelectControl', + label: t('Rendering'), + renderTrigger: true, + choices: [ + ['pixelated', 'pixelated (Sharp)'], + ['auto', 'auto (Smooth)'], + ], + default: 'pixelated', + description: t( + 'image-rendering CSS attribute of the canvas object that ' + + 'defines how the browser scales up the image', + ), + }, + }, + 'normalize_across', + ], ['left_margin', 'bottom_margin'], ['y_axis_bounds', 'y_axis_format'], - ['show_legend', 'show_perc'], + [ + 'show_legend', + { + name: 'show_perc', + config: { + type: 'CheckboxControl', + label: t('Show percentage'), + renderTrigger: true, + description: t( + 'Whether to include the percentage in the tooltip', + ), + default: true, + }, + }, + ], ['show_values', 'normalized'], - ['sort_x_axis', 'sort_y_axis'], + [ + { + name: 'sort_x_axis', + config: { + type: 'SelectControl', + label: t('Sort X Axis'), + choices: sortAxisChoices, + clearable: false, + default: 'alpha_asc', + }, + }, + { + name: 'sort_y_axis', + config: { + type: 'SelectControl', + label: t('Sort Y Axis'), + choices: sortAxisChoices, + clearable: false, + default: 'alpha_asc', + }, + }, + ], ], }, ], diff --git a/superset-frontend/src/explore/controls.jsx b/superset-frontend/src/explore/controls.jsx index 9ab560f01877b..3f229a1d22842 100644 --- a/superset-frontend/src/explore/controls.jsx +++ b/superset-frontend/src/explore/controls.jsx @@ -119,12 +119,6 @@ const timeColumnOption = { 'account', ), }; -const sortAxisChoices = [ - ['alpha_asc', 'Axis ascending'], - ['alpha_desc', 'Axis descending'], - ['value_asc', 'sum(value) ascending'], - ['value_desc', 'sum(value) descending'], -]; const groupByControl = { type: 'SelectControl', @@ -377,22 +371,6 @@ export const controls = { description: '', }, - sort_x_axis: { - type: 'SelectControl', - label: t('Sort X Axis'), - choices: sortAxisChoices, - clearable: false, - default: 'alpha_asc', - }, - - sort_y_axis: { - type: 'SelectControl', - label: t('Sort Y Axis'), - choices: sortAxisChoices, - clearable: false, - default: 'alpha_asc', - }, - linear_color_scheme: { type: 'ColorSchemeControl', label: t('Linear Color Scheme'), @@ -437,45 +415,6 @@ export const controls = { ), }, - canvas_image_rendering: { - type: 'SelectControl', - label: t('Rendering'), - renderTrigger: true, - choices: [ - ['pixelated', 'pixelated (Sharp)'], - ['auto', 'auto (Smooth)'], - ], - default: 'pixelated', - description: t( - 'image-rendering CSS attribute of the canvas object that ' + - 'defines how the browser scales up the image', - ), - }, - - xscale_interval: { - type: 'SelectControl', - label: t('XScale Interval'), - renderTrigger: true, - choices: formatSelectOptionsForRange(1, 50), - default: '1', - clearable: false, - description: t( - 'Number of steps to take between ticks when displaying the X scale', - ), - }, - - yscale_interval: { - type: 'SelectControl', - label: t('YScale Interval'), - choices: formatSelectOptionsForRange(1, 50), - default: '1', - clearable: false, - renderTrigger: true, - description: t( - 'Number of steps to take between ticks when displaying the Y scale', - ), - }, - include_time: { type: 'CheckboxControl', label: t('Include Time'), @@ -495,14 +434,6 @@ export const controls = { ), }, - show_perc: { - type: 'CheckboxControl', - label: t('Show percentage'), - renderTrigger: true, - description: t('Whether to include the percentage in the tooltip'), - default: true, - }, - bar_stacked: { type: 'CheckboxControl', label: t('Stacked Bars'),