refactor(*) Major refactor of redux reducers/action creators now combined in modules #8

Reducers & action creators managing the same actions are now in the same modules, avoiding having `constants.js` file where you don't know anymore where they are used.
Closing task #8 "Refactor Actions / Reducers"

Added an .editorconfig file (since starting major rewrite - it's an opportunity to fix that)

Author: topheman

.editorconfig

@@ -0,0 +1,20 @@
+# http://editorconfig.org
+root = true
+
+[*]
+# change these settings to your own preference
+indent_style = space
+indent_size = 2
+
+# it's recommend to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[{package,bower}.json]
+indent_style = space
+indent_size = 2

src/Root.jsx

@@ -1,7 +1,12 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 
-import Root from './Root.jsx';
+import { ReduxRouter } from 'redux-router';
+import { Provider } from 'react-redux';
+
+import routes from './routes.jsx';
+
+import configureStore from './redux/configure-store.js';
 
 //init httpService config
 import httpServiceConfiguration from 'httpServiceConfiguration';
@@ -10,4 +15,55 @@ httpService.getInstance(httpServiceConfiguration);//will keep config in singleto
 //this way, instead of using resolve.alias of webpack (and having the require of module messed up by webpack when they'll be executed server-side)
 //I use dependency injection, in the one place that won't be executed in node : the client side bootstrap
 
-ReactDOM.render(<Root/>, document.getElementById('app-container'))
+/** Redux initialization */
+
+const component = (
+  <ReduxRouter>
+    {routes}
+  </ReduxRouter>
+);
+
+const initialState = {};
+
+/**
+ * The whole store/reducers/actions creators configuration is done inside configureStore
+ * The configuration of the router is also done their since it's stored in redux store (using a specific reducer)
+ */
+const store = configureStore(initialState);
+
+let rootElement = null;
+
+/**
+ * Thanks to webpack.DefinePlugin which lets you inject variables at transpile time,
+ * everything inside the if statement will be dropped at minification if process.env.DEVTOOLS is set to false.
+ * This is why I don't use static ES6 import but CommonJS import (so that it will only get required in that particular case)
+ *
+ * Cause: since the following are debug tools, they are not meant to be a part of the production bundle (which makes it lighter)
+ *
+ * https://webpack.github.io/docs/list-of-plugins.html#defineplugin
+ */
+if(process.env.DEVTOOLS){
+  console.info('redux devtools active, to hide the panel : ctrl+H - for more infos', 'https://github.com/gaearon/redux-devtools');
+  const { DevTools, DebugPanel, LogMonitor } = require('redux-devtools/lib/react');
+  rootElement = (
+    <Provider store={store}>
+      <div>
+        {component}
+        <DebugPanel top right bottom>
+          <DevTools store={store} monitor={LogMonitor} />
+        </DebugPanel>
+      </div>
+    </Provider>
+  );
+}
+else {
+  console.info('redux devtools not active, you can test them online at','https://topheman.github.io/react-es6-redux/devtools.html');
+  console.info('if you\'re testing the project in local, please refer to the README to activate them');
+  rootElement = (
+    <Provider store={store}>
+      {component}
+    </Provider>
+  )
+}
+
+ReactDOM.render(rootElement, document.getElementById('app-container'))

src/actions/counter.js

@@ -8,29 +8,29 @@ import SearchBox from './github/SearchBox.jsx';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 
-import * as SearchUsersActions from '../actions/searchUsers.js';
+import { changeUsername, findUsers } from '../redux/modules/multipleUsers.js';//import action creators
 
 /**
  * This component holds the state, the component bellow only use props
  */
 
 @connect(
-  (state) => ({state: state.searchUsers}),
-  (dispatch) => bindActionCreators(SearchUsersActions, dispatch)
+  (state) => ({multipleUsers: state.multipleUsers}),
+  (dispatch) => bindActionCreators({ changeUsername, findUsers }, dispatch)
 )
 class Github extends React.Component {
   render(){
     //retrieve the actions now available in props thanks to connect and bindActionCreators, to pass it down to dumb components
-    const { changeSearchUser, searchUsers } = this.props;
+    const { changeUsername, findUsers } = this.props;
     //retrieving the state of the store passed via connect from the redux store - to pass it down to the dumb components
-    let { state } = this.props;
+    let { multipleUsers } = this.props;
     return (
       <div>
         <IntroBox/>
-        <SearchBox changeSearchUser={changeSearchUser} searchUsers={searchUsers} {...state} />
+        <SearchBox changeUsername={changeUsername} findUsers={findUsers} {...multipleUsers} />
       </div>
     );
   }
 }
 
-export default Github;
+export default Github;