From 2a931cb812751b3a54018dba2f65c3044c0ef393 Mon Sep 17 00:00:00 2001
From: Simen Bekkhus <sbekkhus91@gmail.com>
Date: Fri, 6 Jan 2017 11:52:44 +0100
Subject: [PATCH] Add redux dev tools in development

---
 frontend/src/.eslintrc     |  3 +++
 frontend/src/index.jsx     | 14 +++++++++++---
 frontend/webpack.config.js | 22 +++++++++++-----------
 3 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/frontend/src/.eslintrc b/frontend/src/.eslintrc
index d69a90d3ee..941a7b8694 100644
--- a/frontend/src/.eslintrc
+++ b/frontend/src/.eslintrc
@@ -10,6 +10,9 @@
         "commonjs": true,
 	    "es6": true
     },
+    "globals": {
+        "process": false
+    },
     "parserOptions": {
         "ecmaVersion": 7,
         "ecmaFeatures": {
diff --git a/frontend/src/index.jsx b/frontend/src/index.jsx
index 8a2993bcec..78b81c642f 100644
--- a/frontend/src/index.jsx
+++ b/frontend/src/index.jsx
@@ -8,7 +8,7 @@ import { applyRouterMiddleware, Router, Route, IndexRedirect, hashHistory } from
 import { useScroll } from 'react-router-scroll';
 import { Provider } from 'react-redux';
 import thunkMiddleware from 'redux-thunk';
-import { createStore, applyMiddleware } from 'redux';
+import { createStore, applyMiddleware, compose } from 'redux';
 
 import store from './store';
 import App from './component/app';
@@ -25,10 +25,18 @@ import Archive from './page/archive';
 import Applications from './page/applications';
 import ApplicationView from './page/applications/view';
 
+let composeEnhancers;
+
+if (process.env.NODE_ENV !== 'production' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__) {
+    composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__;
+} else {
+    composeEnhancers = compose;
+}
+
 const unleashStore = createStore(
     store,
-    applyMiddleware(
-        thunkMiddleware
+    composeEnhancers(
+        applyMiddleware(thunkMiddleware)
     )
 );
 
diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js
index 3dfeb4c5de..ce4cbbaccc 100644
--- a/frontend/webpack.config.js
+++ b/frontend/webpack.config.js
@@ -6,21 +6,21 @@ const webpack = require('webpack');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 
 const entry = ['whatwg-fetch', './src/index'];
-const plugins = [new ExtractTextPlugin('bundle.css',  { allChunks: true })];
+const plugins = [
+    new ExtractTextPlugin('bundle.css', { allChunks: true }),
+    new webpack.DefinePlugin({
+        'process.env': {
+            NODE_ENV: JSON.stringify(process.env.NODE_ENV || 'development'),
+        },
+    }),
+];
 
 if (process.env.NODE_ENV === 'development') {
     entry.push('webpack-dev-server/client?http://localhost:3000');
     entry.push('webpack/hot/only-dev-server');
     plugins.push(new webpack.HotModuleReplacementPlugin());
-} else {
-    plugins.push(new webpack.DefinePlugin({
-        'process.env': {
-            NODE_ENV: JSON.stringify('production'),
-        },
-    }));
 }
 
-
 module.exports = {
     entry,
 
@@ -38,15 +38,15 @@ module.exports = {
     module: {
         loaders: [
             {
-                test: /\.(jsx|js)$/,
+                test: /\.jsx?$/,
                 exclude: /node_modules/,
-                loaders: ['babel'],
+                loader: 'babel',
                 include: path.join(__dirname, 'src'),
             },
             {
                 test: /(\.scss)$/,
                 loader: ExtractTextPlugin.extract('style',
-                'css?sourceMap&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass'),
+                    'css?sourceMap&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass'),
             },
             {
                 test: /\.css$/,