Use configureStore from redux-toolkit to set up redux store (#330)

src/ensembl/package-lock.json

@@ -4468,6 +4468,24 @@
         "react-lifecycles-compat": "^3.0.4"
       }
     },
+    "@reduxjs/toolkit": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.4.0.tgz",
+      "integrity": "sha512-hkxQwVx4BNVRsYdxjNF6cAseRmtrkpSlcgJRr3kLUcHPIAMZAmMJkXmHh/eUEGTMqPzsYpJLM7NN2w9fxQDuGw==",
+      "requires": {
+        "immer": "^7.0.3",
+        "redux": "^4.0.0",
+        "redux-thunk": "^2.3.0",
+        "reselect": "^4.0.0"
+      },
+      "dependencies": {
+        "immer": {
+          "version": "7.0.5",
+          "resolved": "https://registry.npmjs.org/immer/-/immer-7.0.5.tgz",
+          "integrity": "sha512-TtRAKZyuqld2eYjvWgXISLJ0ZlOl1OOTzRmrmiY8SlB0dnAhZ1OiykIDL5KDFNaPHDXiLfGQFNJGtet8z8AEmg=="
+        }
+      }
+    },
     "@rollup/plugin-node-resolve": {
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.3.tgz",
@@ -27115,6 +27133,11 @@
       "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
       "dev": true
     },
+    "reselect": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/reselect/-/reselect-4.0.0.tgz",
+      "integrity": "sha512-qUgANli03jjAyGlnbYVAV5vvnOmJnODyABz51RdBN7M4WaVu8mecZWgyQNkG8Yqe3KRGRt0l4K4B3XVEULC4CA=="
+    },
     "resize-observer-polyfill": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",

src/ensembl/package.json

@@ -49,6 +49,7 @@
   },
   "dependencies": {
     "@apollo/client": "3.0.2",
+    "@reduxjs/toolkit": "1.4.0",
     "@sentry/browser": "5.19.2",
     "classnames": "2.2.6",
     "connected-react-router": "6.8.0",
@@ -69,9 +70,7 @@
     "react-router-dom": "5.2.0",
     "react-spring": "8.0.27",
     "redux": "4.0.5",
-    "redux-devtools-extension": "2.13.8",
     "redux-observable": "1.2.0",
-    "redux-thunk": "2.3.0",
     "rxjs": "6.6.0",
     "typesafe-actions": "5.1.0",
     "what-input": "5.2.10"

src/ensembl/src/content/app/browser/browserReducer.ts

@@ -59,7 +59,10 @@ export function browserEntity(
         activeGenomeId
       };
       if (activeEnsObjectId) {
-        newState.activeEnsObjectIds[activeGenomeId] = activeEnsObjectId;
+        newState.activeEnsObjectIds = {
+          ...newState.activeEnsObjectIds,
+          [activeGenomeId]: activeEnsObjectId
+        };
       }
       return newState;
     }

src/ensembl/src/store.ts

@@ -14,40 +14,39 @@
  * limitations under the License.
  */
 
-import { applyMiddleware, createStore } from 'redux';
-import thunk from 'redux-thunk';
-import { composeWithDevTools } from 'redux-devtools-extension';
+import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit';
 import { createBrowserHistory } from 'history';
 import { routerMiddleware } from 'connected-react-router';
 import { StateType } from 'typesafe-actions';
 import { createEpicMiddleware } from 'redux-observable';
 
+import config from 'config';
+
 import createRootReducer from './root/rootReducer';
 import { analyticsMiddleWare } from './analyticsMiddleware';
 import rootEpic from './root/rootEpic';
 
 export const history = createBrowserHistory();
 
-const composeEnhancers = composeWithDevTools({});
 const epicMiddleware = createEpicMiddleware();
 
 const rootReducer = createRootReducer(history);
 
 export type RootState = StateType<typeof rootReducer>;
 
-export default function configureStore(preloadedState?: any) {
-  const store = createStore(
-    rootReducer,
-    preloadedState,
-    composeEnhancers(
-      applyMiddleware(
-        routerMiddleware(history),
-        thunk,
-        epicMiddleware,
-        analyticsMiddleWare
-      )
-    )
-  );
+const middleware = [
+  ...getDefaultMiddleware(),
+  routerMiddleware(history),
+  epicMiddleware,
+  analyticsMiddleWare
+];
+
+export default function getReduxStore() {
+  const store = configureStore({
+    reducer: rootReducer,
+    middleware,
+    devTools: config.isDevelopment
+  });
 
   epicMiddleware.run(rootEpic as any);