Lint sources

Author: stefanv

.eslintrc.yaml

@@ -0,0 +1,26 @@
+---
+parser: babel-eslint
+env:
+  browser: true
+extends: [airbnb, plugin:react/recommended]
+plugins: [import, react]
+settings:
+  import/resolver:
+    node: {}
+    webpack:
+      config: webpack.config.js
+
+rules:
+  camelcase: off
+  comma-dangle: [1, only-multiline]
+  no-else-return: 0
+  no-param-reassign: 0
+  quotes: 0
+  space-infix-ops: 0
+  no-multiple-empty-lines: ["error", { "max": 2, "maxEOF": 0 }]
+  no-underscore-dangle: [2, {"allowAfterThis": true}]
+  object-curly-newline: [2, {"consistent": true}]
+  operator-linebreak: [1, after]
+  jsx-a11y/click-events-have-key-events: 0
+  jsx-a11y/label-has-associated-control: 0
+  jsx-a11y/control-has-associated-label: 0

static/js/components/Examples.jsx

@@ -10,11 +10,14 @@ class Examples extends React.Component {
 
   _handleSubmit(event) {
     event.preventDefault();
-    this.props.compute(this.n.value);
+
+    const { compute } = this.props;
+    compute(this.n.value);
   }
 
   render() {
-    const resultItems = this.props.results.map((result, index) => (
+    const { results } = this.props;
+    const resultItems = results.map((result, index) => (
       // eslint-disable-next-line react/no-array-index-key
       <li key={index}>{result.join(", ")}</li>
     ));
@@ -25,7 +28,13 @@ class Examples extends React.Component {
 
         <form onSubmit={this._handleSubmit}>
           Calculate squares of &nbsp;
-          <input type="text" defaultValue="5" size="2" ref={(n) => { this.n = n; }} /> numbers. &nbsp;
+          <input
+            type="text"
+            defaultValue="5"
+            size="2"
+            ref={(n) => { this.n = n; }}
+          />
+          numbers. &nbsp;
           <input type="submit" value="Go!" />
         </form>
 

static/js/components/Main.jsx

@@ -7,6 +7,7 @@ import messageHandler from 'baselayer/MessageHandler';
 import WebSocket from 'baselayer/components/WebSocket';
 import { Notifications, showNotification } from 'baselayer/components/Notifications';
 
+import * as API from 'baselayer/API';
 import configureStore from '../store';
 import '../customMessageHandler';
 
@@ -19,7 +20,6 @@ import Examples from '../containers/Examples';
 
 import * as Action from '../actions';
 
-import * as API from 'baselayer/API';
 
 // Set up store and message handling
 
@@ -38,18 +38,19 @@ class MainContent extends React.Component {
   }
 
   render() {
+    const { root } = this.props;
     return (
       <div>
 
         <div style={{ float: "right" }}>
           <b>WebSocket connection: </b>
           <WebSocket
-            url={`${window.location.protocol === 'https:' ? 'wss' : 'ws'}://${this.props.root}websocket`}
-            auth_url={`${window.location.protocol}//${this.props.root}baselayer/socket_auth_token`}
+            url={`${window.location.protocol === 'https:' ? 'wss' : 'ws'}://${root}websocket`}
+            auth_url={`${window.location.protocol}//${root}baselayer/socket_auth_token`}
             messageHandler={messageHandler}
             dispatch={store.dispatch}
-      />
-      <Profile />
+          />
+          <Profile />
         </div>
 
         <Notifications style={{}} />
@@ -60,6 +61,7 @@ class MainContent extends React.Component {
         <h3>Example of a frontend-generated notification</h3>
 
         <button
+          type="button"
           href="#"
           onClick={() => store.dispatch(showNotification("Hello from Baselayer"))}
         >
@@ -69,6 +71,7 @@ class MainContent extends React.Component {
         <h3>Example of a backend-generated notification</h3>
 
         <button
+          type="button"
           href="#"
           onClick={() => { store.dispatch(API.GET('/push_notification', 'PUSH_NOTIFICATION')); }}
         >

static/js/components/Profile.jsx

@@ -2,7 +2,11 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 const Profile = ({ username }) => (
-  <div><b>Username:</b> { username }</div>
+  <div>
+    <b>Username:</b>
+    {' '}
+    { username }
+  </div>
 );
 
 Profile.propTypes = {

static/js/containers/Examples.jsx

@@ -5,15 +5,15 @@ import * as API from 'baselayer/API';
 import Examples from '../components/Examples';
 
 
-const mapStateToProps = (state, ownProps) => (
+const mapStateToProps = (state) => (
   {
     results: state.examples.results
   }
 );
 
-const mapDispatchToProps = (dispatch, ownProps) => (
+const mapDispatchToProps = (dispatch) => (
   {
-    compute: n => dispatch(
+    compute: (n) => dispatch(
       API.POST('/example_compute', 'template_app/SEND_COMPUTE', { n })
     )
   }

static/js/containers/Profile.jsx

@@ -2,7 +2,7 @@ import { connect } from 'react-redux';
 
 import Profile from '../components/Profile';
 
-const mapStateToProps = (state, ownProps) => (
+const mapStateToProps = (state) => (
   state.profile
 );
 

static/js/store.js

@@ -18,7 +18,7 @@ export default function configureStore(preloadedState) {
       applyMiddleware(thunk, logger),
       // Enable the Chrome developer plugin
       // https://github.com/zalmoxisus/redux-devtools-extension
-      window.devToolsExtension ? window.devToolsExtension() : f => f,
+      window.devToolsExtension ? window.devToolsExtension() : (f) => f,
     )
   );
 }