Added propTypes + some code refactoring to fix eslint errors

src/containers/App.js

@@ -1,7 +1,10 @@
-import React from 'react';
+import React, { PropTypes } from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
 import pluralize from 'pluralize';
 import { connect } from 'react-redux';
-import { Layout, Panel, NavDrawer, Navigation, Link } from 'react-toolbox';
+import { Layout, Panel, NavDrawer } from 'react-toolbox/lib/layout';
+import { Navigation } from 'react-toolbox/lib/navigation';
+import { Link } from 'react-toolbox/lib/link';
 import { loadConfig } from '../actions/config';
 import { loginUser } from '../actions/auth';
 import { currentBackend } from '../backends/backend';
@@ -11,7 +14,7 @@ import {
   HELP,
   runCommand,
   navigateToCollection,
-  createNewEntryInCollection
+  createNewEntryInCollection,
 } from '../actions/findbar';
 import AppHeader from '../components/AppHeader/AppHeader';
 import { Loader } from '../components/UI/index';
@@ -19,31 +22,37 @@ import styles from './App.css';
 
 class App extends React.Component {
 
+  static propTypes = {
+    auth: ImmutablePropTypes.map,
+    children: PropTypes.node,
+    config: ImmutablePropTypes.map,
+    collections: ImmutablePropTypes.orderedMap,
+    createNewEntryInCollection: PropTypes.func.isRequired,
+    dispatch: PropTypes.func.isRequired,
+    navigateToCollection: PropTypes.func.isRequired,
+    user: ImmutablePropTypes.map,
+    runCommand: PropTypes.func.isRequired,
+  };
+
+  static configError(config) {
+    return (<div>
+      <h1>Error loading the CMS configuration</h1>
+
+      <div>
+        <p>The <code>config.yml</code> file could not be loaded or failed to parse properly.</p>
+        <p><strong>Error message:</strong> {config.get('error')}</p>
+      </div>
+    </div>);
+  }
+
   state = {
-    navDrawerIsVisible: true
+    navDrawerIsVisible: true,
   };
 
   componentDidMount() {
     this.props.dispatch(loadConfig());
   }
 
-  configError(config) {
-    return <div>
-      <h1>Error loading the CMS configuration</h1>
-
-      <div>
-        <p>The "config.yml" file could not be loaded or failed to parse properly.</p>
-        <p><strong>Error message:</strong> {config.get('error')}</p>
-      </div>
-    </div>;
-  }
-
-  configLoading() {
-    return <div>
-      <Loader active>Loading configuration...</Loader>
-    </div>;
-  }
-
   handleLogin(credentials) {
     this.props.dispatch(loginUser(credentials));
   }
@@ -56,13 +65,17 @@ class App extends React.Component {
       return <div><h1>Waiting for backend...</h1></div>;
     }
 
-    return <div>
+    return (
-      {React.createElement(backend.authComponent(), {
+      <div>
-        onLogin: this.handleLogin.bind(this),
+        {
-        error: auth && auth.get('error'),
+          React.createElement(backend.authComponent(), {
-        isFetching: auth && auth.get('isFetching')
+            onLogin: this.handleLogin.bind(this),
-      })}
+            error: auth && auth.get('error'),
-    </div>;
+            isFetching: auth && auth.get('isFetching'),
+          })
+        }
+      </div>
+    );
   }
 
   generateFindBarCommands() {
@@ -70,22 +83,22 @@ class App extends React.Component {
     const commands = [];
     const defaultCommands = [];
 
-    this.props.collections.forEach(collection => {
+    this.props.collections.forEach((collection) => {
       commands.push({
-        id: `show_${collection.get('name')}`,
+        id: `show_${ collection.get('name') }`,
-        pattern: `Show ${pluralize(collection.get('label'))}`,
+        pattern: `Show ${ pluralize(collection.get('label')) }`,
         type: SHOW_COLLECTION,
-        payload: { collectionName: collection.get('name') }
+        payload: { collectionName: collection.get('name') },
       });
 
-      if (defaultCommands.length < 5) defaultCommands.push(`show_${collection.get('name')}`);
+      if (defaultCommands.length < 5) defaultCommands.push(`show_${ collection.get('name') }`);
 
       if (collection.get('create') === true) {
         commands.push({
-          id: `create_${collection.get('name')}`,
+          id: `create_${ collection.get('name') }`,
-          pattern: `Create new ${pluralize(collection.get('label'), 1)}(:itemName as ${pluralize(collection.get('label'), 1)} Name)`,
+          pattern: `Create new ${ pluralize(collection.get('label'), 1) }(:itemName as ${ pluralize(collection.get('label'), 1) } Name)`,
           type: CREATE_COLLECTION,
-          payload: { collectionName: collection.get('name') }
+          payload: { collectionName: collection.get('name') },
         });
       }
     });
@@ -98,7 +111,7 @@ class App extends React.Component {
 
   toggleNavDrawer = () => {
     this.setState({
-      navDrawerIsVisible: !this.state.navDrawerIsVisible
+      navDrawerIsVisible: !this.state.navDrawerIsVisible,
     });
   };
 
@@ -109,9 +122,9 @@ class App extends React.Component {
       config,
       children,
       collections,
-      runCommand,
+      runCommand, // eslint-disable-line
-      navigateToCollection,
+      navigateToCollection, // eslint-disable-line
-      createNewEntryInCollection
+      createNewEntryInCollection, // eslint-disable-line
     } = this.props;
 
     if (config === null) {
@@ -119,11 +132,11 @@ class App extends React.Component {
     }
 
     if (config.get('error')) {
-      return this.configError(config);
+      return App.configError(config);
     }
 
     if (config.get('isFetching')) {
-      return this.configLoading();
+      return <Loader active>Loading configuration...</Loader>;
     }
 
     if (user == null) {
@@ -142,12 +155,12 @@ class App extends React.Component {
         >
           <nav className={styles.nav}>
             <h1 className={styles.heading}>Collections</h1>
-            <Navigation type='vertical'>
+            <Navigation type="vertical">
               {
                 collections.valueSeq().map(collection =>
                   <Link
                     key={collection.get('name')}
-                    onClick={navigateToCollection.bind(this, collection.get('name'))}
+                    onClick={navigateToCollection.bind(this, collection.get('name'))} // eslint-disable-line
                   >
                     {collection.get('label')}
                   </Link>
@@ -192,7 +205,7 @@ function mapDispatchToProps(dispatch) {
     },
     createNewEntryInCollection: (collectionName) => {
       dispatch(createNewEntryInCollection(collectionName));
-    }
+    },
   };
 }