Upgrade eslint and fix errors

* Single to double quotes
* let statements in case statements
* Indentation
* No setState in componentDidMount

Change-Id: Ifc6fc7caace90cb9bb2b25531f3cba981a293ad9

.eslintrc

@@ -11,13 +11,12 @@
     "quotes": [ 2, "single" ],
     "quote-props": [1, "consistent-as-needed"],
     "radix": 0,
-    "react/display-name": [1, { "acceptTranspilerName": true }],
     "react/jsx-boolean-value": [1, "never"],
     "react/jsx-curly-spacing": [1, "never"],
     "react/jsx-no-duplicate-props": 1,
     "react/jsx-no-undef": 1,
-    "react/jsx-quotes": 1,
+    "jsx-quotes": [1, "prefer-double"],
-    "react/jsx-sort-prop-types": 1,
+    "react/sort-prop-types": 1,
     "react/jsx-sort-props": 0,
     "react/jsx-uses-react": 1,
     "react/jsx-uses-vars": 1,

package.json

@@ -39,10 +39,10 @@
     "xhr2": "~0.1.2"
   },
   "devDependencies": {
-    "babel-eslint": "^4.1.6",
+    "babel-eslint": "6.0.2",
     "browser-sync": "~2.7.12",
-    "eslint": "~1.1.0",
+    "eslint": "2.7.0",
-    "eslint-plugin-react": "~3.2.2",
+    "eslint-plugin-react": "4.3.0",
     "gulp": "~3.9.0",
     "gulp-less": "~3.0.3",
     "gulp-rename": "~1.2.2",

src/js/components/deployment-plan/DeploymentStatus.js

@@ -18,7 +18,7 @@ export default class DeploymentStatus extends React.Component {
     };
   }
 
-  componentDidMount() {
+  componentWillMount() {
     let intervalId = setInterval(() => {
       this.props.fetchStacks();
     }, 5000);

src/js/components/environment_configuration/EnvironmentConfiguration.js

@@ -13,6 +13,7 @@ import Tab from '../ui/Tab';
 import TabPane from '../ui/TabPane';
 
 class EnvironmentConfiguration extends React.Component {
+
   constructor() {
     super();
     this.state = {
@@ -190,9 +191,11 @@ export default connect(mapStateToProps, mapDispatchToProps)(EnvironmentConfigura
 */
 Formsy.addValidationRule('requiresEnvironments',
                          function (values, value, requiredEnvironmentFieldNames) {
-  if(value) {
+                           if (value) {
-    return !_.filter(_.values(_.pick(values, requiredEnvironmentFieldNames)),
+                             return !_.filter(
-                     function(val){return val === false;}).length;
+                               _.values(
-  }
+                                 _.pick(values, requiredEnvironmentFieldNames)
-  return true;
+                               ), function(val){return val === false;}).length;
-});
+                           }
+                           return true;
+                         });

src/js/components/nodes/RegisterNodesDialog.js

@@ -100,7 +100,7 @@ class RegisterNodesDialog extends React.Component {
     // TODO(jtomasek): fix the name setting here
     let nodeName = node.driver_info.get('ssh_address') ||
                    node.driver_info.get('ipmi_address') ||
-                   `Undefined Node`;
+                   'Undefined Node';
     let validationIconClasses = ClassNames({
       'pficon': true,
       'pficon-error-circle-o': !node.valid

src/js/components/notifications/NotificationsToaster.js

@@ -93,7 +93,7 @@ export default class NotificationsToaster extends React.Component {
 
   render() {
     return this.state.toasterNotification ? (
-      <div className='notification-toaster col-lg-5 col-md-6 col-sm-8 col-xs-12'>
+      <div className="notification-toaster col-lg-5 col-md-6 col-sm-8 col-xs-12">
         <Notification
           title={this.state.toasterNotification.title}
           message={this.state.toasterNotification.message}

src/js/components/parameters/ParametersTabPane.js

@@ -51,7 +51,7 @@ export default class ParametersTabPane extends React.Component {
         <HorizontalInput key={index}
                                name={parameter.name}
                                title={parameter.Label}
-                               type='number'
+                               type="number"
                                min={0}
                                description={parameter.Description}
                                value={parameter.Default}

src/js/components/plan/PlanFileInput.js

@@ -47,14 +47,14 @@ class PlanFileInput extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/dropdown/Dropdown.js

@@ -36,7 +36,7 @@ export default class Dropdown extends React.Component {
         <div className={ClassNames('dropdown btn-group', dropdownClasses, this.props.className)}>
           {otherChildren}
           {React.cloneElement(toggle, { toggleDropdown: this.toggleDropdown.bind(this) })}
-          <ul className="dropdown-menu" role="menu" ref='menu'>
+          <ul className="dropdown-menu" role="menu" ref="menu">
             {items}
           </ul>
         </div>

src/js/components/ui/forms/GenericCheckBox.js

@@ -10,14 +10,14 @@ class GenericCheckBox extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/forms/GenericInput.js

@@ -10,14 +10,14 @@ class GenericInput extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/forms/GroupedCheckBox.js

@@ -11,14 +11,14 @@ class GroupedCheckBox extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/forms/HorizontalCheckBox.js

@@ -10,7 +10,7 @@ class HorizontalCheckBox extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 

src/js/components/ui/forms/HorizontalInput.js

@@ -11,14 +11,14 @@ class HorizontalInput extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <small className='help-block'>{errorMessage}</small>
+      <small className="help-block">{errorMessage}</small>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/forms/HorizontalSelect.js

@@ -10,14 +10,14 @@ class HorizontalSelect extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 
@@ -38,7 +38,7 @@ class HorizontalSelect extends React.Component {
           <select name={this.props.name}
                   ref={this.props.name}
                   id={this.props.name}
-                  className='form-control'
+                  className="form-control"
                   onChange={this.changeValue.bind(this)}
                   value={this.props.getValue()}>
             {options}

src/js/components/ui/forms/HorizontalTextarea.js

@@ -10,14 +10,14 @@ class HorizontalTextarea extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 
   renderDescription() {
     let description = this.props.description;
     return description ? (
-      <small className='help-block'>{description}</small>
+      <small className="help-block">{description}</small>
     ) : false;
   }
 

src/js/components/ui/forms/LoginInput.js

@@ -9,7 +9,7 @@ class LoginInput extends React.Component {
   renderErrorMessage() {
     let errorMessage = this.props.getErrorMessage();
     return errorMessage ? (
-      <span className='help-block'>{errorMessage}</span>
+      <span className="help-block">{errorMessage}</span>
     ) : false;
   }
 

src/js/reducers/notificationsReducer.js

@@ -7,11 +7,13 @@ const initialState = Map({
 });
 
 export default function notificationsReducer(state = initialState, action) {
+
   switch(action.type) {
 
-  case NotificationConstants.NOTIFY:
+  case NotificationConstants.NOTIFY: {
     const notification = action.payload;
     return state.update('all', all => all.set(notification.id, notification));
+  }
 
   case NotificationConstants.REMOVE_NOTIFICATION:
     return state.update('all', all => all.delete(action.payload));

src/js/reducers/parametersReducer.js

@@ -15,7 +15,7 @@ export default function parametersReducer(state = initialState, action) {
             .set('form', Map({ formErrors: List(), formFieldErrors: Map() }))
             .set('parameters', Map());
 
-  case ParametersConstants.FETCH_PARAMETERS_SUCCESS:
+  case ParametersConstants.FETCH_PARAMETERS_SUCCESS: {
     let nestedParams = deepAddParameterRecords(action.payload.NestedParameters);
     let params = deepAddParameterRecords(action.payload.Parameters);
     return state
@@ -29,6 +29,7 @@ export default function parametersReducer(state = initialState, action) {
               NestedParameters: nestedParams,
               Parameters: params
             }));
+  }
 
   case ParametersConstants.FETCH_PARAMETERS_FAILED:
     return state

src/js/reducers/plansReducer.js

@@ -9,7 +9,6 @@ import PlansConstants from '../constants/PlansConstants';
 const initialState = new InitialPlanState;
 
 export default function plansReducer(state = initialState, action) {
-
   switch(action.type) {
 
   case PlansConstants.REQUEST_PLAN:
@@ -35,7 +34,7 @@ export default function plansReducer(state = initialState, action) {
   case PlansConstants.REQUEST_PLANS:
     return state.set('isFetchingPlans', true);
 
-  case PlansConstants.RECEIVE_PLANS:
+  case PlansConstants.RECEIVE_PLANS: {
     let planData = {};
     action.payload.result.forEach(name => {
       planData[name] = new Plan(action.payload.entities.plan[name]);
@@ -43,6 +42,7 @@ export default function plansReducer(state = initialState, action) {
     return state
             .set('isFetchingPlans', false)
             .set('all', Map(planData));
+  }
 
   case PlansConstants.PLAN_CHOSEN:
     return state.set('currentPlanName', action.payload);

src/js/reducers/rolesReducer.js

@@ -11,16 +11,18 @@ const initialState = Map({
 });
 
 export default function rolesReducer(state = initialState, action) {
+
   switch(action.type) {
 
   case RolesConstants.FETCH_ROLES_PENDING:
     return state.set('isFetching', true);
 
-  case RolesConstants.FETCH_ROLES_SUCCESS:
+  case RolesConstants.FETCH_ROLES_SUCCESS: {
     const roles = action.payload || {};
     return state.set('roles', fromJS(roles).map(role => new Role(role)))
                 .set('isFetching', false)
                 .set('loaded', true);
+  }
 
   case RolesConstants.FETCH_ROLES_FAILED:
     return state.set('roles', Map())

src/js/services/KeystoneApiErrorHandler.js

@@ -10,13 +10,14 @@ export default class KeystoneApiErrorHandler extends BaseHttpRequestErrorHandler
         message: 'Connection to Keystone is not available'
       });
       break;
-    case 401:
+    case 401: {
       let error = JSON.parse(xmlHttpRequestError.responseText).error;
       errors.push({
         title: 'Unauthorized',
         message: error.message
       });
       break;
+    }
     default:
       break;
     }

src/js/services/ValidationsApiErrorHandler.js

@@ -10,13 +10,14 @@ export default class ValidationsApiErrorHandler extends BaseHttpRequestErrorHand
         message: 'Connection to Validations API is not available'
       });
       break;
-    case 401:
+    case 401: {
       let error = JSON.parse(xmlHttpRequestError.responseText).error;
       errors.push({
         title: 'Unauthorized',
         message: error.message
       });
       break;
+    }
     default:
       break;
     }