Address review comments

Move guiMiddleware to `reducers/gui.js`, and use it in `app-state-hoc`

src/index.js

@@ -1,11 +1,9 @@
 import GUI from './containers/gui.jsx';
-import GuiReducer, {guiInitialState, initFullScreen, initPlayer} from './reducers/gui';
+import GuiReducer, {guiInitialState, guiMiddleware, initFullScreen, initPlayer} from './reducers/gui';
 import {ScratchPaintReducer} from 'scratch-paint';
 import IntlReducer from './reducers/intl';
 import {setFullScreen, setPlayer} from './reducers/mode';
 import {setAppElement} from 'react-modal';
-import {applyMiddleware, compose} from 'redux';
-import throttle from 'redux-throttle';
 
 const guiReducers = {
     intl: IntlReducer,
@@ -13,8 +11,6 @@ const guiReducers = {
     scratchPaint: ScratchPaintReducer
 };
 
-const guiMiddleware = compose(applyMiddleware(throttle(300, {leading: true, trailing: true})));
-
 export {
     GUI as default,
     setAppElement,

src/lib/app-state-hoc.jsx

@@ -1,25 +1,20 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import {Provider} from 'react-redux';
-import {createStore, applyMiddleware, combineReducers, compose} from 'redux';
-import throttle from 'redux-throttle';
+import {createStore, combineReducers, compose} from 'redux';
 
 import {intlShape} from 'react-intl';
 import {IntlProvider, updateIntl} from 'react-intl-redux';
 import intlReducer from '../reducers/intl.js';
 
-import guiReducer, {guiInitialState, initFullScreen, initPlayer} from '../reducers/gui';
+import guiReducer, {guiInitialState, guiMiddleware, initFullScreen, initPlayer} from '../reducers/gui';
 
 import {setPlayer, setFullScreen} from '../reducers/mode.js';
 
 import {ScratchPaintReducer} from 'scratch-paint';
 
 const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
-const enhancer = composeEnhancers(
-    applyMiddleware(
-        throttle(300, {leading: true, trailing: true})
-    )
-);
+const enhancer = composeEnhancers(guiMiddleware);
 
 /*
  * Higher Order Component to provide redux state. If an `intl` prop is provided

src/reducers/gui.js

@@ -1,4 +1,4 @@
-import {combineReducers} from 'redux';
+import {applyMiddleware, compose, combineReducers} from 'redux';
 import cardsReducer, {cardsInitialState} from './cards';
 import colorPickerReducer, {colorPickerInitialState} from './color-picker';
 import customProceduresReducer, {customProceduresInitialState} from './custom-procedures';
@@ -14,7 +14,9 @@ import stageSizeReducer, {stageSizeInitialState} from './stage-size';
 import targetReducer, {targetsInitialState} from './targets';
 import toolboxReducer, {toolboxInitialState} from './toolbox';
 import vmReducer, {vmInitialState} from './vm';
+import throttle from 'redux-throttle';
 
+const guiMiddleware = compose(applyMiddleware(throttle(300, {leading: true, trailing: true})));
 
 const guiInitialState = {
     blockDrag: blockDragInitialState,
@@ -75,6 +77,7 @@ const guiReducer = combineReducers({
 export {
     guiReducer as default,
     guiInitialState,
+    guiMiddleware,
     initFullScreen,
     initPlayer
 };