Merge pull request #52 from emmenko/babel-6

emmenko · emmenko · commit a09a0ee7c203 · 2016-01-09T10:39:37.000+01:00
Babel 6
diff --git a/.babelrc b/.babelrc
@@ -1,18 +1,31 @@
 {
-  "optional": ["runtime"],
-  "stage": 0,
+  "plugins": ["transform-runtime"],
+  "presets": [ "es2015", "stage-0", "react" ],
   "env": {
     "development": {
-      "plugins": ["react-transform"],
-      "extra": {
-        "react-transform": {
-          "transforms": [{
-            "transform": "react-transform-hmr",
-            "imports": ["react"],
-            "locals": ["module"]
-          }]
-        }
-      }
+      "plugins": [
+        [ "react-transform", {
+          "transforms": [
+            {
+              "transform": "react-transform-hmr",
+              "imports": ["react"],
+              "locals": ["module"]
+            },
+            {
+              "transform": "react-transform-catch-errors",
+              "imports": [ "react", "redbox-react" ]
+            }
+          ]
+        }]
+      ]
+    },
+    "i18n": {
+      "plugins": [
+        [ "react-intl", {
+          "messagesDir": "./_translations",
+          "enforceDescriptions": false
+        }]
+      ]
     }
   }
 }
diff --git a/.babelrc.i18n b/.babelrc.i18n
diff --git a/README.md b/README.md
@@ -1,8 +1,10 @@
 http://emmenko.github.io/redux-react-router-async-example
 
-This is a boilerplate example showcasing _mostly_ [Redux](https://github.com/gaearon/redux) and [React Router](https://github.com/rackt/react-router).
+This is a boilerplate example showcasing _mostly_ [Redux](https://github.com/gaearon/redux) and [React Router](https://github.com/rackt/react-router) and it aims to provide different examples or use cases with the two libraries.
 
-> Still a **WIP** but it aims to provide different examples or use cases with the two libraries.
+##### The project will be constantly updated and improved with the latest dependencies, features, best practices and so on.
+
+> Check out the [migration to babel 6](https://github.com/emmenko/redux-react-router-async-example/pull/52).
 
 ## Features
 
diff --git a/TODO.md b/TODO.md
@@ -1,7 +1,7 @@
 # TODO
 
 - JSDoc
-- better error handling
+- loading spinner for data fetching
 - use inline styles https://github.com/emmenko/redux-react-router-async-example/issues/7
 - add use-case for `AsyncProps`
 - add use-case for external plugin https://dl.dropboxusercontent.com/u/4803975/ReactEurope/slides.pdf
diff --git a/lib/Root.js b/lib/Root.js
@@ -48,7 +48,7 @@ function getRootChildren (props) {
   ]
 
   if (__DEVTOOLS__) {
-    const DevTools = require('./components/DevTools')
+    const DevTools = require('./components/DevTools').default
     rootChildren.push(<DevTools key="devtools" />)
   }
   return rootChildren
@@ -90,15 +90,16 @@ function logout (nextState, replaceState) {
   replaceState({}, '/login')
 }
 
-@connect(({ application }) => ({ application }))
-export default class Root extends React.Component {
+class Root extends React.Component {
   static propTypes = {
     application: PropTypes.object.isRequired
-  }
+  };
 
   render () {
     return (
       <div>{getRootChildren(this.props)}</div>
     )
   }
 }
+
+export default connect(({ application }) => ({ application }))(Root)
diff --git a/lib/components/Application.js b/lib/components/Application.js
@@ -8,7 +8,7 @@ export default class Application extends React.Component {
 
   static propTypes = {
     children: PropTypes.any
-  }
+  };
 
   constructor (props, context) {
     super(props, context)
diff --git a/lib/components/DevTools.js b/lib/components/DevTools.js
@@ -5,8 +5,8 @@ import DockMonitor from 'redux-devtools-dock-monitor'
 
 export default createDevTools(
   <DockMonitor
-    toggleVisibilityKey='H'
-    changePositionKey='Q'>
+    toggleVisibilityKey='ctrl-h'
+    changePositionKey='ctrl-q'>
     <LogMonitor />
   </DockMonitor>
 )
diff --git a/lib/components/DisplayError.js b/lib/components/DisplayError.js
@@ -7,7 +7,7 @@ class DisplayError extends React.Component {
   static propTypes = {
     hideError: PropTypes.func.isRequired,
     error: PropTypes.object
-  }
+  };
 
   render () {
     const { props: { hideError, error } } = this
diff --git a/lib/components/Menu.js b/lib/components/Menu.js
@@ -13,14 +13,13 @@ const menuItems = [
   { text: 'Fork Me', link: GITHUB_REPO, icon: 'fa fa-github', isExternal: true }
 ]
 
-@connect(({ application }) => ({ application }), applicationActions)
-export default class Menu extends React.Component {
+class Menu extends React.Component {
 
   static propTypes = {
     activeClass: PropTypes.string.isRequired,
     application: PropTypes.object.isRequired,
     switchLocale: PropTypes.func.isRequired
-  }
+  };
 
   constructor (props, context) {
     super(props, context)
@@ -58,3 +57,8 @@ export default class Menu extends React.Component {
     )
   }
 }
+
+export default connect(
+  ({ application }) => ({ application }),
+  applicationActions
+)(Menu)
diff --git a/lib/components/MenuListItem.js b/lib/components/MenuListItem.js
@@ -8,9 +8,9 @@ export default class MenuListItem extends Component {
     isExternal: PropTypes.bool,
     link: PropTypes.string.isRequired,
     text: PropTypes.string.isRequired
-  }
+  };
 
-  static defaultProps = { isExternal: false }
+  static defaultProps = { isExternal: false };
 
   render () {
     return (
diff --git a/lib/components/github/Explore.js b/lib/components/github/Explore.js
@@ -27,11 +27,11 @@ export default class Explore extends React.Component {
       repo: PropTypes.string,
       username: PropTypes.string
     })
-  }
+  };
 
   static contextTypes = {
     history: PropTypes.object.isRequired
-  }
+  };
 
   constructor (props) {
     super(props)
diff --git a/lib/components/github/Pagination.js b/lib/components/github/Pagination.js
@@ -6,7 +6,7 @@ export default class Pagination extends React.Component {
   static propTypes = {
     onPagination: PropTypes.func,
     pagination: PropTypes.object
-  }
+  };
 
   handlePaginationClick (link) {
     const page = link.url
diff --git a/lib/components/github/Repo.js b/lib/components/github/Repo.js
@@ -4,17 +4,12 @@ import { fetchOnUpdate } from '../../decorators'
 import StargazersUser from './StargazersUser'
 import Pagination from './Pagination'
 
-@fetchOnUpdate([ 'username', 'repo' ], (params, actions) => {
-  const { username, repo } = params
-  actions.fetchRepo({ username, repo })
-  actions.fetchRepoStargazers({ username, repo })
-})
-export default class Repo extends React.Component {
+class Repo extends React.Component {
 
   static propTypes = {
     actions: PropTypes.object,
     github: PropTypes.object
-  }
+  };
 
   render () {
     const { github: { repo, stargazers } } = this.props
@@ -87,3 +82,9 @@ export default class Repo extends React.Component {
     )
   }
 }
+
+export default fetchOnUpdate([ 'username', 'repo' ], (params, actions) => {
+  const { username, repo } = params
+  actions.fetchRepo({ username, repo })
+  actions.fetchRepoStargazers({ username, repo })
+})(Repo)
diff --git a/lib/components/github/StargazersRepo.js b/lib/components/github/StargazersRepo.js
@@ -5,7 +5,7 @@ export default class StargazersRepo extends React.Component {
 
   static propTypes = {
     repo: PropTypes.object.isRequired
-  }
+  };
 
   render () {
     const { repo } = this.props
diff --git a/lib/components/github/StargazersUser.js b/lib/components/github/StargazersUser.js
@@ -5,7 +5,7 @@ export default class StargazersUser extends React.Component {
 
   static propTypes = {
     user: PropTypes.object.isRequired
-  }
+  };
 
   render () {
     const { user } = this.props
diff --git a/lib/components/github/User.js b/lib/components/github/User.js
@@ -4,17 +4,12 @@ import { fetchOnUpdate } from '../../decorators'
 import StargazersRepo from './StargazersRepo'
 import Pagination from './Pagination'
 
-@fetchOnUpdate(['username'], (params, actions) => {
-  const { username } = params
-  actions.fetchUser({ username })
-  actions.fetchUserStargazers({ username })
-})
-export default class User extends React.Component {
+class User extends React.Component {
 
   static propTypes = {
     actions: PropTypes.object,
     github: PropTypes.object
-  }
+  };
 
   render () {
     const { github: { user, stargazers } } = this.props
@@ -67,3 +62,9 @@ export default class User extends React.Component {
     )
   }
 }
+
+export default fetchOnUpdate(['username'], (params, actions) => {
+  const { username } = params
+  actions.fetchUser({ username })
+  actions.fetchUserStargazers({ username })
+})(User)
diff --git a/lib/components/pages/Account.js b/lib/components/pages/Account.js
@@ -4,7 +4,7 @@ export default class Account extends React.Component {
 
   static propTypes = {
     children: PropTypes.any
-  }
+  };
 
   render () {
     return <div>{this.props.children}</div>
diff --git a/lib/components/pages/GithubStargazers.js b/lib/components/pages/GithubStargazers.js
@@ -13,17 +13,12 @@ const messages = defineMessages({
   }
 })
 
-@connect(state => ({
-  github: state.github
-}), dispatch => ({
-  actions: bindActionCreators(githubActions, dispatch)
-}))
-export default class GithubStargazers extends React.Component {
+class GithubStargazers extends React.Component {
 
   static propTypes = {
     children: PropTypes.any,
     actions: PropTypes.object
-  }
+  };
 
   render () {
     return (
@@ -44,3 +39,8 @@ export default class GithubStargazers extends React.Component {
     )
   }
 }
+
+export default connect(
+  ({ github }) => ({ github }),
+  dispatch => ({ actions: bindActionCreators(githubActions, dispatch) })
+)(GithubStargazers)
diff --git a/lib/components/pages/Login.js b/lib/components/pages/Login.js
@@ -5,12 +5,12 @@ export default class Login extends React.Component {
 
   static propTypes = {
     location: PropTypes.object
-  }
+  };
 
   static contextTypes = {
     store: PropTypes.any,
     history: PropTypes.object.isRequired
-  }
+  };
 
   constructor (props) {
     super(props)
diff --git a/lib/components/pages/SuperSecretArea.js b/lib/components/pages/SuperSecretArea.js
@@ -10,8 +10,7 @@ const messages = defineMessages({
   }
 })
 
-@secure('manage_account')
-export default class SuperSecretArea extends React.Component {
+class SuperSecretArea extends React.Component {
   render () {
     return (
       <div>
@@ -25,3 +24,5 @@ export default class SuperSecretArea extends React.Component {
     )
   }
 }
+
+export default secure('manage_account')(SuperSecretArea)
diff --git a/lib/decorators/fetchOnUpdate.js b/lib/decorators/fetchOnUpdate.js
@@ -15,7 +15,7 @@ export default function fetchOnUpdate (paramKeys, fn) {
     static propTypes = {
       actions: PropTypes.object,
       params: PropTypes.object
-    }
+    };
 
     componentWillMount () {
       fn(mapParams(paramKeys, this.props.params), this.props.actions)
diff --git a/lib/decorators/secure.js b/lib/decorators/secure.js
@@ -8,7 +8,7 @@ export default function secure (scope) {
 
     static contextTypes = {
       store: PropTypes.any
-    }
+    };
 
     render () {
       const { store } = this.context
diff --git a/lib/index.js b/lib/index.js
@@ -18,7 +18,7 @@ addLocaleData(it)
 // For that we need to patch in on runtime.
 if (!global.Intl)
   require.ensure(['intl'], require => {
-    require('intl')
+    require('intl').default
     start()
   }, 'IntlBundle')
 else start()
diff --git a/lib/utils/configure-store.js b/lib/utils/configure-store.js
diff --git a/lib/utils/process-response.js b/lib/utils/process-response.js
diff --git a/package.json b/package.json
diff --git a/webpack.config.js b/webpack.config.js
diff --git a/webpack.config.production.js b/webpack.config.production.js

Original file line number	Diff line number	Diff line change
`@@ -48,7 +48,7 @@ function getRootChildren (props) {`
`48`	`48`	`]`
`49`	`49`
`50`	`50`	`if (__DEVTOOLS__) {`
`51`		`- const DevTools = require('./components/DevTools')`
	`51`	`+ const DevTools = require('./components/DevTools').default`
`52`	`52`	`rootChildren.push(<DevTools key="devtools" />)`
`53`	`53`	`}`
`54`	`54`	`return rootChildren`
`@@ -90,15 +90,16 @@ function logout (nextState, replaceState) {`
`90`	`90`	`replaceState({}, '/login')`
`91`	`91`	`}`
`92`	`92`
`93`		`-@connect(({ application }) => ({ application }))`
`94`		`-export default class Root extends React.Component {`
	`93`	`+class Root extends React.Component {`
`95`	`94`	`static propTypes = {`
`96`	`95`	`application: PropTypes.object.isRequired`
`97`		`- }`
	`96`	`+ };`
`98`	`97`
`99`	`98`	`render () {`
`100`	`99`	`return (`
`101`	`100`	`<div>{getRootChildren(this.props)}</div>`
`102`	`101`	`)`
`103`	`102`	`}`
`104`	`103`	`}`
	`104`	`+`
	`105`	`+export default connect(({ application }) => ({ application }))(Root)`
Original file line number	Diff line number	Diff line change
`@@ -13,14 +13,13 @@ const menuItems = [`
`13`	`13`	`{ text: 'Fork Me', link: GITHUB_REPO, icon: 'fa fa-github', isExternal: true }`
`14`	`14`	`]`
`15`	`15`
`16`		`-@connect(({ application }) => ({ application }), applicationActions)`
`17`		`-export default class Menu extends React.Component {`
	`16`	`+class Menu extends React.Component {`
`18`	`17`
`19`	`18`	`static propTypes = {`
`20`	`19`	`activeClass: PropTypes.string.isRequired,`
`21`	`20`	`application: PropTypes.object.isRequired,`
`22`	`21`	`switchLocale: PropTypes.func.isRequired`
`23`		`- }`
	`22`	`+ };`
`24`	`23`
`25`	`24`	`constructor (props, context) {`
`26`	`25`	`super(props, context)`
`@@ -58,3 +57,8 @@ export default class Menu extends React.Component {`
`58`	`57`	`)`
`59`	`58`	`}`
`60`	`59`	`}`
	`60`	`+`
	`61`	`+export default connect(`
	`62`	`+ ({ application }) => ({ application }),`
	`63`	`+ applicationActions`
	`64`	`+)(Menu)`