Bumping the JS libs to fix the build (#2616)

* bumping the js libs

* New linting rules

* More linting

* More

* Done linting

* npm >=4.5.0

* Bumping node

* Tweaking the build

* Fixing the damn build

* Fixing the apps

superset/assets/javascripts/explorev2/components/ChartContainer.jsx

@@ -34,6 +34,9 @@ const propTypes = {
   viz_type: PropTypes.string.isRequired,
   formData: PropTypes.object,
   latestQueryFormData: PropTypes.object,
+  queryResponse: PropTypes.object,
+  triggerRender: PropTypes.bool,
+  standalone: PropTypes.bool,
 };
 
 class ChartContainer extends React.PureComponent {
@@ -45,17 +48,6 @@ class ChartContainer extends React.PureComponent {
     };
   }
 
-  renderViz() {
-    this.props.actions.renderTriggered();
-    const mockSlice = this.getMockedSliceObject();
-    this.setState({ mockSlice });
-    try {
-      visMap[this.props.viz_type](mockSlice, this.props.queryResponse);
-    } catch (e) {
-      this.props.actions.chartRenderingFailed(e);
-    }
-  }
-
   componentDidUpdate(prevProps) {
     if (
         this.props.queryResponse &&
@@ -95,8 +87,8 @@ class ChartContainer extends React.PureComponent {
         },
         height: getHeight,
         show: () => { },
-        get: (n) => ($(this.state.selector).get(n)),
-        find: (classname) => ($(this.state.selector).find(classname)),
+        get: n => ($(this.state.selector).get(n)),
+        find: classname => ($(this.state.selector).find(classname)),
       },
 
       width: () => this.chartContainerRef.getBoundingClientRect().width,
@@ -149,6 +141,10 @@ class ChartContainer extends React.PureComponent {
     this.props.actions.removeChartAlert();
   }
 
+  runQuery() {
+    this.props.actions.runQuery(this.props.formData, true);
+  }
+
   renderChartTitle() {
     let title;
     if (this.props.slice) {
@@ -159,6 +155,17 @@ class ChartContainer extends React.PureComponent {
     return title;
   }
 
+  renderViz() {
+    this.props.actions.renderTriggered();
+    const mockSlice = this.getMockedSliceObject();
+    this.setState({ mockSlice });
+    try {
+      visMap[this.props.viz_type](mockSlice, this.props.queryResponse);
+    } catch (e) {
+      this.props.actions.chartRenderingFailed(e);
+    }
+  }
+
   renderAlert() {
     const msg = (
       <div>
@@ -204,7 +211,7 @@ class ChartContainer extends React.PureComponent {
         }
         <div
           id={this.props.containerId}
-          ref={ref => { this.chartContainerRef = ref; }}
+          ref={(ref) => { this.chartContainerRef = ref; }}
           className={this.props.viz_type}
           style={{
             opacity: loading ? '0.25' : '1',
@@ -213,9 +220,6 @@ class ChartContainer extends React.PureComponent {
       </div>
     );
   }
-  runQuery() {
-    this.props.actions.runQuery(this.props.formData, true);
-  }
 
   render() {
     if (this.props.standalone) {
@@ -262,17 +266,17 @@ class ChartContainer extends React.PureComponent {
                 {this.props.chartStatus === 'success' &&
                  this.props.queryResponse &&
                  this.props.queryResponse.is_cached &&
-                  <TooltipWrapper
-                    tooltip="Loaded from cache. Click to force refresh"
-                    label="cache-desc"
-                  >
-                    <Label
-                      style={{ fontSize: '10px', marginRight: '5px', cursor: 'pointer' }}
-                      onClick={this.runQuery.bind(this)}
-                    >
+                 <TooltipWrapper
+                   tooltip="Loaded from cache. Click to force refresh"
+                   label="cache-desc"
+                 >
+                   <Label
+                     style={{ fontSize: '10px', marginRight: '5px', cursor: 'pointer' }}
+                     onClick={this.runQuery.bind(this)}
+                   >
                       cached
                     </Label>
-                  </TooltipWrapper>
+                 </TooltipWrapper>
                 }
                 <Timer
                   startTime={this.props.chartUpdateStartTime}

superset/assets/javascripts/explorev2/components/Control.jsx

@@ -22,6 +22,7 @@ const propTypes = {
   actions: PropTypes.object.isRequired,
   name: PropTypes.string.isRequired,
   type: PropTypes.oneOf(controlTypes).isRequired,
+  hidden: PropTypes.bool,
   label: PropTypes.string.isRequired,
   choices: PropTypes.arrayOf(PropTypes.array),
   description: PropTypes.string,
@@ -40,6 +41,7 @@ const propTypes = {
 const defaultProps = {
   renderTrigger: false,
   validators: [],
+  hidden: false,
   validationErrors: [],
 };
 
@@ -64,7 +66,7 @@ export default class Control extends React.PureComponent {
     const validators = this.props.validators;
     const validationErrors = [];
     if (validators && validators.length > 0) {
-      validators.forEach(f => {
+      validators.forEach((f) => {
         const v = f(value);
         if (v) {
           validationErrors.push(v);

superset/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx

@@ -1,7 +1,6 @@
 /* eslint camelcase: 0 */
 import React, { PropTypes } from 'react';
 import { bindActionCreators } from 'redux';
-import * as actions from '../actions/exploreActions';
 import { connect } from 'react-redux';
 import { Panel, Alert } from 'react-bootstrap';
 import { sectionsToRender } from '../stores/visTypes';
@@ -9,6 +8,7 @@ import ControlPanelSection from './ControlPanelSection';
 import ControlRow from './ControlRow';
 import Control from './Control';
 import controls from '../stores/controls';
+import * as actions from '../actions/exploreActions';
 
 const propTypes = {
   actions: PropTypes.object.isRequired,
@@ -54,7 +54,7 @@ class ControlPanelsContainer extends React.Component {
               />
             </Alert>
           }
-          {this.sectionsToRender().map((section) => (
+          {this.sectionsToRender().map(section => (
             <ControlPanelSection
               key={section.label}
               label={section.label}

superset/assets/javascripts/explorev2/components/DisplayQueryButton.jsx

@@ -1,8 +1,9 @@
 import React, { PropTypes } from 'react';
-import ModalTrigger from './../../components/ModalTrigger';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import { github } from 'react-syntax-highlighter/dist/styles';
 
+import ModalTrigger from './../../components/ModalTrigger';
+
 const $ = window.$ = require('jquery');
 
 const propTypes = {
@@ -37,9 +38,9 @@ export default class DisplayQueryButton extends React.PureComponent {
         url: this.props.queryEndpoint,
         success: (data) => {
           const modalBody = data.language ?
-            <SyntaxHighlighter language={data.language} style={github}>
+            (<SyntaxHighlighter language={data.language} style={github}>
               {data.query}
-            </SyntaxHighlighter>
+            </SyntaxHighlighter>)
             :
             <pre>{data.query}</pre>;
           this.setState({ modalBody });

superset/assets/javascripts/explorev2/components/EmbedCodeButton.jsx

@@ -1,6 +1,6 @@
 import React, { PropTypes } from 'react';
-import CopyToClipboard from './../../components/CopyToClipboard';
 import { Popover, OverlayTrigger } from 'react-bootstrap';
+import CopyToClipboard from './../../components/CopyToClipboard';
 
 const propTypes = {
   slice: PropTypes.object.isRequired,
@@ -56,14 +56,13 @@ export default class EmbedCodeButton extends React.Component {
                 rows="4"
                 readOnly
                 className="form-control input-sm"
-              >
-              </textarea>
+              />
             </div>
             <div className="col-sm-2">
               <CopyToClipboard
                 shouldShowText={false}
                 text={html}
-                copyNode={<i className="fa fa-clipboard" title="Copy to clipboard"></i>}
+                copyNode={<i className="fa fa-clipboard" title="Copy to clipboard" />}
               />
             </div>
           </div>
@@ -112,7 +111,7 @@ export default class EmbedCodeButton extends React.Component {
         overlay={this.renderPopover()}
       >
         <span className="btn btn-default btn-sm">
-          <i className="fa fa-code"></i>&nbsp;
+          <i className="fa fa-code" />&nbsp;
         </span>
       </OverlayTrigger>
     );

superset/assets/javascripts/explorev2/components/ExploreActionButtons.jsx

@@ -27,8 +27,9 @@ export default function ExploreActionButtons({ canDownload, slice, query, queryE
           className="btn btn-default btn-sm"
           title="Export to .json"
           target="_blank"
+          rel="noopener noreferrer"
         >
-          <i className="fa fa-file-code-o"></i> .json
+          <i className="fa fa-file-code-o" /> .json
         </a>
 
         <a
@@ -36,8 +37,9 @@ export default function ExploreActionButtons({ canDownload, slice, query, queryE
           className={exportToCSVClasses}
           title="Export to .csv format"
           target="_blank"
+          rel="noopener noreferrer"
         >
-          <i className="fa fa-file-text-o"></i> .csv
+          <i className="fa fa-file-text-o" /> .csv
         </a>
 
         <DisplayQueryButton

superset/assets/javascripts/explorev2/components/ExploreViewContainer.jsx

@@ -1,19 +1,19 @@
 /* eslint camelcase: 0 */
 import React, { PropTypes } from 'react';
 import { bindActionCreators } from 'redux';
-import * as actions from '../actions/exploreActions';
 import { connect } from 'react-redux';
 import ChartContainer from './ChartContainer';
 import ControlPanelsContainer from './ControlPanelsContainer';
 import SaveModal from './SaveModal';
 import QueryAndSaveBtns from './QueryAndSaveBtns';
 import { getExploreUrl } from '../exploreUtils';
+import * as actions from '../actions/exploreActions';
 import { getFormDataFromControls } from '../stores/store';
 
 const propTypes = {
   actions: PropTypes.object.isRequired,
   datasource_type: PropTypes.string.isRequired,
-  chartStatus: PropTypes.string.isRequired,
+  chartStatus: PropTypes.string,
   controls: PropTypes.object.isRequired,
   forcedHeight: PropTypes.string,
   form_data: PropTypes.object.isRequired,
@@ -110,7 +110,7 @@ class ExploreViewContainer extends React.Component {
           <div key={controlName}>
             <strong>{`[ ${control.label} ] `}</strong>
             {control.validationErrors.join('. ')}
-          </div>
+          </div>,
         );
       }
     }
@@ -143,7 +143,7 @@ class ExploreViewContainer extends React.Component {
           overflow: 'hidden',
         }}
       >
-      {this.state.showModal &&
+        {this.state.showModal &&
         <SaveModal
           onHide={this.toggleModal.bind(this)}
           actions={this.props.actions}

superset/assets/javascripts/explorev2/components/QueryAndSaveBtns.jsx

@@ -1,8 +1,9 @@
 import React, { PropTypes } from 'react';
 import { ButtonGroup, OverlayTrigger, Tooltip } from 'react-bootstrap';
-import Button from '../../components/Button';
 import classnames from 'classnames';
 
+import Button from '../../components/Button';
+
 const propTypes = {
   canAdd: PropTypes.string.isRequired,
   onQuery: PropTypes.func.isRequired,
@@ -54,7 +55,7 @@ export default function QueryAndSaveBtns(
           disabled={saveButtonDisabled}
           onClick={onSave}
         >
-          <i className="fa fa-plus-circle"></i> Save as
+          <i className="fa fa-plus-circle" /> Save as
         </Button>
       </ButtonGroup>
       {errorMessage &&

superset/assets/javascripts/explorev2/components/SaveModal.jsx

@@ -146,7 +146,7 @@ class SaveModal extends React.Component {
               checked={this.state.action === 'overwrite'}
               onChange={this.changeAction.bind(this, 'overwrite')}
             >
-            {`Overwrite slice ${this.props.slice.slice_name}`}
+              {`Overwrite slice ${this.props.slice.slice_name}`}
             </Radio>
           }
 

superset/assets/javascripts/explorev2/components/URLShortLinkButton.jsx

@@ -32,11 +32,11 @@ export default class URLShortLinkButton extends React.Component {
       <Popover id="shorturl-popover">
         <CopyToClipboard
           text={this.state.shortUrl}
-          copyNode={<i className="fa fa-clipboard" title="Copy to clipboard"></i>}
+          copyNode={<i className="fa fa-clipboard" title="Copy to clipboard" />}
         />
         &nbsp;&nbsp;
         <a href={`mailto:?Subject=Superset%20Slice%20&Body=${emailBody}`}>
-          <i className="fa fa-envelope"></i>
+          <i className="fa fa-envelope" />
         </a>
       </Popover>
     );
@@ -52,7 +52,7 @@ export default class URLShortLinkButton extends React.Component {
         overlay={this.renderPopover()}
       >
         <span className="btn btn-default btn-sm">
-          <i className="fa fa-link"></i>&nbsp;
+          <i className="fa fa-link" />&nbsp;
         </span>
       </OverlayTrigger>
     );

superset/assets/javascripts/explorev2/components/controls/Filter.jsx

@@ -1,9 +1,10 @@
-const $ = window.$ = require('jquery');
 import React, { PropTypes } from 'react';
 import Select from 'react-select';
 import { Button, Row, Col } from 'react-bootstrap';
 import SelectControl from './SelectControl';
 
+const $ = window.$ = require('jquery');
+
 const operatorsArr = [
   { val: 'in', type: 'array', useSelect: true, multi: true },
   { val: 'not in', type: 'array', useSelect: true, multi: true },
@@ -17,7 +18,7 @@ const operatorsArr = [
   { val: 'LIKE', type: 'string', datasourceTypes: ['table'] },
 ];
 const operators = {};
-operatorsArr.forEach(op => {
+operatorsArr.forEach((op) => {
   operators[op.val] = op;
 });
 

superset/assets/javascripts/explorev2/components/controls/HiddenControl.jsx

@@ -13,11 +13,9 @@ const defaultProps = {
   onChange: () => {},
 };
 
-export default class HiddenControl extends React.PureComponent {
-  render() {
-    // This wouldn't be necessary but might as well
-    return <FormControl type="hidden" value={this.props.value} />;
-  }
+export default function HiddenControl(props) {
+  // This wouldn't be necessary but might as well
+  return <FormControl type="hidden" value={props.value} />;
 }
 
 HiddenControl.propTypes = propTypes;

superset/assets/javascripts/explorev2/components/controls/SelectControl.jsx

@@ -42,13 +42,13 @@ export default class SelectControl extends React.PureComponent {
     let optionValue = opt ? opt.value : null;
     // if multi, return options values as an array
     if (this.props.multi) {
-      optionValue = opt ? opt.map((o) => o.value) : null;
+      optionValue = opt ? opt.map(o => o.value) : null;
     }
     this.props.onChange(optionValue);
   }
   getOptions(props) {
     // Accepts different formats of input
-    const options = props.choices.map(c => {
+    const options = props.choices.map((c) => {
       let option;
       if (Array.isArray(c)) {
         const label = c.length > 1 ? c[1] : c[0];
@@ -75,7 +75,7 @@ export default class SelectControl extends React.PureComponent {
         if (!Array.isArray(valuesToAdd)) {
           valuesToAdd = [valuesToAdd];
         }
-        valuesToAdd.forEach(v => {
+        valuesToAdd.forEach((v) => {
           if (values.indexOf(v) < 0) {
             options.push({ value: v, label: v });
           }