diff --git a/src/containers/Root.js b/src/containers/Root.js
index 0e4798d28..1f201f563 100644
--- a/src/containers/Root.js
+++ b/src/containers/Root.js
@@ -2,37 +2,40 @@ import React from 'react'
import { Provider } from 'react-redux'
import { Router } from 'react-router'
-export default class Root extends React.Component {
- static propTypes = {
- history: React.PropTypes.object.isRequired,
- routes: React.PropTypes.element.isRequired,
- store: React.PropTypes.object.isRequired
- }
-
- render () {
- const content = (
-
- {this.props.routes}
-
- )
+const PropTypes = {
+ history: React.PropTypes.object.isRequired,
+ routes: React.PropTypes.array.isRequired,
+ store: React.PropTypes.object.isRequired
+}
- if (__DEBUG__ && !__DEBUG_NW__) {
- const DevTools = require('containers/DevTools').default
+const RootContent = ({ history, routes }) => {
+ return (
+
+ {routes}
+
+ )
+}
- return (
-
-
- {content}
-
-
-
- )
- } else {
- return (
-
- {content}
-
- )
- }
+const Root = ({ history, routes, store }) => {
+ if (__DEBUG__ && !__DEBUG_NW__) {
+ const DevTools = require('./DevTools').default
+ return (
+
+
+
+
+
+
+ )
}
+
+ return (
+
+
+
+ )
}
+
+Root.propTypes = PropTypes
+
+export default Root
diff --git a/src/layouts/CoreLayout.js b/src/layouts/CoreLayout.js
index 09b90e5a4..5462006e9 100644
--- a/src/layouts/CoreLayout.js
+++ b/src/layouts/CoreLayout.js
@@ -1,18 +1,20 @@
import React from 'react'
import 'styles/core.scss'
-export default class CoreLayout extends React.Component {
- static propTypes = {
- children: React.PropTypes.element
- }
+const PropTypes = {
+ children: React.PropTypes.element
+}
- render () {
- return (
-
-
- {this.props.children}
-
+const CoreLayout = ({ children }) => {
+ return (
+
+ )
}
+
+CoreLayout.propTypes = PropTypes
+
+export default CoreLayout
diff --git a/src/views/HomeView.js b/src/views/HomeView.js
index 0e7a0e2a7..e44e1414a 100644
--- a/src/views/HomeView.js
+++ b/src/views/HomeView.js
@@ -4,6 +4,11 @@ import { Link } from 'react-router'
import { actions as counterActions } from '../redux/modules/counter'
import styles from './HomeView.scss'
+const PropTypes = {
+ increment: React.PropTypes.func,
+ counter: React.PropTypes.number
+}
+
// We define mapStateToProps where we'd normally use
// the @connect decorator so the data requirements are clear upfront, but then
// export the decorated component after the main class definition so
@@ -12,29 +17,25 @@ import styles from './HomeView.scss'
const mapStateToProps = (state) => ({
counter: state.counter
})
-export class HomeView extends React.Component {
- static propTypes = {
- increment: React.PropTypes.func,
- counter: React.PropTypes.number
- }
- render () {
- return (
-
-
Welcome to the React Redux Starter Kit
-
- Sample Counter:
- {this.props.counter}
-
-
-
- Go To About View
-
- )
- }
+const HomeView = ({ counter, increment }) => {
+ return (
+
+
Welcome to the React Redux Starter Kit
+
+ Sample Counter:
+ {counter}
+
+
+
+ Go To About View
+
+ )
}
+HomeView.propTypes = PropTypes
+
export default connect(mapStateToProps, counterActions)(HomeView)