Merge pull request reduxjs#627 from mikekidder/eslint.npm.updates

latest eslint related packages; full linting for redux

Author: gaearon

.eslintrc

@@ -1,5 +1,5 @@
 {
-  "extends": "eslint-config-airbnb",
+  "extends": "airbnb",
   "env": {
     "browser": true,
     "mocha": true,
@@ -16,10 +16,8 @@
     "no-var": 0,
     "vars-on-top": 0,
 
-    //Temporarirly disabled due to a possible bug in babel-eslint (todomvc example)
-    "block-scoped-var": 0,
-    // Temporarily disabled for test/* until babel/babel-eslint#33 is resolved
-    "padded-blocks": 0
+    // Disable comma-dangle unless need to support it
+    "comma-dangle": 0
   },
   "plugins": [
     "react"

examples/async/containers/AsyncApp.js

@@ -50,7 +50,7 @@ class AsyncApp extends Component {
             </span>
           }
           {!isFetching &&
-            <a href='#'
+            <a href="#"
                onClick={this.handleRefreshClick}>
               Refresh
             </a>

examples/buildAll.js

@@ -16,11 +16,10 @@ var cmdArgs = [
   { cmd: 'webpack', args: ['index.js'] }
 ];
 
-for (let dir of exampleDirs) {
-
-  for (let cmdArg of cmdArgs) {
+for (const dir of exampleDirs) {
+  for (const cmdArg of cmdArgs) {
     // declare opts in this scope to avoid https://github.com/joyent/node/issues/9158
-    let opts = {
+    const opts = {
       cwd: path.join(__dirname, dir),
       stdio: 'inherit'
     };

examples/counter/test/actions/counter.spec.js

@@ -2,7 +2,6 @@ import expect from 'expect';
 import * as actions from '../../actions/counter';
 
 describe('actions', () => {
-
   it('increment should create increment action', () => {
     expect(actions.increment()).toEqual({ type: actions.INCREMENT_COUNTER });
   });
@@ -12,32 +11,31 @@ describe('actions', () => {
   });
 
   it('incrementIfOdd should create increment action', () => {
-    let fn = actions.incrementIfOdd();
+    const fn = actions.incrementIfOdd();
     expect(fn).toBeA('function');
-    let dispatch = expect.createSpy();
-    let getState = () => ({ counter: 1 });
+    const dispatch = expect.createSpy();
+    const getState = () => ({ counter: 1 });
     fn(dispatch, getState);
     expect(dispatch).toHaveBeenCalledWith({ type: actions.INCREMENT_COUNTER });
   });
 
   it('incrementIfOdd shouldnt create increment action if counter is even', () => {
-    let fn = actions.incrementIfOdd();
-    let dispatch = expect.createSpy();
-    let getState = () => ({ counter: 2 });
+    const fn = actions.incrementIfOdd();
+    const dispatch = expect.createSpy();
+    const getState = () => ({ counter: 2 });
     fn(dispatch, getState);
     expect(dispatch.calls.length).toBe(0);
   });
 
   // There's no nice way to test this at the moment...
   it('incrementAsync', (done) => {
-    let fn = actions.incrementAsync(1);
+    const fn = actions.incrementAsync(1);
     expect(fn).toBeA('function');
-    let dispatch = expect.createSpy();
+    const dispatch = expect.createSpy();
     fn(dispatch);
     setTimeout(() => {
       expect(dispatch).toHaveBeenCalledWith({ type: actions.INCREMENT_COUNTER });
       done();
     }, 5);
   });
 });
-

examples/counter/test/containers/CounterApp.spec.js

@@ -27,7 +27,6 @@ describe('containers', () => {
   jsdomReact();
 
   describe('App', () => {
-
     it('should display initial count', () => {
       const { p } = setup();
       expect(p.textContent).toMatch(/^Clicked: 0 times/);

examples/counter/test/reducers/counter.spec.js

@@ -4,7 +4,6 @@ import { INCREMENT_COUNTER, DECREMENT_COUNTER } from '../../actions/counter';
 
 describe('reducers', () => {
   describe('counter', () => {
-
     it('should handle initial state', () => {
       expect(counter(undefined, {})).toBe(0);
     });

examples/real-world/components/Explore.js

@@ -9,6 +9,12 @@ export default class Explore extends Component {
     this.handleGoClick = this.handleGoClick.bind(this);
   }
 
+  componentWillReceiveProps(nextProps) {
+    if (nextProps.value !== this.props.value) {
+      this.setInputValue(nextProps.value);
+    }
+  }
+
   getInputValue() {
     return findDOMNode(this.refs.input).value;
   }
@@ -20,39 +26,33 @@ export default class Explore extends Component {
     findDOMNode(this.refs.input).value = val;
   }
 
-  componentWillReceiveProps(nextProps) {
-    if (nextProps.value !== this.props.value) {
-      this.setInputValue(nextProps.value);
+  handleKeyUp(e) {
+    if (e.keyCode === 13) {
+      this.handleGoClick();
     }
   }
 
+  handleGoClick() {
+    this.props.onChange(this.getInputValue());
+  }
+
   render() {
     return (
       <div>
         <p>Type a username or repo full name and hit 'Go':</p>
-        <input size='45'
-               ref='input'
+        <input size="45"
+               ref="input"
                defaultValue={this.props.value}
                onKeyUp={this.handleKeyUp} />
         <button onClick={this.handleGoClick}>
           Go!
         </button>
         <p>
-          Code on <a href={GITHUB_REPO} target='_blank'>Github</a>.
+          Code on <a href={GITHUB_REPO} target="_blank">Github</a>.
         </p>
       </div>
     );
   }
-
-  handleKeyUp(e) {
-    if (e.keyCode === 13) {
-      this.handleGoClick();
-    }
-  }
-
-  handleGoClick() {
-    this.props.onChange(this.getInputValue());
-  }
 }
 
 Explore.propTypes = {

examples/real-world/components/List.js

@@ -1,6 +1,17 @@
 import React, { Component, PropTypes } from 'react';
 
 export default class List extends Component {
+  renderLoadMore() {
+    const { isFetching, onLoadMoreClick } = this.props;
+    return (
+      <button style={{ fontSize: '150%' }}
+              onClick={onLoadMoreClick}
+              disabled={isFetching}>
+        {isFetching ? 'Loading...' : 'Load More'}
+      </button>
+    );
+  }
+
   render() {
     const {
       isFetching, nextPageUrl, pageCount,
@@ -24,21 +35,13 @@ export default class List extends Component {
       </div>
     );
   }
-
-  renderLoadMore() {
-    const { isFetching, onLoadMoreClick } = this.props;
-    return (
-      <button style={{ fontSize: '150%' }}
-              onClick={onLoadMoreClick}
-              disabled={isFetching}>
-        {isFetching ? 'Loading...' : 'Load More'}
-      </button>
-    );
-  }
 }
 
 List.propTypes = {
   loadingLabel: PropTypes.string.isRequired,
+  pageCount: PropTypes.number,
+  renderItem: PropTypes.func.isRequired,
+  items: PropTypes.array.isRequired,
   isFetching: PropTypes.bool.isRequired,
   onLoadMoreClick: PropTypes.func.isRequired,
   nextPageUrl: PropTypes.string

examples/real-world/components/Repo.js

@@ -9,7 +9,7 @@ export default class Repo extends Component {
     const { name, description } = repo;
 
     return (
-      <div className='Repo'>
+      <div className="Repo">
         <h3>
           <Link to={`/${login}/${name}`}>
             {name}

examples/real-world/components/User.js

@@ -6,9 +6,9 @@ export default class User extends Component {
     const { login, avatarUrl, name } = this.props.user;
 
     return (
-      <div className='User'>
+      <div className="User">
         <Link to={`/${login}`}>
-          <img src={avatarUrl} width='72' height='72' />
+          <img src={avatarUrl} width="72" height="72" />
           <h3>
             {login} {name && <span>({name})</span>}
           </h3>

examples/real-world/containers/App.js

@@ -10,21 +10,15 @@ class App extends Component {
     this.handleDismissClick = this.handleDismissClick.bind(this);
   }
 
-  render() {
-    // Injected by React Router
-    const { location, children } = this.props;
-    const { pathname } = location;
-    const value = pathname.substring(1);
+  handleDismissClick(e) {
+    this.props.resetErrorMessage();
+    e.preventDefault();
+  }
 
-    return (
-      <div>
-        <Explore value={value}
-                 onChange={this.handleChange} />
-        <hr />
-        {this.renderErrorMessage()}
-        {children}
-      </div>
-    );
+  handleChange(nextValue) {
+    // Available thanks to contextTypes below
+    const { router } = this.context;
+    router.transitionTo(`/${nextValue}`);
   }
 
   renderErrorMessage() {
@@ -37,35 +31,43 @@ class App extends Component {
       <p style={{ backgroundColor: '#e99', padding: 10 }}>
         <b>{errorMessage}</b>
         {' '}
-        (<a href='#'
+        (<a href="#"
             onClick={this.handleDismissClick}>
           Dismiss
         </a>)
       </p>
     );
   }
 
-  handleDismissClick(e) {
-    this.props.resetErrorMessage();
-    e.preventDefault();
-  }
+  render() {
+    // Injected by React Router
+    const { location, children } = this.props;
+    const { pathname } = location;
+    const value = pathname.substring(1);
 
-  handleChange(nextValue) {
-    // Available thanks to contextTypes below
-    const { router } = this.context;
-    router.transitionTo(`/${nextValue}`);
+    return (
+      <div>
+        <Explore value={value}
+                 onChange={this.handleChange} />
+        <hr />
+        {this.renderErrorMessage()}
+        {children}
+      </div>
+    );
   }
 }
 
 App.propTypes = {
   errorMessage: PropTypes.string,
+  resetErrorMessage: PropTypes.func.isRequired,
   location: PropTypes.shape({
     pathname: PropTypes.string.isRequired
   }),
   params: PropTypes.shape({
     userLogin: PropTypes.string,
     repoName: PropTypes.string
-  }).isRequired
+  }).isRequired,
+  children: PropTypes.node
 };
 
 App.contextTypes = {

examples/real-world/containers/RepoPage.js

@@ -28,6 +28,17 @@ class RepoPage extends Component {
     }
   }
 
+  handleLoadMoreClick() {
+    this.props.loadStargazers(this.props.fullName, true);
+  }
+
+  renderUser(user) {
+    return (
+      <User user={user}
+            key={user.login} />
+    );
+  }
+
   render() {
     const { repo, owner, name } = this.props;
     if (!repo || !owner) {
@@ -48,23 +59,13 @@ class RepoPage extends Component {
       </div>
     );
   }
-
-  renderUser(user) {
-    return (
-      <User user={user}
-            key={user.login} />
-    );
-  }
-
-  handleLoadMoreClick() {
-    this.props.loadStargazers(this.props.fullName, true);
-  }
 }
 
 RepoPage.propTypes = {
   repo: PropTypes.object,
   fullName: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
+  owner: PropTypes.string.isRequired,
   stargazers: PropTypes.array.isRequired,
   stargazersPagination: PropTypes.object,
   loadRepo: PropTypes.func.isRequired,

examples/real-world/containers/Root.js

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, PropTypes } from 'react';
 import { Provider } from 'react-redux';
 import { Router, Route } from 'react-router';
 import configureStore from '../store/configureStore';
@@ -15,10 +15,10 @@ export default class Root extends Component {
         <Provider store={store}>
           {() =>
             <Router history={this.props.history}>
-              <Route path='/' component={App}>
-                <Route path='/:login/:name'
+              <Route path="/" component={App}>
+                <Route path="/:login/:name"
                        component={RepoPage} />
-                <Route path='/:login'
+                <Route path="/:login"
                        component={UserPage} />
               </Route>
             </Router>
@@ -28,3 +28,7 @@ export default class Root extends Component {
     );
   }
 }
+
+Root.propTypes = {
+  history: PropTypes.object.isRequired,
+};