diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index d6a93a9b1195..8a9c8660e317 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1050,16 +1050,13 @@ The filter-box configuration references column names (via the `column` key) and | Field | Type | Notes | | --------------------- | --------- | ------------------------------------------------ | | `color_picker` | _object_ | The **Fixed Color** widget | -| `donut` | _boolean_ | The **Donut** widget | | `global_opacity` | _number_ | The **Opacity** widget | | `header_font_size` | _number_ | The **Big Number Font Size** widget (or similar) | | `label_colors` | _object_ | The **Color Scheme** widget | -| `labels_outside` | _boolean_ | The **Put labels outside** widget | | `line_interpolation` | _string_ | The **Line Style** widget | | `link_length` | _number_ | The **No of Bins** widget | | `normalized` | _boolean_ | The **Normalized** widget | | `number_format` | _string_ | The **Number format** widget | -| `pie_label_type` | _string_ | [HIDDEN] | | `rich_tooltip` | _boolean_ | The **Rich Tooltip** widget | | `send_time_range` | _boolean_ | The **Show Markers** widget | | `show_brush` | _string_ | The **Show Range Filter** widget | @@ -1075,7 +1072,6 @@ The filter-box configuration references column names (via the `column` key) and | `x_axis_format` | _string_ | The **X Axis Format** widget | | `x_axis_label` | _string_ | The **X Axis Label** widget | | `x_axis_showminmax` | _boolean_ | The **X bounds** widget | -| `x_log_scale` | _N/A_ | _Deprecated?_ | | `x_ticks_layout` | _string_ | The **X Tick Layout** widget | ### Y Axis @@ -1144,10 +1140,7 @@ Note the `y_axis_format` is defined under various section for some charts. | `js_agg_function` | _N/A_ | | | `js_columns` | _N/A_ | | | `label` | _N/A_ | | -| `labels_outside` | _N/A_ | | | `legend_position` | _N/A_ | | -| `line_charts` | _N/A_ | | -| `line_charts_2` | _N/A_ | | | `line_column` | _N/A_ | | | `line_type` | _N/A_ | | | `line_width` | _N/A_ | | @@ -1155,10 +1148,6 @@ Note the `y_axis_format` is defined under various section for some charts. | `log_scale` | _N/A_ | | | `mapbox_label` | _N/A_ | | | `mapbox_style` | _N/A_ | | -| `marker_labels` | _N/A_ | | -| `marker_line_labels` | _N/A_ | | -| `marker_lines` | _N/A_ | | -| `markers` | _N/A_ | | | `markup_type` | _N/A_ | | | `max_radius` | _N/A_ | | | `min_periods` | _N/A_ | | @@ -1176,9 +1165,6 @@ Note the `y_axis_format` is defined under various section for some charts. | `perm` | _N/A_ | | | `point_radius_fixed` | _N/A_ | | | `point_unit` | _N/A_ | | -| `prefix_metric_with_slice_name` | _N/A_ | | -| `range_labels` | _N/A_ | | -| `ranges` | _N/A_ | | | `rdo_save` | _N/A_ | | | `reduce_x_ticks` | _N/A_ | | | `refresh_frequency` | _N/A_ | | @@ -1207,7 +1193,6 @@ Note the `y_axis_format` is defined under various section for some charts. | `show_values` | _N/A_ | | | `slice_name` | _N/A_ | | | `spatial` | _N/A_ | | -| `stacked_style` | _N/A_ | | | `start_spatial` | _N/A_ | | | `stroke_color_picker` | _N/A_ | | | `stroke_width` | _N/A_ | | diff --git a/superset-frontend/src/explore/controlPanels/Area.js b/superset-frontend/src/explore/controlPanels/Area.js index 1c01fa482523..2eda633bfadf 100644 --- a/superset-frontend/src/explore/controlPanels/Area.js +++ b/superset-frontend/src/explore/controlPanels/Area.js @@ -29,7 +29,24 @@ export default { expanded: true, controlSetRows: [ ['show_brush', 'show_legend'], - ['line_interpolation', 'stacked_style'], + [ + 'line_interpolation', + { + name: 'stacked_style', + config: { + type: 'SelectControl', + label: t('Stacked Style'), + renderTrigger: true, + choices: [ + ['stack', 'stack'], + ['stream', 'stream'], + ['expand', 'expand'], + ], + default: 'stack', + description: '', + }, + }, + ], ['color_scheme', 'label_colors'], ['rich_tooltip', 'show_controls'], ], diff --git a/superset-frontend/src/explore/controlPanels/Bubble.js b/superset-frontend/src/explore/controlPanels/Bubble.js index 891fe29cf152..c8a9d57d5a8c 100644 --- a/superset-frontend/src/explore/controlPanels/Bubble.js +++ b/superset-frontend/src/explore/controlPanels/Bubble.js @@ -17,6 +17,7 @@ * under the License. */ import { t } from '@superset-ui/translation'; +import { nonEmpty } from '../validators'; export default { label: t('Bubble Chart'), @@ -26,8 +27,48 @@ export default { expanded: true, controlSetRows: [ ['series', 'entity'], - ['x'], - ['y'], + [ + { + name: 'x', + config: { + type: 'MetricsControl', + validators: [nonEmpty], + mapStateToProps: state => { + const datasource = state.datasource; + return { + columns: datasource ? datasource.columns : [], + savedMetrics: datasource ? datasource.metrics : [], + datasourceType: datasource && datasource.type, + }; + }, + multi: false, + label: t('X Axis'), + description: t('Metric assigned to the [X] axis'), + default: null, + }, + }, + ], + [ + { + name: 'y', + config: { + type: 'MetricsControl', + validators: [nonEmpty], + mapStateToProps: state => { + const datasource = state.datasource; + return { + columns: datasource ? datasource.columns : [], + savedMetrics: datasource ? datasource.metrics : [], + datasourceType: datasource && datasource.type, + }; + }, + multi: false, + label: t('Y Axis'), + default: null, + description: t('Metric assigned to the [Y] axis'), + }, + }, + ], ['adhoc_filters'], ['size'], ['max_bubble_size'], @@ -48,7 +89,19 @@ export default { controlSetRows: [ ['x_axis_label', 'left_margin'], ['x_axis_format', 'x_ticks_layout'], - ['x_log_scale', 'x_axis_showminmax'], + [ + { + name: 'x_log_scale', + config: { + type: 'CheckboxControl', + label: t('X Log Scale'), + default: false, + renderTrigger: true, + description: t('Use a log scale for the X-axis'), + }, + }, + 'x_axis_showminmax', + ], ], }, { diff --git a/superset-frontend/src/explore/controlPanels/Bullet.js b/superset-frontend/src/explore/controlPanels/Bullet.js index b0e4252e130b..33281d13b669 100644 --- a/superset-frontend/src/explore/controlPanels/Bullet.js +++ b/superset-frontend/src/explore/controlPanels/Bullet.js @@ -30,9 +30,66 @@ export default { label: t('Chart Options'), expanded: true, controlSetRows: [ - ['ranges', 'range_labels'], - ['markers', 'marker_labels'], - ['marker_lines', 'marker_line_labels'], + [ + { + name: 'ranges', + config: { + type: 'TextControl', + label: t('Ranges'), + default: '', + description: t('Ranges to highlight with shading'), + }, + }, + { + name: 'range_labels', + config: { + type: 'TextControl', + label: t('Range labels'), + default: '', + description: t('Labels for the ranges'), + }, + }, + ], + [ + { + name: 'markers', + config: { + type: 'TextControl', + label: t('Markers'), + default: '', + description: t('List of values to mark with triangles'), + }, + }, + { + name: 'marker_labels', + config: { + type: 'TextControl', + label: t('Marker labels'), + default: '', + description: t('Labels for the markers'), + }, + }, + ], + [ + { + name: 'marker_lines', + config: { + type: 'TextControl', + label: t('Marker lines'), + default: '', + description: t('List of values to mark with lines'), + }, + }, + { + name: 'marker_line_labels', + config: { + type: 'TextControl', + label: t('Marker line labels'), + default: '', + description: t('Labels for the marker lines'), + }, + }, + ], ], }, ], diff --git a/superset-frontend/src/explore/controlPanels/DualLine.js b/superset-frontend/src/explore/controlPanels/DualLine.js index f4b854fc0c12..3592d4092e43 100644 --- a/superset-frontend/src/explore/controlPanels/DualLine.js +++ b/superset-frontend/src/explore/controlPanels/DualLine.js @@ -19,6 +19,8 @@ import { t } from '@superset-ui/translation'; import { annotations } from './sections'; import { D3_TIME_FORMAT_OPTIONS } from '../controls'; +import { mainMetric } from '../../modules/utils'; +import { nonEmpty } from '../validators'; export default { requiresTime: true, @@ -36,7 +38,31 @@ export default { { label: t('Y Axis 2'), expanded: true, - controlSetRows: [['metric_2', 'y_axis_2_format']], + controlSetRows: [ + [ + { + name: 'metric_2', + config: { + type: 'MetricsControl', + validators: [nonEmpty], + mapStateToProps: state => { + const datasource = state.datasource; + return { + columns: datasource ? datasource.columns : [], + savedMetrics: datasource ? datasource.metrics : [], + datasourceType: datasource && datasource.type, + }; + }, + multi: false, + default: props => mainMetric(props.savedMetrics), + label: t('Right Axis Metric'), + clearable: true, + description: t('Choose a metric for right axis'), + }, + }, + 'y_axis_2_format', + ], + ], }, { label: t('Query'), diff --git a/superset-frontend/src/explore/controlPanels/LineMulti.js b/superset-frontend/src/explore/controlPanels/LineMulti.js index 68ca2609cb4d..93ab24026d4f 100644 --- a/superset-frontend/src/explore/controlPanels/LineMulti.js +++ b/superset-frontend/src/explore/controlPanels/LineMulti.js @@ -19,6 +19,7 @@ import { t } from '@superset-ui/translation'; import { annotations } from './sections'; import { D3_TIME_FORMAT_OPTIONS } from '../controls'; +import { nonEmpty } from '../validators'; export default { requiresTime: true, @@ -28,7 +29,18 @@ export default { expanded: true, controlSetRows: [ ['color_scheme', 'label_colors'], - ['prefix_metric_with_slice_name', null], + [ + { + name: 'prefix_metric_with_slice_name', + config: { + type: 'CheckboxControl', + label: t('Prefix metric name with slice name'), + default: false, + renderTrigger: true, + }, + }, + null, + ], ['show_legend', 'show_markers'], ['line_interpolation', null], ], @@ -45,12 +57,68 @@ export default { { label: t('Y Axis 1'), expanded: true, - controlSetRows: [['line_charts', 'y_axis_format']], + controlSetRows: [ + [ + { + name: 'line_charts', + config: { + type: 'SelectAsyncControl', + multi: true, + label: t('Left Axis chart(s)'), + validators: [nonEmpty], + default: [], + description: t('Choose one or more charts for left axis'), + dataEndpoint: + '/sliceasync/api/read?_flt_0_viz_type=line&_flt_7_viz_type=line_multi', + placeholder: t('Select charts'), + onAsyncErrorMessage: t('Error while fetching charts'), + mutator: data => { + if (!data || !data.result) { + return []; + } + return data.result.map(o => ({ + value: o.id, + label: o.slice_name, + })); + }, + }, + }, + 'y_axis_format', + ], + ], }, { label: t('Y Axis 2'), expanded: false, - controlSetRows: [['line_charts_2', 'y_axis_2_format']], + controlSetRows: [ + [ + { + name: 'line_charts_2', + config: { + type: 'SelectAsyncControl', + multi: true, + label: t('Right Axis chart(s)'), + validators: [], + default: [], + description: t('Choose one or more charts for right axis'), + dataEndpoint: + '/sliceasync/api/read?_flt_0_viz_type=line&_flt_7_viz_type=line_multi', + placeholder: t('Select charts'), + onAsyncErrorMessage: t('Error while fetching charts'), + mutator: data => { + if (!data || !data.result) { + return []; + } + return data.result.map(o => ({ + value: o.id, + label: o.slice_name, + })); + }, + }, + }, + 'y_axis_2_format', + ], + ], }, { label: t('Query'), @@ -60,10 +128,6 @@ export default { annotations, ], controlOverrides: { - line_charts: { - label: t('Left Axis chart(s)'), - description: t('Choose one or more charts for left axis'), - }, y_axis_format: { label: t('Left Axis Format'), }, diff --git a/superset-frontend/src/explore/controlPanels/Pie.js b/superset-frontend/src/explore/controlPanels/Pie.js index d9673bb38d87..7ce475f2e661 100644 --- a/superset-frontend/src/explore/controlPanels/Pie.js +++ b/superset-frontend/src/explore/controlPanels/Pie.js @@ -34,9 +34,52 @@ export default { label: t('Chart Options'), expanded: true, controlSetRows: [ - ['pie_label_type', 'number_format'], - ['donut', 'show_legend'], - ['show_labels', 'labels_outside'], + [ + { + name: 'pie_label_type', + config: { + type: 'SelectControl', + label: t('Label Type'), + default: 'key', + renderTrigger: true, + choices: [ + ['key', 'Category Name'], + ['value', 'Value'], + ['percent', 'Percentage'], + ['key_value', 'Category and Value'], + ['key_percent', 'Category and Percentage'], + ], + description: t('What should be shown on the label?'), + }, + }, + 'number_format', + ], + [ + { + name: 'donut', + config: { + type: 'CheckboxControl', + label: t('Donut'), + default: false, + renderTrigger: true, + description: t('Do you want a donut or a pie?'), + }, + }, + 'show_legend', + ], + [ + 'show_labels', + { + name: 'labels_outside', + config: { + type: 'CheckboxControl', + label: t('Put labels outside'), + default: true, + renderTrigger: true, + description: t('Put the labels outside the pie?'), + }, + }, + ], ['color_scheme', 'label_colors'], ], }, diff --git a/superset-frontend/src/explore/controlPanels/TimePivot.js b/superset-frontend/src/explore/controlPanels/TimePivot.js index 82604ebde17f..b63b63171a93 100644 --- a/superset-frontend/src/explore/controlPanels/TimePivot.js +++ b/superset-frontend/src/explore/controlPanels/TimePivot.js @@ -25,7 +25,40 @@ export default { { label: t('Query'), expanded: true, - controlSetRows: [['metric'], ['adhoc_filters'], ['freq']], + controlSetRows: [ + ['metric'], + ['adhoc_filters'], + [ + { + name: 'freq', + config: { + type: 'SelectControl', + label: t('Frequency'), + default: 'W-MON', + freeForm: true, + clearable: false, + choices: [ + ['AS', 'Year (freq=AS)'], + ['52W-MON', '52 weeks starting Monday (freq=52W-MON)'], + ['W-SUN', '1 week starting Sunday (freq=W-SUN)'], + ['W-MON', '1 week starting Monday (freq=W-MON)'], + ['D', 'Day (freq=D)'], + ['4W-MON', '4 weeks (freq=4W-MON)'], + ], + description: t( + `The periodicity over which to pivot time. Users can provide + "Pandas" offset alias. + Click on the info bubble for more details on accepted "freq" expressions.`, + ), + tooltipOnClick: () => { + window.open( + 'https://pandas.pydata.org/pandas-docs/stable/timeseries.html#offset-aliases', + ); + }, + }, + }, + ], + ], }, { label: t('Chart Options'), diff --git a/superset-frontend/src/explore/controls.jsx b/superset-frontend/src/explore/controls.jsx index 0c14116fc829..00225801d956 100644 --- a/superset-frontend/src/explore/controls.jsx +++ b/superset-frontend/src/explore/controls.jsx @@ -331,26 +331,6 @@ export const controls = { renderTrigger: true, }, - metric_2: { - ...metric, - label: t('Right Axis Metric'), - clearable: true, - description: t('Choose a metric for right axis'), - }, - - stacked_style: { - type: 'SelectControl', - label: t('Stacked Style'), - renderTrigger: true, - choices: [ - ['stack', 'stack'], - ['stream', 'stream'], - ['expand', 'expand'], - ], - default: 'stack', - description: '', - }, - linear_color_scheme: { type: 'ColorSchemeControl', label: t('Linear Color Scheme'), @@ -491,32 +471,6 @@ export const controls = { description: t('The name of the country that Superset should display'), }, - freq: { - type: 'SelectControl', - label: t('Frequency'), - default: 'W-MON', - freeForm: true, - clearable: false, - choices: [ - ['AS', 'Year (freq=AS)'], - ['52W-MON', '52 weeks starting Monday (freq=52W-MON)'], - ['W-SUN', '1 week starting Sunday (freq=W-SUN)'], - ['W-MON', '1 week starting Monday (freq=W-MON)'], - ['D', 'Day (freq=D)'], - ['4W-MON', '4 weeks (freq=4W-MON)'], - ], - description: t( - `The periodicity over which to pivot time. Users can provide - "Pandas" offset alias. - Click on the info bubble for more details on accepted "freq" expressions.`, - ), - tooltipOnClick: () => { - window.open( - 'https://pandas.pydata.org/pandas-docs/stable/timeseries.html#offset-aliases', - ); - }, - }, - groupby: groupByControl, dimension: { ...groupByControl, @@ -1008,20 +962,6 @@ export const controls = { description: t('This defines the element to be plotted on the chart'), }, - x: { - ...metric, - label: t('X Axis'), - description: t('Metric assigned to the [X] axis'), - default: null, - }, - - y: { - ...metric, - label: t('Y Axis'), - default: null, - description: t('Metric assigned to the [Y] axis'), - }, - size: { ...metric, label: t('Bubble Size'), @@ -1147,21 +1087,6 @@ export const controls = { description: t('Line interpolation as defined by d3.js'), }, - pie_label_type: { - type: 'SelectControl', - label: t('Label Type'), - default: 'key', - renderTrigger: true, - choices: [ - ['key', 'Category Name'], - ['value', 'Value'], - ['percent', 'Percentage'], - ['key_value', 'Category and Value'], - ['key_percent', 'Category and Percentage'], - ], - description: t('What should be shown on the label?'), - }, - code: { type: 'TextAreaControl', label: t('Code'), @@ -1463,14 +1388,6 @@ export const controls = { description: t('Use a log scale for the Y-axis'), }, - x_log_scale: { - type: 'CheckboxControl', - label: t('X Log Scale'), - default: false, - renderTrigger: true, - description: t('Use a log scale for the X-axis'), - }, - log_scale: { type: 'CheckboxControl', label: t('Log Scale'), @@ -1479,22 +1396,6 @@ export const controls = { description: t('Use a log scale'), }, - donut: { - type: 'CheckboxControl', - label: t('Donut'), - default: false, - renderTrigger: true, - description: t('Do you want a donut or a pie?'), - }, - - labels_outside: { - type: 'CheckboxControl', - label: t('Put labels outside'), - default: true, - renderTrigger: true, - description: t('Put the labels outside the pie?'), - }, - contribution: { type: 'CheckboxControl', label: t('Contribution'), @@ -1656,48 +1557,6 @@ export const controls = { description: t('Pick a color'), }, - ranges: { - type: 'TextControl', - label: t('Ranges'), - default: '', - description: t('Ranges to highlight with shading'), - }, - - range_labels: { - type: 'TextControl', - label: t('Range labels'), - default: '', - description: t('Labels for the ranges'), - }, - - markers: { - type: 'TextControl', - label: t('Markers'), - default: '', - description: t('List of values to mark with triangles'), - }, - - marker_labels: { - type: 'TextControl', - label: t('Marker labels'), - default: '', - description: t('Labels for the markers'), - }, - - marker_lines: { - type: 'TextControl', - label: t('Marker lines'), - default: '', - description: t('List of values to mark with lines'), - }, - - marker_line_labels: { - type: 'TextControl', - label: t('Marker line labels'), - default: '', - description: t('Labels for the marker lines'), - }, - annotation_layers: { type: 'AnnotationLayerControl', label: '', @@ -1836,51 +1695,6 @@ export const controls = { description: t('The width of the lines'), }, - line_charts: { - type: 'SelectAsyncControl', - multi: true, - label: t('Line charts'), - validators: [v.nonEmpty], - default: [], - description: t('Pick a set of line charts to layer on top of one another'), - dataEndpoint: - '/sliceasync/api/read?_flt_0_viz_type=line&_flt_7_viz_type=line_multi', - placeholder: t('Select charts'), - onAsyncErrorMessage: t('Error while fetching charts'), - mutator: data => { - if (!data || !data.result) { - return []; - } - return data.result.map(o => ({ value: o.id, label: o.slice_name })); - }, - }, - - line_charts_2: { - type: 'SelectAsyncControl', - multi: true, - label: t('Right Axis chart(s)'), - validators: [], - default: [], - description: t('Choose one or more charts for right axis'), - dataEndpoint: - '/sliceasync/api/read?_flt_0_viz_type=line&_flt_7_viz_type=line_multi', - placeholder: t('Select charts'), - onAsyncErrorMessage: t('Error while fetching charts'), - mutator: data => { - if (!data || !data.result) { - return []; - } - return data.result.map(o => ({ value: o.id, label: o.slice_name })); - }, - }, - - prefix_metric_with_slice_name: { - type: 'CheckboxControl', - label: t('Prefix metric name with slice name'), - default: false, - renderTrigger: true, - }, - reverse_long_lat: { type: 'CheckboxControl', label: t('Reverse Lat & Long'),