diff --git a/src/containers/App.js b/src/containers/App.js index f96364f9..a6908658 100644 --- a/src/containers/App.js +++ b/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 (
+

Error loading the CMS configuration

+ +
+

The config.yml file could not be loaded or failed to parse properly.

+

Error message: {config.get('error')}

+
+
); + } + state = { - navDrawerIsVisible: true + navDrawerIsVisible: true, }; componentDidMount() { this.props.dispatch(loadConfig()); } - configError(config) { - return
-

Error loading the CMS configuration

- -
-

The "config.yml" file could not be loaded or failed to parse properly.

-

Error message: {config.get('error')}

-
-
; - } - - configLoading() { - return
- Loading configuration... -
; - } - handleLogin(credentials) { this.props.dispatch(loginUser(credentials)); } @@ -56,13 +65,17 @@ class App extends React.Component { return

Waiting for backend...

; } - return
- {React.createElement(backend.authComponent(), { - onLogin: this.handleLogin.bind(this), - error: auth && auth.get('error'), - isFetching: auth && auth.get('isFetching') - })} -
; + return ( +
+ { + React.createElement(backend.authComponent(), { + onLogin: this.handleLogin.bind(this), + error: auth && auth.get('error'), + isFetching: auth && auth.get('isFetching'), + }) + } +
+ ); } 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')}`, - pattern: `Show ${pluralize(collection.get('label'))}`, + id: `show_${ collection.get('name') }`, + 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')}`, - pattern: `Create new ${pluralize(collection.get('label'), 1)}(:itemName as ${pluralize(collection.get('label'), 1)} Name)`, + id: `create_${ collection.get('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, - navigateToCollection, - createNewEntryInCollection + runCommand, // eslint-disable-line + navigateToCollection, // eslint-disable-line + 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 Loading configuration...; } if (user == null) { @@ -142,12 +155,12 @@ class App extends React.Component { >