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/dashboard/Dashboard.jsx

@@ -1,18 +1,19 @@
-const $ = window.$ = require('jquery');
-const jQuery = window.jQuery = require('jquery'); // eslint-disable-line
-const px = require('../modules/superset');
-const d3 = require('d3');
-const urlLib = require('url');
-const utils = require('../modules/utils');
-const { Alert } = require('react-bootstrap');
-
 import React from 'react';
 import { render } from 'react-dom';
+import d3 from 'd3';
+import { Alert } from 'react-bootstrap';
+
 import GridLayout from './components/GridLayout';
 import Header from './components/Header';
+import { appSetup } from '../common';
 
-require('bootstrap');
-require('../../stylesheets/dashboard.css');
+import '../../stylesheets/dashboard.css';
+
+const px = require('../modules/superset');
+const urlLib = require('url');
+const utils = require('../modules/utils');
+
+appSetup();
 
 export function getInitialState(boostrapData) {
   const dashboard = Object.assign({}, utils.controllerInterface, boostrapData.dashboard_data);
@@ -20,7 +21,7 @@ export function getInitialState(boostrapData) {
 
   dashboard.posDict = {};
   if (dashboard.position_json) {
-    dashboard.position_json.forEach(position => {
+    dashboard.position_json.forEach((position) => {
       dashboard.posDict[position.slice_id] = position;
     });
   }
@@ -52,19 +53,19 @@ function renderAlert() {
         button on the top right to save your changes.
       </Alert>
     </div>,
-    document.getElementById('alert-container')
+    document.getElementById('alert-container'),
   );
 }
 
 function initDashboardView(dashboard) {
   render(
     <Header dashboard={dashboard} />,
-    document.getElementById('dashboard-header')
+    document.getElementById('dashboard-header'),
   );
   // eslint-disable-next-line no-param-reassign
   dashboard.reactGridLayout = render(
     <GridLayout dashboard={dashboard} />,
-    document.getElementById('grid-container')
+    document.getElementById('grid-container'),
   );
 
   // Displaying widget controls on hover
@@ -74,7 +75,7 @@ function initDashboardView(dashboard) {
     },
     function () {
       $(this).find('.chart-controls').fadeOut(300);
-    }
+    },
   );
   $('div.grid-container').css('visibility', 'visible');
 
@@ -100,7 +101,7 @@ export function dashboardContainer(dashboard, datasources) {
     filters: {},
     init() {
       this.sliceObjects = [];
-      dashboard.slices.forEach(data => {
+      dashboard.slices.forEach((data) => {
         if (data.error) {
           const html = `<div class="alert alert-danger">${data.error}</div>`;
           $(`#slice_${data.slice_id}`).find('.token').html(html);
@@ -235,7 +236,7 @@ export function dashboardContainer(dashboard, datasources) {
       const dash = this;
       const maxRandomDelay = Math.max(interval * 0.2, 5000);
       const refreshAll = () => {
-        dash.sliceObjects.forEach(slice => {
+        dash.sliceObjects.forEach((slice) => {
           const force = !dash.firstLoad;
           setTimeout(() => {
             slice.render(force);
@@ -258,7 +259,7 @@ export function dashboardContainer(dashboard, datasources) {
     },
     refreshExcept(sliceId) {
       const immune = this.metadata.filter_immune_slices || [];
-      this.sliceObjects.forEach(slice => {
+      this.sliceObjects.forEach((slice) => {
         if (slice.data.slice_id !== sliceId && immune.indexOf(slice.data.slice_id) === -1) {
           slice.render();
           const sliceSeletor = $(`#${slice.data.slice_id}-cell`);

superset/assets/javascripts/dashboard/components/CodeModal.jsx

@@ -9,14 +9,13 @@ const propTypes = {
 };
 
 const defaultProps = {
+  codeCallback: () => {},
 };
 
 export default class CodeModal extends React.PureComponent {
   constructor(props) {
     super(props);
-    this.state = {
-      refreshFrequency: props.initialRefreshFrequency,
-    };
+    this.state = { code: props.code };
   }
   beforeOpen() {
     let code = this.props.code;

superset/assets/javascripts/dashboard/components/Controls.jsx

@@ -1,8 +1,6 @@
-const $ = window.$ = require('jquery');
-
 import React from 'react';
-
 import { ButtonGroup } from 'react-bootstrap';
+
 import Button from '../../components/Button';
 import CssEditor from './CssEditor';
 import RefreshIntervalModal from './RefreshIntervalModal';
@@ -10,6 +8,8 @@ import SaveModal from './SaveModal';
 import CodeModal from './CodeModal';
 import SliceAdder from './SliceAdder';
 
+const $ = window.$ = require('jquery');
+
 const propTypes = {
   dashboard: React.PropTypes.object.isRequired,
 };
@@ -22,14 +22,9 @@ class Controls extends React.PureComponent {
       cssTemplates: [],
     };
   }
-  refresh() {
-    this.props.dashboard.sliceObjects.forEach((slice) => {
-      slice.render(true);
-    });
-  }
   componentWillMount() {
     $.get('/csstemplateasyncmodelview/api/read', (data) => {
-      const cssTemplates = data.result.map((row) => ({
+      const cssTemplates = data.result.map(row => ({
         value: row.template_name,
         css: row.css,
         label: row.template_name,
@@ -37,6 +32,11 @@ class Controls extends React.PureComponent {
       this.setState({ cssTemplates });
     });
   }
+  refresh() {
+    this.props.dashboard.sliceObjects.forEach((slice) => {
+      slice.render(true);
+    });
+  }
   changeCss(css) {
     this.setState({ css });
     this.props.dashboard.onChange();
@@ -99,7 +99,7 @@ class Controls extends React.PureComponent {
         <Button
           onClick={() => { window.location = emailLink; }}
         >
-          <i className="fa fa-envelope"></i>
+          <i className="fa fa-envelope" />
         </Button>
       </ButtonGroup>
     );

superset/assets/javascripts/dashboard/components/CssEditor.jsx

@@ -1,12 +1,11 @@
 import React from 'react';
-
-import ModalTrigger from '../../components/ModalTrigger';
 import Select from 'react-select';
 
 import AceEditor from 'react-ace';
 import 'brace/mode/css';
 import 'brace/theme/github';
 
+import ModalTrigger from '../../components/ModalTrigger';
 
 const propTypes = {
   initialCss: React.PropTypes.string,

superset/assets/javascripts/dashboard/components/GridLayout.jsx

@@ -1,10 +1,12 @@
-import $ from 'jquery';
 import React, { PropTypes } from 'react';
 import { Responsive, WidthProvider } from 'react-grid-layout';
+import $ from 'jquery';
+
 import SliceCell from './SliceCell';
 
 require('react-grid-layout/css/styles.css');
 require('react-resizable/css/styles.css');
+
 const ResponsiveReactGridLayout = WidthProvider(Responsive);
 
 const propTypes = {

superset/assets/javascripts/dashboard/components/Header.jsx

@@ -25,7 +25,7 @@ class Header extends React.PureComponent {
           </h1>
         </div>
         <div className="pull-right" style={{ marginTop: '35px' }}>
-        {!this.props.dashboard.standalone_mode &&
+          {!this.props.dashboard.standalone_mode &&
           <Controls dashboard={dashboard} />
         }
         </div>

superset/assets/javascripts/dashboard/components/RefreshIntervalModal.jsx

@@ -1,7 +1,6 @@
 import React from 'react';
-
-import ModalTrigger from '../../components/ModalTrigger';
 import Select from 'react-select';
+import ModalTrigger from '../../components/ModalTrigger';
 
 const propTypes = {
   triggerNode: React.PropTypes.node.isRequired,

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

@@ -1,11 +1,10 @@
-const $ = window.$ = require('jquery');
-
 import React from 'react';
 import { Button, FormControl, FormGroup, Radio } from 'react-bootstrap';
 import { getAjaxErrorMsg, showModal } from '../../modules/utils';
-
 import ModalTrigger from '../../components/ModalTrigger';
 
+const $ = window.$ = require('jquery');
+
 const propTypes = {
   css: React.PropTypes.string,
   dashboard: React.PropTypes.object.isRequired,

superset/assets/javascripts/dashboard/components/SliceAdder.jsx

@@ -1,7 +1,9 @@
 import $ from 'jquery';
 import React, { PropTypes } from 'react';
 import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
+
 import ModalTrigger from '../../components/ModalTrigger';
+
 require('react-bootstrap-table/css/react-bootstrap-table.css');
 
 const propTypes = {
@@ -39,7 +41,7 @@ class SliceAdder extends React.Component {
     this.slicesRequest = $.ajax({
       url: uri,
       type: 'GET',
-      success: response => {
+      success: (response) => {
         // Prepare slice data for table
         const slices = response.result.map(slice => ({
           id: slice.id,
@@ -54,7 +56,7 @@ class SliceAdder extends React.Component {
           slicesLoaded: true,
         });
       },
-      error: error => {
+      error: (error) => {
         this.errored = true;
         this.setState({
           errorMsg: this.props.dashboard.getAjaxErrorMsg(error),

superset/assets/javascripts/dashboard/components/SliceCell.jsx

@@ -1,3 +1,4 @@
+/* eslint-disable react/no-danger */
 import React, { PropTypes } from 'react';
 
 const propTypes = {
@@ -62,9 +63,7 @@ function SliceCell({ expandedSlices, removeSlice, slice }) {
           expandedSlices[String(slice.slice_id)] ? {} : { display: 'none' }
         }
         dangerouslySetInnerHTML={{ __html: slice.description_markeddown }}
-      >
-
-      </div>
+      />
       <div className="row chart-container">
         <input type="hidden" value="false" />
         <div id={'token_' + slice.slice_id} className="token col-md-12">
@@ -76,8 +75,7 @@ function SliceCell({ expandedSlices, removeSlice, slice }) {
           <div
             id={'con_' + slice.slice_id}
             className={`slice_container ${slice.form_data.viz_type}`}
-          >
-          </div>
+          />
         </div>
       </div>
     </div>