Fixed linting errors and turned some of the newer ones off temporarily

Remove SilverStripeComponent (+1 squashed commit)
Squashed commits:
[8fee2e9] WIP DO NOT MERGE update eslint version on webpack-config

.eslintrc.js

@@ -0,0 +1,86 @@
+const todo = {
+  "react/jsx-filename-extension": [
+    "off"
+  ],
+  "react/require-default-props": [
+    "off"
+  ],
+  "react/prop-types": [
+    "off"
+  ],
+  "comma-dangle": [
+    "off"
+  ],
+  "arrow-parens": [
+    "off"
+  ],
+  "indent": [
+    "off"
+  ],
+  "jsx-a11y/iframe-has-title": [
+    "off"
+  ],
+};
+
+module.exports = {
+  "extends": "airbnb",
+  "env": {
+    "jasmine": true
+  },
+  "rules": Object.assign({},
+    todo,
+    {
+    "no-underscore-dangle": [
+      "off",
+      {
+        "allow": [
+          "_t"
+        ],
+        "allowAfterThis": true
+      }
+    ],
+    "no-unused-vars": [
+      "error",
+      {
+        "vars": "local"
+      }
+    ],
+    "react/forbid-prop-types": [
+      "off"
+    ],
+    "import/prefer-default-export": [
+      "off"
+    ],
+    "import/first": [
+      "off"
+    ],
+    "class-methods-use-this": [
+      "off"
+    ],
+    "no-useless-escape": [
+      "off"
+    ],
+    "react/no-danger": [
+      "error"
+    ],
+  }),
+  "settings": {
+    "import/extensions": [
+      ".js",
+      ".jsx"
+    ],
+    "import/resolver": {
+      "node": {
+        "extensions": [
+          ".js",
+          ".jsx"
+        ],
+        "moduleDirectory": [
+          ".",
+          "client/src",
+          "node_modules"
+        ]
+      }
+    }
+  }
+};

client/src/boot/BootRoutes.js

@@ -1,6 +1,6 @@
-/* global window */
+/* global window, document */
 
-import $ from 'jQuery';
+import $ from 'jquery';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Router as ReactRouter, useRouterHistory } from 'react-router';
@@ -20,7 +20,6 @@ import getFormState from 'lib/getFormState';
  * Bootstraps routes
  */
 class BootRoutes {
-
   /**
    * @param {Object} store Redux store
    * @param {Object} client The Apollo client
@@ -86,7 +85,7 @@ class BootRoutes {
     reactRouteRegister.updateRootRoute({
       component: App,
     });
-    let history = syncHistoryWithStore(
+    const history = syncHistoryWithStore(
       useRouterHistory(useBeforeUnload(createHistory))({
         basename: Config.get('baseUrl'),
       }),

client/src/boot/applyDevtools.js

@@ -1,10 +1,13 @@
+/* global window */
 import { compose } from 'redux';
 
 export default function applyDevtools(middleware) {
   // use browser extension `compose` function if it's available
+  // eslint-disable-next-line no-underscore-dangle
   const composeExtension = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__;
   // use browser extension devTools if it's available
   // this is the old way: `devToolsExtension` is being deprecated
+  // eslint-disable-next-line no-underscore-dangle
   const devTools = window.__REDUX_DEVTOOLS_EXTENSION__ || window.devToolsExtension;
 
   if (typeof composeExtension === 'function') {

client/src/boot/applyTransforms.js

@@ -32,7 +32,7 @@ const applyTransforms = () => {
   Injector.transform(
     'form-action-changed',
     (updater) => {
-      updater.form.alterSchema('*', form => {
+      updater.form.alterSchema('*', (form) => {
         form.mutateField('action_save', (field) => {
           const isPristine = form.isPristine();
 
@@ -46,7 +46,7 @@ const applyTransforms = () => {
 
         return form.getState();
       });
-    }
+    },
   );
 };
 

client/src/boot/index.js

@@ -1,3 +1,4 @@
+/* global window */
 import BootRoutes from './BootRoutes';
 import Injector from 'lib/Injector';
 import { combineReducers, createStore, applyMiddleware } from 'redux';

client/src/boot/tests/BootRoutes-test.js

@@ -1,10 +1,10 @@
-/* global jest, jasmine, describe, afterEach, it, expect */
+/* global jest, jasmine, describe, afterEach, it, expect, window */
 
 jest.unmock('../BootRoutes.js');
 jest.unmock('lib/Config');
 jest.unmock('lib/Router');
 
-import BootRoutes from '../BootRoutes.js';
+import BootRoutes from '../BootRoutes';
 
 describe('Bootroutes', () => {
   beforeEach(() => {

client/src/bundles/bundle.js

@@ -1,3 +1,8 @@
+/* eslint-disable
+ import/no-webpack-loader-syntax,
+ import/no-extraneous-dependencies,
+ import/no-unresolved
+ */
 // Legacy translation handler
 require('i18n.js');
 

client/src/bundles/vendor.js

@@ -1,3 +1,8 @@
+/* eslint-disable
+ import/no-webpack-loader-syntax,
+ import/no-extraneous-dependencies,
+ import/no-unresolved
+*/
 // TODO Enable require(*.css) includes once https://github.com/webpack/extract-text-webpack-plugin/issues/179
 // is resolved. Included in bundle.scss for now.
 

client/src/components/Accordion/Accordion.js

@@ -1,14 +1,13 @@
 import React from 'react';
-import SilverStripeComponent from 'lib/SilverStripeComponent';
 
-class Accordion extends SilverStripeComponent {
-  render() {
-    return (
-      <div className="accordion"
-        role="tablist"
-        aria-multiselectable="true"
-      >{this.props.children}</div>
-    );
-  }
-}
+const Accordion = (props) => (
+  <div
+    className="accordion"
+    role="tablist"
+    aria-multiselectable="true"
+  >
+    {props.children}
+  </div>
+);
+
 export default Accordion;

client/src/components/Accordion/AccordionBlock.js

@@ -1,39 +1,35 @@
-// TODO move list-group to its own component
-
 import React from 'react';
-import SilverStripeComponent from 'lib/SilverStripeComponent';
 
-class AccordionBlock extends SilverStripeComponent {
-  render() {
-    const headerID = `${this.props.groupid}_Header`;
-    const listID = `${this.props.groupid}_Items`;
-    const listIDAttr = listID.replace(/\\/g, '_');
-    const headerIDAttr = headerID.replace(/\\/g, '_');
-    const href = `#${listIDAttr}`;
+const AccordionBlock = (props) => {
+  const headerID = `${props.groupid}_Header`;
+  const listID = `${props.groupid}_Items`;
+  const listIDAttr = listID.replace(/\\/g, '_');
+  const headerIDAttr = headerID.replace(/\\/g, '_');
 
-    const groupProps = {
-      id: listIDAttr,
-      'aria-expanded': true,
-      className: 'list-group list-group-flush collapse show',
-      role: 'tabpanel',
-      'aria-labelledby': headerID,
-    };
-    return (
-      <div className="accordion__block">
-        <a className="accordion__title"
-          data-toggle="collapse"
-          href={href}
-          aria-expanded="true"
-          aria-controls={listID}
-          id={headerIDAttr}
-          role="tab"
-        >{this.props.title}
-        </a>
-        <div {...groupProps}>
-          {this.props.children}
-        </div>
+  const groupProps = {
+    id: listIDAttr,
+    'aria-expanded': true,
+    className: 'list-group list-group-flush collapse show',
+    role: 'tabpanel',
+    'aria-labelledby': headerID,
+  };
+  return (
+    <div className="accordion__block">
+      <a
+        className="accordion__title"
+        data-toggle="collapse"
+        href={`#${listIDAttr}`}
+        aria-expanded="true"
+        aria-controls={listID}
+        id={headerIDAttr}
+        role="tab"
+      >{props.title}
+      </a>
+      <div {...groupProps}>
+        {props.children}
       </div>
-    );
-  }
-}
+    </div>
+  );
+};
+
 export default AccordionBlock;

client/src/components/Breadcrumb/Breadcrumb.js

@@ -1,9 +1,7 @@
-import React from 'react';
-import SilverStripeComponent from 'lib/SilverStripeComponent';
+import React, { Component } from 'react';
 import { connect } from 'react-redux';
 
-class Breadcrumb extends SilverStripeComponent {
-
+class Breadcrumb extends Component {
   getLastCrumb() {
     return this.props.crumbs && this.props.crumbs[this.props.crumbs.length - 1];
   }
@@ -13,8 +11,8 @@ class Breadcrumb extends SilverStripeComponent {
       return null;
     }
 
-    return this.props.crumbs.slice(0, -1).map((crumb, index) => (
-      <li key={index} className="breadcrumb__item">
+    return this.props.crumbs.slice(0, -1).map((crumb) => (
+      <li key={crumb.text} className="breadcrumb__item">
         <a
           className="breadcrumb__item-title"
           href={crumb.href}
@@ -41,9 +39,14 @@ class Breadcrumb extends SilverStripeComponent {
       <div className="breadcrumb__item breadcrumb__item--last">
         <h2 className="breadcrumb__item-title">
           {crumb.text}
-          {crumb.icon &&
-          <span className={iconClassNames.join(' ')} onClick={crumb.icon.action} />
-          }
+          {crumb.icon && (
+            <span
+              className={iconClassNames.join(' ')}
+              role="button"
+              tabIndex={0}
+              onClick={crumb.icon.action}
+            />
+          )}
         </h2>
       </div>
     );

client/src/components/Breadcrumb/tests/breadcrumb-test.js

@@ -21,7 +21,8 @@ describe('BreadcrumbsComponent', () => {
       props.crumbs = [
         { text: 'breadcrumb1', href: 'href1' },
         { text: 'breadcrumb2', href: 'href2' },
-        { text: 'breadcrumb3', href: 'href3',
+        { text: 'breadcrumb3',
+          href: 'href3',
           icon: {
             className: 'breadcrumb3icon',
             action: jest.genMockFunction(),

client/src/components/CheckboxField/CheckboxField.js

@@ -1,9 +1,8 @@
-import React from 'react';
+import React, { Component } from 'react';
 import OptionField from '../OptionsetField/OptionField';
 import fieldHolder from 'components/FieldHolder/FieldHolder';
-import SilverStripeComponent from 'lib/SilverStripeComponent';
 
-class CheckboxField extends SilverStripeComponent {
+class CheckboxField extends Component {
   render() {
     // Build standard checkbox with fieldholder
     const FieldHolder = fieldHolder(OptionField);

client/src/components/CheckboxSetField/CheckboxSetField.js

@@ -1,10 +1,9 @@
-import React from 'react';
-import SilverStripeComponent from 'lib/SilverStripeComponent';
+import React, { Component } from 'react';
 import OptionField from 'components/OptionsetField/OptionField';
 import fieldHolder from 'components/FieldHolder/FieldHolder';
 
 // a group of check boxes
-class CheckboxSetField extends SilverStripeComponent {
+class CheckboxSetField extends Component {
   constructor(props) {
     super(props);
 
@@ -132,6 +131,6 @@ CheckboxSetField.defaultProps = {
   value: [],
 };
 
-export { CheckboxSetField };
+export { CheckboxSetField as Component };
 
 export default fieldHolder(CheckboxSetField);

client/src/components/CheckboxSetField/tests/CheckboxSetField-test.js

@@ -1,4 +1,4 @@
-/* global jest, describe, beforeEach, it, expect */
+/* global jest, describe, beforeEach, it, expect, Event */
 
 jest.unmock('react');
 jest.unmock('react-addons-test-utils');
@@ -7,7 +7,7 @@ jest.unmock('../CheckboxSetField');
 import React from 'react';
 import ReactTestUtils from 'react-addons-test-utils';
 // get non-default because it uses FieldHolder by default
-import { CheckboxSetField } from '../CheckboxSetField';
+import { Component as CheckboxSetField } from '../CheckboxSetField';
 
 describe('CheckboxSetField', () => {
   let props = null;