[explore] forcing .1% number format when using 'Period Ratio' (apache…

…#4774)
timifasubaa · May 31, 2018 · 0496bcb · 0496bcb
1 parent c9cf5e4
commit 0496bcb
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 1 deletion.
diff --git a/superset/assets/javascripts/explore/components/ControlHeader.jsx b/superset/assets/javascripts/explore/components/ControlHeader.jsx
@@ -15,6 +15,7 @@ const propTypes = {
   hovered: PropTypes.bool,
   tooltipOnClick: PropTypes.func,
   warning: PropTypes.string,
+  danger: PropTypes.string,
 };
 
 const defaultProps = {
@@ -83,6 +84,19 @@ export default class ControlHeader extends React.Component {
                   overlay={
                     <Tooltip id={'error-tooltip'}>{this.props.warning}</Tooltip>
                   }
+                >
+                  <i className="fa fa-exclamation-circle text-warning" />
+                </OverlayTrigger>
+                {' '}
+              </span>
+            }
+            {(this.props.danger) &&
+              <span>
+                <OverlayTrigger
+                  placement="top"
+                  overlay={
+                    <Tooltip id={'error-tooltip'}>{this.props.danger}</Tooltip>
+                  }
                 >
                   <i className="fa fa-exclamation-circle text-danger" />
                 </OverlayTrigger>

diff --git a/superset/assets/javascripts/explore/components/controls/SelectControl.jsx b/superset/assets/javascripts/explore/components/controls/SelectControl.jsx
@@ -11,6 +11,7 @@ const propTypes = {
   choices: PropTypes.array,
   clearable: PropTypes.bool,
   description: PropTypes.string,
+  disabled: PropTypes.bool,
   freeForm: PropTypes.bool,
   isLoading: PropTypes.bool,
   label: PropTypes.string,
@@ -31,6 +32,7 @@ const defaultProps = {
   choices: [],
   clearable: true,
   description: null,
+  disabled: false,
   freeForm: false,
   isLoading: false,
   label: null,
@@ -123,6 +125,7 @@ export default class SelectControl extends React.PureComponent {
       optionRenderer: VirtualizedRendererWrap(this.props.optionRenderer),
       valueRenderer: this.props.valueRenderer,
       selectComponent: this.props.freeForm ? Creatable : Select,
+      disabled: this.props.disabled,
     };
     return (
       <div>

diff --git a/superset/assets/javascripts/explore/stores/controls.jsx b/superset/assets/javascripts/explore/stores/controls.jsx
@@ -1199,6 +1199,11 @@ export const controls = {
     default: '.3s',
     choices: D3_FORMAT_OPTIONS,
     description: D3_FORMAT_DOCS,
+    mapStateToProps: state => ({
+      warning: state.controls && state.controls.num_period_compare.value !== '' ?
+        t('When `Period Ratio` is set, the Y Axis Format is forced to `.1%`') : null,
+      disabled: state.controls && state.controls.num_period_compare.value !== '',
+    }),
   },
 
   y_axis_2_format: {

diff --git a/superset/assets/visualizations/nvd3_vis.js b/superset/assets/visualizations/nvd3_vis.js
@@ -379,7 +379,12 @@ export default function nvd3Vis(slice, payload) {
 
     const yAxisFormatter = d3FormatPreset(fd.y_axis_format);
     if (chart.yAxis && chart.yAxis.tickFormat) {
-      chart.yAxis.tickFormat(yAxisFormatter);
+      if (fd.num_period_compare) {
+        // When computing a "Period Ratio", we force a percentage format
+        chart.yAxis.tickFormat(d3.format('.1%'));
+      } else {
+        chart.yAxis.tickFormat(yAxisFormatter);
+      }
     }
     if (chart.y2Axis && chart.y2Axis.tickFormat) {
       chart.y2Axis.tickFormat(yAxisFormatter);