Add monitor to TodoMVC

examples/todomvc/containers/App.js

@@ -1,18 +1,32 @@
 import React, { Component } from 'react';
 import TodoApp from './TodoApp';
-import { createStore, combineReducers } from 'redux';
+import { createStore, combineReducers, compose } from 'redux';
+import { devTools, persistState } from 'redux-devtools';
+import { DevTools, DebugPanel, LogMonitor } from 'redux-devtools/lib/react';
 import { Provider } from 'react-redux';
 import * as reducers from '../reducers';
 
+const finalCreateStore = compose(
+  devTools(),
+  persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)),
+  createStore
+);
+
 const reducer = combineReducers(reducers);
-const store = createStore(reducer);
+const store = finalCreateStore(reducer);
 
 export default class App extends Component {
   render() {
     return (
-      <Provider store={store}>
+      <div>
-        {() => <TodoApp /> }
+        <Provider store={store}>
-      </Provider>
+          {() => <TodoApp /> }
+        </Provider>
+        <DebugPanel top right bottom>
+          <DevTools store={store}
+                    monitor={LogMonitor} />
+        </DebugPanel>
+      </div>
     );
   }
 }

examples/todomvc/webpack.config.js

@@ -19,7 +19,9 @@ module.exports = {
   ],
   resolve: {
     alias: {
-      'redux-devtools': path.join(__dirname, '..', '..', 'src')
+      'redux-devtools/lib': path.join(__dirname, '..', '..', 'src'),
+      'redux-devtools': path.join(__dirname, '..', '..', 'src'),
+      'react': path.join(__dirname, 'node_modules', 'react')
     },
     extensions: ['', '.js']
   },