Use redux-devtools instead of redux-logger

package.json

@@ -32,6 +32,9 @@
     "react-redux": "^4.4.5",
     "redux": "^3.5.2",
     "redux-actions": "^0.9.1",
+    "redux-devtools": "^3.3.1",
+    "redux-devtools-dock-monitor": "^1.1.1",
+    "redux-devtools-log-monitor": "^1.0.11",
     "redux-logger": "^2.6.1",
     "redux-saga": "^0.10.4",
     "webpack": "^1.13.0",

throttle/dev-tools.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { createDevTools } from 'redux-devtools';
+import LogMonitor from 'redux-devtools-log-monitor';
+import DockMonitor from 'redux-devtools-dock-monitor';
+
+const DevTools = createDevTools(
+  <DockMonitor toggleVisibilityKey='ctrl-h' changePositionKey='ctrl-q'>
+    <LogMonitor theme='tomorrow' />
+  </DockMonitor>
+);
+
+export default DevTools;

throttle/index.js

@@ -3,10 +3,14 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import App from './app';
+import DevTools from './dev-tools';
 import configureStore from './store';
 
 ReactDOM.render(
   <Provider store={configureStore()}>
-    <App />
+    <div>
+      <App />
+      <DevTools />
+    </div>
   </Provider>,
 document.getElementById('container'));

throttle/store.js

@@ -1,16 +1,17 @@
-import { createStore, applyMiddleware } from 'redux';
+import { createStore, applyMiddleware, compose } from 'redux';
 import createSagaMiddleware from 'redux-saga';
-import logger from 'redux-logger';
 import reducer from './reducers';
 import rootSaga from './sagas';
+import DevTools from './dev-tools';
 
 export default function configureStore(initialState) {
   const sagaMiddleware = createSagaMiddleware();
   const store = createStore(
     reducer,
     initialState,
-    applyMiddleware(
-      sagaMiddleware, logger()
+    compose(
+      applyMiddleware(sagaMiddleware),
+      DevTools.instrument()
     )
   );
   sagaMiddleware.run(rootSaga);