From ffe7934ead249941acba24b10354b8e76951b7a7 Mon Sep 17 00:00:00 2001
From: Nathan Bierema <nbierema@gmail.com>
Date: Sun, 30 Aug 2020 17:27:14 -0400
Subject: [PATCH] stash

---
 package.json                                  |   2 +
 packages/react-dock/tsconfig.webpack.json     |   3 -
 packages/redux-devtools-inspector/.babelrc    |  11 +-
 .../redux-devtools-inspector/.eslintrc.js     |   4 +-
 .../demo/config/tsconfig.json                 |   7 +
 .../{ => demo/config}/webpack.config.ts       |  17 +-
 .../demo/src/js/{DemoApp.jsx => DemoApp.tsx}  | 131 ++++++---
 .../src/js/{DevTools.jsx => DevTools.tsx}     |  12 +-
 .../demo/src/js/getOptions.js                 |  11 -
 .../demo/src/js/getOptions.ts                 |  20 ++
 .../demo/src/js/{index.js => index.tsx}       |  28 +-
 .../demo/src/js/reducers.js                   | 148 ----------
 .../demo/src/js/reducers.ts                   | 267 ++++++++++++++++++
 .../demo/tsconfig.json                        |   3 +
 .../redux-devtools-inspector/package.json     |   7 +-
 .../src/DevtoolsInspector.tsx                 |  45 ++-
 .../redux-devtools-inspector/tsconfig.json    |   3 +-
 .../tsconfig.webpack.json                     |   4 -
 yarn.lock                                     | 109 ++++++-
 19 files changed, 586 insertions(+), 246 deletions(-)
 create mode 100644 packages/redux-devtools-inspector/demo/config/tsconfig.json
 rename packages/redux-devtools-inspector/{ => demo/config}/webpack.config.ts (74%)
 rename packages/redux-devtools-inspector/demo/src/js/{DemoApp.jsx => DemoApp.tsx} (67%)
 rename packages/redux-devtools-inspector/demo/src/js/{DevTools.jsx => DevTools.tsx} (74%)
 delete mode 100644 packages/redux-devtools-inspector/demo/src/js/getOptions.js
 create mode 100644 packages/redux-devtools-inspector/demo/src/js/getOptions.ts
 rename packages/redux-devtools-inspector/demo/src/js/{index.js => index.tsx} (68%)
 delete mode 100644 packages/redux-devtools-inspector/demo/src/js/reducers.js
 create mode 100644 packages/redux-devtools-inspector/demo/src/js/reducers.ts
 delete mode 100644 packages/redux-devtools-inspector/tsconfig.webpack.json

diff --git a/package.json b/package.json
index 78acddc6..41b77f38 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,7 @@
     "@babel/cli": "^7.10.5",
     "@babel/core": "^7.11.1",
     "@babel/plugin-proposal-class-properties": "^7.10.4",
+    "@babel/plugin-transform-runtime": "^7.11.0",
     "@babel/preset-env": "^7.11.0",
     "@babel/preset-typescript": "^7.10.4",
     "@types/jest": "^26.0.9",
@@ -22,6 +23,7 @@
     "eslint-plugin-jest": "^23.20.0",
     "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-react": "^7.20.5",
+    "fork-ts-checker-webpack-plugin": "^5.1.0",
     "html-webpack-plugin": "^4.3.0",
     "jest": "^26.2.2",
     "lerna": "^3.22.1",
diff --git a/packages/react-dock/tsconfig.webpack.json b/packages/react-dock/tsconfig.webpack.json
index d030bb04..86bc1286 100644
--- a/packages/react-dock/tsconfig.webpack.json
+++ b/packages/react-dock/tsconfig.webpack.json
@@ -1,7 +1,4 @@
 {
   "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "js"
-  },
   "include": ["webpack.config.ts"]
 }
diff --git a/packages/redux-devtools-inspector/.babelrc b/packages/redux-devtools-inspector/.babelrc
index 0d42ef44..b5210a00 100644
--- a/packages/redux-devtools-inspector/.babelrc
+++ b/packages/redux-devtools-inspector/.babelrc
@@ -1,8 +1,7 @@
 {
-  "presets": [
-    "@babel/preset-env",
-    "@babel/preset-react",
-    "@babel/preset-typescript"
-  ],
-  "plugins": ["@babel/plugin-proposal-class-properties"]
+  "presets": ["@babel/env", "@babel/preset-react", "@babel/preset-typescript"],
+  "plugins": [
+    "@babel/plugin-proposal-class-properties",
+    "@babel/plugin-transform-runtime"
+  ]
 }
diff --git a/packages/redux-devtools-inspector/.eslintrc.js b/packages/redux-devtools-inspector/.eslintrc.js
index 8cc0f569..7c9be3fd 100644
--- a/packages/redux-devtools-inspector/.eslintrc.js
+++ b/packages/redux-devtools-inspector/.eslintrc.js
@@ -18,11 +18,11 @@ module.exports = {
       },
     },
     {
-      files: ['webpack.config.ts'],
+      files: ['demo/config/webpack.config.ts'],
       extends: '../../eslintrc.ts.base.json',
       parserOptions: {
         tsconfigRootDir: __dirname,
-        project: ['./tsconfig.webpack.json'],
+        project: ['./demo/config/tsconfig.json'],
       },
     },
   ],
diff --git a/packages/redux-devtools-inspector/demo/config/tsconfig.json b/packages/redux-devtools-inspector/demo/config/tsconfig.json
new file mode 100644
index 00000000..7fd5a7b8
--- /dev/null
+++ b/packages/redux-devtools-inspector/demo/config/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  "extends": "../../../../tsconfig.base.json",
+  "compilerOptions": {
+    "resolveJsonModule": true
+  },
+  "include": ["webpack.config.ts"]
+}
diff --git a/packages/redux-devtools-inspector/webpack.config.ts b/packages/redux-devtools-inspector/demo/config/webpack.config.ts
similarity index 74%
rename from packages/redux-devtools-inspector/webpack.config.ts
rename to packages/redux-devtools-inspector/demo/config/webpack.config.ts
index d383d031..c7b08800 100644
--- a/packages/redux-devtools-inspector/webpack.config.ts
+++ b/packages/redux-devtools-inspector/demo/config/webpack.config.ts
@@ -1,9 +1,9 @@
 import * as path from 'path';
 import * as webpack from 'webpack';
-import * as HtmlWebpackPlugin from 'html-webpack-plugin';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
 import { CleanWebpackPlugin } from 'clean-webpack-plugin';
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const pkg = require('./package.json');
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+import pkg from '../../package.json';
 
 const isProduction = process.env.NODE_ENV === 'production';
 
@@ -26,14 +26,14 @@ module.exports = {
         test: /\.(js|ts)x?$/,
         loader: 'babel-loader',
         include: [
-          path.join(__dirname, 'src'),
-          path.join(__dirname, 'demo/src/js'),
+          path.join(__dirname, '../../src'),
+          path.join(__dirname, '../src/js'),
         ],
       },
     ],
   },
   resolve: {
-    extensions: ['*', '.js', '.jsx'],
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
   },
   plugins: [
     new CleanWebpackPlugin(),
@@ -42,6 +42,11 @@ module.exports = {
       template: 'demo/src/index.html',
       package: pkg,
     }),
+    new ForkTsCheckerWebpackPlugin({
+      typescript: {
+        configFile: 'demo/tsconfig.json',
+      },
+    }),
   ].concat(isProduction ? [] : [new webpack.HotModuleReplacementPlugin()]),
   devServer: isProduction
     ? {}
diff --git a/packages/redux-devtools-inspector/demo/src/js/DemoApp.jsx b/packages/redux-devtools-inspector/demo/src/js/DemoApp.tsx
similarity index 67%
rename from packages/redux-devtools-inspector/demo/src/js/DemoApp.jsx
rename to packages/redux-devtools-inspector/demo/src/js/DemoApp.tsx
index af3103ab..50061058 100644
--- a/packages/redux-devtools-inspector/demo/src/js/DemoApp.jsx
+++ b/packages/redux-devtools-inspector/demo/src/js/DemoApp.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import { connect } from 'react-redux';
 import pkg from '../../../package.json';
 import Button from 'react-bootstrap/Button';
@@ -8,12 +8,45 @@ import FormLabel from 'react-bootstrap/FormLabel';
 import Form from 'react-bootstrap/Form';
 import Col from 'react-bootstrap/Col';
 import InputGroup from 'react-bootstrap/InputGroup';
+import Row from 'react-bootstrap/Row';
 import * as base16 from 'base16';
-import * as inspectorThemes from '../../../src/themes';
-import getOptions from './getOptions';
 import { push as pushRoute } from 'connected-react-router';
+import { Path } from 'history';
+import * as inspectorThemes from '../../../src/themes';
+import getOptions, { Options } from './getOptions';
+import {
+  AddFunctionAction,
+  AddHugeObjectAction,
+  AddImmutableMapAction,
+  AddIteratorAction,
+  AddNativeMapAction,
+  AddRecursiveAction,
+  AddSymbolAction,
+  ChangeImmutableNestedAction,
+  ChangeNestedAction,
+  DemoAppState,
+  HugePayloadAction,
+  IncrementAction,
+  PopAction,
+  PushAction,
+  PushHugeArrayAction,
+  ReplaceAction,
+  ShuffleArrayAction,
+  TimeoutUpdateAction,
+  ToggleTimeoutUpdateAction,
+} from './reducers';
 
-const styles = {
+const styles: {
+  wrapper: CSSProperties;
+  header: CSSProperties;
+  content: CSSProperties;
+  buttons: CSSProperties;
+  muted: CSSProperties;
+  button: CSSProperties;
+  links: CSSProperties;
+  link: CSSProperties;
+  input: CSSProperties;
+} = {
   wrapper: {
     height: '100vh',
     width: '80%',
@@ -57,18 +90,21 @@ const styles = {
 const themeOptions = [
   ...Object.keys(inspectorThemes).map((value) => ({
     value,
-    label: inspectorThemes[value].scheme,
+    label: inspectorThemes[value as keyof typeof inspectorThemes].scheme,
   })),
   null,
   ...Object.keys(base16)
-    .map((value) => ({ value, label: base16[value].scheme }))
+    .map((value) => ({
+      value,
+      label: base16[value as keyof typeof base16].scheme,
+    }))
     .filter((opt) => opt.label),
 ];
 
 const ROOT =
   process.env.NODE_ENV === 'production' ? '/redux-devtools-inspector/' : '/';
 
-function buildUrl(options) {
+function buildUrl(options: Options) {
   return (
     `${ROOT}?` +
     [
@@ -82,7 +118,32 @@ function buildUrl(options) {
   );
 }
 
-class DemoApp extends React.Component {
+interface Props
+  extends Omit<DemoAppState, 'addFunction' | 'addSymbol' | 'shuffleArray'> {
+  toggleTimeoutUpdate: (timeoutUpdateEnabled: boolean) => void;
+  timeoutUpdate: () => void;
+  increment: () => void;
+  push: () => void;
+  pop: () => void;
+  replace: () => void;
+  changeNested: () => void;
+  pushHugeArray: () => void;
+  addIterator: () => void;
+  addHugeObject: () => void;
+  addRecursive: () => void;
+  addNativeMap: () => void;
+  addImmutableMap: () => void;
+  changeImmutableNested: () => void;
+  hugePayload: () => void;
+  addFunction: () => void;
+  addSymbol: () => void;
+  shuffleArray: () => void;
+  pushRoute: (path: Path) => void;
+}
+
+class DemoApp extends React.Component<Props> {
+  timeout?: number;
+
   render() {
     const options = getOptions(this.props.router.location);
 
@@ -98,8 +159,8 @@ class DemoApp extends React.Component {
         </h5>
         <div style={styles.links}>
           <div style={styles.input}>
-            <Form horizontal>
-              <FormGroup>
+            <Form>
+              <FormGroup as={Row}>
                 <Col as={FormLabel} sm={3}>
                   Theme:
                 </Col>
@@ -115,7 +176,7 @@ class DemoApp extends React.Component {
                         <option
                           key={(theme && theme.label) || 'empty'}
                           label={(theme && theme.label) || '──────────'}
-                          value={theme && theme.value}
+                          value={theme ? theme.value : undefined}
                           disabled={!theme}
                         />
                       ))}
@@ -151,7 +212,7 @@ class DemoApp extends React.Component {
             <Button onClick={this.props.pushHugeArray} style={styles.button}>
               Push Huge Array
             </Button>
-            <Button onClick={this.props.addHugeObect} style={styles.button}>
+            <Button onClick={this.props.addHugeObject} style={styles.button}>
               Add Huge Object
             </Button>
             <Button onClick={this.props.addIterator} style={styles.button}>
@@ -226,7 +287,7 @@ class DemoApp extends React.Component {
     this.props.pushRoute(buildUrl({ ...options, dark: !options.dark }));
   };
 
-  setTheme = (options, theme) => {
+  setTheme = (options: Options, theme: string) => {
     this.props.pushRoute(buildUrl({ ...options, theme }));
   };
 
@@ -235,37 +296,41 @@ class DemoApp extends React.Component {
     this.props.toggleTimeoutUpdate(enabled);
 
     if (enabled) {
-      this.timeout = setInterval(this.props.timeoutUpdate, 1000);
+      this.timeout = window.setInterval(this.props.timeoutUpdate, 1000);
     } else {
       clearTimeout(this.timeout);
     }
   };
 }
 
-export default connect((state) => state, {
-  toggleTimeoutUpdate: (timeoutUpdateEnabled) => ({
+export default connect((state: DemoAppState) => state, {
+  toggleTimeoutUpdate: (
+    timeoutUpdateEnabled: boolean
+  ): ToggleTimeoutUpdateAction => ({
     type: 'TOGGLE_TIMEOUT_UPDATE',
     timeoutUpdateEnabled,
   }),
-  timeoutUpdate: () => ({ type: 'TIMEOUT_UPDATE' }),
-  increment: () => ({ type: 'INCREMENT' }),
-  push: () => ({ type: 'PUSH' }),
-  pop: () => ({ type: 'POP' }),
-  replace: () => ({ type: 'REPLACE' }),
-  changeNested: () => ({ type: 'CHANGE_NESTED' }),
-  pushHugeArray: () => ({ type: 'PUSH_HUGE_ARRAY' }),
-  addIterator: () => ({ type: 'ADD_ITERATOR' }),
-  addHugeObect: () => ({ type: 'ADD_HUGE_OBJECT' }),
-  addRecursive: () => ({ type: 'ADD_RECURSIVE' }),
-  addNativeMap: () => ({ type: 'ADD_NATIVE_MAP' }),
-  addImmutableMap: () => ({ type: 'ADD_IMMUTABLE_MAP' }),
-  changeImmutableNested: () => ({ type: 'CHANGE_IMMUTABLE_NESTED' }),
-  hugePayload: () => ({
+  timeoutUpdate: (): TimeoutUpdateAction => ({ type: 'TIMEOUT_UPDATE' }),
+  increment: (): IncrementAction => ({ type: 'INCREMENT' }),
+  push: (): PushAction => ({ type: 'PUSH' }),
+  pop: (): PopAction => ({ type: 'POP' }),
+  replace: (): ReplaceAction => ({ type: 'REPLACE' }),
+  changeNested: (): ChangeNestedAction => ({ type: 'CHANGE_NESTED' }),
+  pushHugeArray: (): PushHugeArrayAction => ({ type: 'PUSH_HUGE_ARRAY' }),
+  addIterator: (): AddIteratorAction => ({ type: 'ADD_ITERATOR' }),
+  addHugeObject: (): AddHugeObjectAction => ({ type: 'ADD_HUGE_OBJECT' }),
+  addRecursive: (): AddRecursiveAction => ({ type: 'ADD_RECURSIVE' }),
+  addNativeMap: (): AddNativeMapAction => ({ type: 'ADD_NATIVE_MAP' }),
+  addImmutableMap: (): AddImmutableMapAction => ({ type: 'ADD_IMMUTABLE_MAP' }),
+  changeImmutableNested: (): ChangeImmutableNestedAction => ({
+    type: 'CHANGE_IMMUTABLE_NESTED',
+  }),
+  hugePayload: (): HugePayloadAction => ({
     type: 'HUGE_PAYLOAD',
     payload: Array.from({ length: 10000 }).map((_, i) => i),
   }),
-  addFunction: () => ({ type: 'ADD_FUNCTION' }),
-  addSymbol: () => ({ type: 'ADD_SYMBOL' }),
-  shuffleArray: () => ({ type: 'SHUFFLE_ARRAY' }),
+  addFunction: (): AddFunctionAction => ({ type: 'ADD_FUNCTION' }),
+  addSymbol: (): AddSymbolAction => ({ type: 'ADD_SYMBOL' }),
+  shuffleArray: (): ShuffleArrayAction => ({ type: 'SHUFFLE_ARRAY' }),
   pushRoute,
 })(DemoApp);
diff --git a/packages/redux-devtools-inspector/demo/src/js/DevTools.jsx b/packages/redux-devtools-inspector/demo/src/js/DevTools.tsx
similarity index 74%
rename from packages/redux-devtools-inspector/demo/src/js/DevTools.jsx
rename to packages/redux-devtools-inspector/demo/src/js/DevTools.tsx
index 54ec696b..cf48d1d3 100644
--- a/packages/redux-devtools-inspector/demo/src/js/DevTools.jsx
+++ b/packages/redux-devtools-inspector/demo/src/js/DevTools.tsx
@@ -4,6 +4,9 @@ import { createDevTools } from 'redux-devtools';
 import DockMonitor from 'redux-devtools-dock-monitor';
 import DevtoolsInspector from '../../../src/DevtoolsInspector';
 import getOptions from './getOptions';
+import { base16Themes } from '../../../src/utils/createStylingFromTheme';
+import { Location } from 'history';
+import { DemoAppState } from './reducers';
 
 const CustomComponent = () => (
   <div
@@ -20,7 +23,7 @@ const CustomComponent = () => (
   </div>
 );
 
-export const getDevTools = (location) =>
+export const getDevTools = (location: { search: string }) =>
   createDevTools(
     <DockMonitor
       defaultIsVisible
@@ -29,8 +32,7 @@ export const getDevTools = (location) =>
       changeMonitorKey="ctrl-m"
     >
       <DevtoolsInspector
-        theme={getOptions(location).theme}
-        shouldPersistState
+        theme={getOptions(location).theme as keyof typeof base16Themes}
         invertTheme={!getOptions(location).dark}
         supportImmutable={getOptions(location).supportImmutable}
         tabs={(defaultTabs) => [
@@ -44,12 +46,12 @@ export const getDevTools = (location) =>
     </DockMonitor>
   );
 
-const UnconnectedDevTools = ({ location }) => {
+const UnconnectedDevTools = ({ location }: { location: Location }) => {
   const DevTools = getDevTools(location);
   return <DevTools />;
 };
 
-const mapStateToProps = (state) => ({
+const mapStateToProps = (state: DemoAppState) => ({
   location: state.router.location,
 });
 
diff --git a/packages/redux-devtools-inspector/demo/src/js/getOptions.js b/packages/redux-devtools-inspector/demo/src/js/getOptions.js
deleted file mode 100644
index b26e8222..00000000
--- a/packages/redux-devtools-inspector/demo/src/js/getOptions.js
+++ /dev/null
@@ -1,11 +0,0 @@
-export default function getOptions(location) {
-  return {
-    useExtension: location.search.indexOf('ext') !== -1,
-    supportImmutable: location.search.indexOf('immutable') !== -1,
-    theme: do {
-      const match = location.search.match(/theme=([^&]+)/);
-      match ? match[1] : 'inspector';
-    },
-    dark: location.search.indexOf('dark') !== -1,
-  };
-}
diff --git a/packages/redux-devtools-inspector/demo/src/js/getOptions.ts b/packages/redux-devtools-inspector/demo/src/js/getOptions.ts
new file mode 100644
index 00000000..2b8a0071
--- /dev/null
+++ b/packages/redux-devtools-inspector/demo/src/js/getOptions.ts
@@ -0,0 +1,20 @@
+export interface Options {
+  useExtension: boolean;
+  supportImmutable: boolean;
+  theme: string;
+  dark: boolean;
+}
+
+export default function getOptions(location: { search: string }) {
+  return {
+    useExtension: location.search.indexOf('ext') !== -1,
+    supportImmutable: location.search.indexOf('immutable') !== -1,
+    theme: getTheme(),
+    dark: location.search.indexOf('dark') !== -1,
+  };
+}
+
+function getTheme() {
+  const match = /theme=([^&]+)/.exec(location.search);
+  return match ? match[1] : 'inspector';
+}
diff --git a/packages/redux-devtools-inspector/demo/src/js/index.js b/packages/redux-devtools-inspector/demo/src/js/index.tsx
similarity index 68%
rename from packages/redux-devtools-inspector/demo/src/js/index.js
rename to packages/redux-devtools-inspector/demo/src/js/index.tsx
index 76306010..cfc1e852 100644
--- a/packages/redux-devtools-inspector/demo/src/js/index.js
+++ b/packages/redux-devtools-inspector/demo/src/js/index.tsx
@@ -1,19 +1,25 @@
 import React from 'react';
 import { render } from 'react-dom';
-import DemoApp from './DemoApp';
 import { Provider } from 'react-redux';
-import createRootReducer from './reducers';
-import { createStore, applyMiddleware, compose } from 'redux';
+import {
+  createStore,
+  applyMiddleware,
+  compose,
+  StoreEnhancerStoreCreator,
+  StoreEnhancer,
+} from 'redux';
 import logger from 'redux-logger';
 import { Route } from 'react-router';
 import { createBrowserHistory } from 'history';
 import { ConnectedRouter, routerMiddleware } from 'connected-react-router';
 import { persistState } from 'redux-devtools';
+import DemoApp from './DemoApp';
+import createRootReducer from './reducers';
 import getOptions from './getOptions';
 import { ConnectedDevTools, getDevTools } from './DevTools';
 
 function getDebugSessionKey() {
-  const matches = window.location.href.match(/[?&]debug_session=([^&#]+)\b/);
+  const matches = /[?&]debug_session=([^&#]+)\b/.exec(window.location.href);
   return matches && matches.length > 0 ? matches[1] : null;
 }
 
@@ -25,21 +31,23 @@ const DevTools = getDevTools(window.location);
 const history = createBrowserHistory();
 
 const useDevtoolsExtension =
-  !!window.__REDUX_DEVTOOLS_EXTENSION__ &&
-  getOptions(window.location).useExtension;
+  !!((window as unknown) as { __REDUX_DEVTOOLS_EXTENSION__: unknown })
+    .__REDUX_DEVTOOLS_EXTENSION__ && getOptions(window.location).useExtension;
 
 const enhancer = compose(
   applyMiddleware(logger, routerMiddleware(history)),
-  (...args) => {
+  (next: StoreEnhancerStoreCreator) => {
     const instrument = useDevtoolsExtension
-      ? window.__REDUX_DEVTOOLS_EXTENSION__()
+      ? ((window as unknown) as {
+          __REDUX_DEVTOOLS_EXTENSION__(): StoreEnhancer;
+        }).__REDUX_DEVTOOLS_EXTENSION__()
       : DevTools.instrument();
-    return instrument(...args);
+    return instrument(next);
   },
   persistState(getDebugSessionKey())
 );
 
-const store = createStore(createRootReducer(history), {}, enhancer);
+const store = createStore(createRootReducer(history), enhancer);
 
 render(
   <Provider store={store}>
diff --git a/packages/redux-devtools-inspector/demo/src/js/reducers.js b/packages/redux-devtools-inspector/demo/src/js/reducers.js
deleted file mode 100644
index aa7be2d1..00000000
--- a/packages/redux-devtools-inspector/demo/src/js/reducers.js
+++ /dev/null
@@ -1,148 +0,0 @@
-import Immutable from 'immutable';
-import shuffle from 'lodash.shuffle';
-import { combineReducers } from 'redux';
-import { connectRouter } from 'connected-react-router';
-
-const NESTED = {
-  long: {
-    nested: [
-      {
-        path: {
-          to: {
-            a: 'key',
-          },
-        },
-      },
-    ],
-  },
-};
-
-const IMMUTABLE_NESTED = Immutable.fromJS(NESTED);
-
-/* eslint-disable babel/new-cap */
-
-const IMMUTABLE_MAP = Immutable.Map({
-  map: Immutable.Map({ a: 1, b: 2, c: 3 }),
-  list: Immutable.List(['a', 'b', 'c']),
-  set: Immutable.Set(['a', 'b', 'c']),
-  stack: Immutable.Stack(['a', 'b', 'c']),
-  seq: Immutable.Seq([1, 2, 3, 4, 5, 6, 7, 8]),
-});
-
-const NATIVE_MAP = new window.Map([
-  [
-    'map',
-    new window.Map([
-      [{ first: true }, 1],
-      ['second', 2],
-    ]),
-  ],
-  [
-    'weakMap',
-    new window.WeakMap([
-      [{ first: true }, 1],
-      [{ second: 1 }, 2],
-    ]),
-  ],
-  ['set', new window.Set([{ first: true }, 'second'])],
-  ['weakSet', new window.WeakSet([{ first: true }, { second: 1 }])],
-]);
-
-/* eslint-enable babel/new-cap */
-
-const HUGE_ARRAY = Array.from({ length: 5000 }).map((_, key) => ({
-  str: 'key ' + key,
-}));
-
-const HUGE_OBJECT = Array.from({ length: 5000 }).reduce(
-  (o, _, key) => ((o['key ' + key] = 'item ' + key), o),
-  {}
-);
-
-const FUNC = function (a, b, c) {
-  return a + b + c;
-};
-
-const RECURSIVE = {};
-RECURSIVE.obj = RECURSIVE;
-
-function createIterator() {
-  const iterable = {};
-  iterable[window.Symbol.iterator] = function* iterator() {
-    for (var i = 0; i < 333; i++) {
-      yield 'item ' + i;
-    }
-  };
-
-  return iterable;
-}
-
-const DEFAULT_SHUFFLE_ARRAY = [0, 1, null, { id: 1 }, { id: 2 }, 'string'];
-
-const createRootReducer = (history) =>
-  combineReducers({
-    router: connectRouter(history),
-    timeoutUpdateEnabled: (state = false, action) =>
-      action.type === 'TOGGLE_TIMEOUT_UPDATE'
-        ? action.timeoutUpdateEnabled
-        : state,
-    store: (state = 0, action) =>
-      action.type === 'INCREMENT' ? state + 1 : state,
-    undefined: (state = { val: undefined }) => state,
-    null: (state = null) => state,
-    func: (state = () => {}) => state,
-    array: (state = [], action) =>
-      action.type === 'PUSH'
-        ? [...state, Math.random()]
-        : action.type === 'POP'
-        ? state.slice(0, state.length - 1)
-        : action.type === 'REPLACE'
-        ? [Math.random(), ...state.slice(1)]
-        : state,
-    hugeArrays: (state = [], action) =>
-      action.type === 'PUSH_HUGE_ARRAY' ? [...state, ...HUGE_ARRAY] : state,
-    hugeObjects: (state = [], action) =>
-      action.type === 'ADD_HUGE_OBJECT' ? [...state, HUGE_OBJECT] : state,
-    iterators: (state = [], action) =>
-      action.type === 'ADD_ITERATOR' ? [...state, createIterator()] : state,
-    nested: (state = NESTED, action) =>
-      action.type === 'CHANGE_NESTED'
-        ? {
-            ...state,
-            long: {
-              nested: [
-                {
-                  path: {
-                    to: {
-                      a: state.long.nested[0].path.to.a + '!',
-                    },
-                  },
-                },
-              ],
-            },
-          }
-        : state,
-    recursive: (state = [], action) =>
-      action.type === 'ADD_RECURSIVE' ? [...state, { ...RECURSIVE }] : state,
-    immutables: (state = [], action) =>
-      action.type === 'ADD_IMMUTABLE_MAP' ? [...state, IMMUTABLE_MAP] : state,
-    maps: (state = [], action) =>
-      action.type === 'ADD_NATIVE_MAP' ? [...state, NATIVE_MAP] : state,
-    immutableNested: (state = IMMUTABLE_NESTED, action) =>
-      action.type === 'CHANGE_IMMUTABLE_NESTED'
-        ? state.updateIn(
-            ['long', 'nested', 0, 'path', 'to', 'a'],
-            (str) => str + '!'
-          )
-        : state,
-    addFunction: (state = null, action) =>
-      action.type === 'ADD_FUNCTION' ? { f: FUNC } : state,
-    addSymbol: (state = null, action) =>
-      action.type === 'ADD_SYMBOL'
-        ? { s: window.Symbol('symbol'), error: new Error('TEST') }
-        : state,
-    shuffleArray: (state = DEFAULT_SHUFFLE_ARRAY, action) =>
-      action.type === 'SHUFFLE_ARRAY' ? shuffle(state) : state,
-  });
-
-export default createRootReducer;
diff --git a/packages/redux-devtools-inspector/demo/src/js/reducers.ts b/packages/redux-devtools-inspector/demo/src/js/reducers.ts
new file mode 100644
index 00000000..7d2e9941
--- /dev/null
+++ b/packages/redux-devtools-inspector/demo/src/js/reducers.ts
@@ -0,0 +1,267 @@
+import Immutable from 'immutable';
+import shuffle from 'lodash.shuffle';
+import { combineReducers, Reducer } from 'redux';
+import {
+  connectRouter,
+  LocationChangeAction,
+  RouterState,
+} from 'connected-react-router';
+import { History } from 'history';
+
+type Nested = { long: { nested: { path: { to: { a: string } } }[] } };
+
+const NESTED = {
+  long: {
+    nested: [
+      {
+        path: {
+          to: {
+            a: 'key',
+          },
+        },
+      },
+    ],
+  },
+};
+
+const IMMUTABLE_NESTED = Immutable.fromJS(NESTED);
+
+const IMMUTABLE_MAP = Immutable.Map({
+  map: Immutable.Map({ a: 1, b: 2, c: 3 }),
+  list: Immutable.List(['a', 'b', 'c']),
+  set: Immutable.Set(['a', 'b', 'c']),
+  stack: Immutable.Stack(['a', 'b', 'c']),
+  seq: Immutable.Seq([1, 2, 3, 4, 5, 6, 7, 8]),
+});
+
+type MapValue =
+  | Map<{ first: boolean } | string, number>
+  | WeakMap<{ first: boolean } | { second: number }, number>
+  | Set<{ first: boolean } | string>
+  | WeakSet<{ first: boolean } | { second: number }>;
+
+const NATIVE_MAP = new window.Map<string, MapValue>([
+  [
+    'map',
+    new window.Map<{ first: boolean } | string, number>([
+      [{ first: true }, 1],
+      ['second', 2],
+    ]),
+  ],
+  [
+    'weakMap',
+    new window.WeakMap<{ first: boolean } | { second: number }, number>([
+      [{ first: true }, 1],
+      [{ second: 1 }, 2],
+    ]),
+  ],
+  ['set', new window.Set([{ first: true }, 'second'])],
+  ['weakSet', new window.WeakSet([{ first: true }, { second: 1 }])],
+]);
+
+const HUGE_ARRAY = Array.from({ length: 5000 }).map((_, key) => ({
+  str: `key ${key}`,
+}));
+
+const HUGE_OBJECT = Array.from({ length: 5000 }).reduce(
+  (o: { [key: string]: string }, _, key) => (
+    (o[`key ${key}`] = `item ${key}`), o
+  ),
+  {}
+);
+
+const FUNC = function (a: number, b: number, c: number) {
+  return a + b + c;
+};
+
+const RECURSIVE: { obj?: unknown } = {};
+RECURSIVE.obj = RECURSIVE;
+
+function createIterator() {
+  const iterable: { [Symbol.iterator](): IterableIterator<string> } = {
+    [Symbol.iterator]: function* iterator() {
+      for (let i = 0; i < 333; i++) {
+        yield `item ${i}`;
+      }
+    },
+  };
+
+  return iterable;
+}
+
+const DEFAULT_SHUFFLE_ARRAY = [0, 1, null, { id: 1 }, { id: 2 }, 'string'];
+
+export interface ToggleTimeoutUpdateAction {
+  type: 'TOGGLE_TIMEOUT_UPDATE';
+  timeoutUpdateEnabled: boolean;
+}
+export interface TimeoutUpdateAction {
+  type: 'TIMEOUT_UPDATE';
+}
+export interface IncrementAction {
+  type: 'INCREMENT';
+}
+export interface PushAction {
+  type: 'PUSH';
+}
+export interface PopAction {
+  type: 'POP';
+}
+export interface ReplaceAction {
+  type: 'REPLACE';
+}
+export interface ChangeNestedAction {
+  type: 'CHANGE_NESTED';
+}
+export interface PushHugeArrayAction {
+  type: 'PUSH_HUGE_ARRAY';
+}
+export interface AddIteratorAction {
+  type: 'ADD_ITERATOR';
+}
+export interface AddHugeObjectAction {
+  type: 'ADD_HUGE_OBJECT';
+}
+export interface AddRecursiveAction {
+  type: 'ADD_RECURSIVE';
+}
+export interface AddNativeMapAction {
+  type: 'ADD_NATIVE_MAP';
+}
+export interface AddImmutableMapAction {
+  type: 'ADD_IMMUTABLE_MAP';
+}
+export interface ChangeImmutableNestedAction {
+  type: 'CHANGE_IMMUTABLE_NESTED';
+}
+export interface HugePayloadAction {
+  type: 'HUGE_PAYLOAD';
+  payload: number[];
+}
+export interface AddFunctionAction {
+  type: 'ADD_FUNCTION';
+}
+export interface AddSymbolAction {
+  type: 'ADD_SYMBOL';
+}
+export interface ShuffleArrayAction {
+  type: 'SHUFFLE_ARRAY';
+}
+type DemoAppAction =
+  | ToggleTimeoutUpdateAction
+  | TimeoutUpdateAction
+  | IncrementAction
+  | PushAction
+  | PopAction
+  | ReplaceAction
+  | ChangeNestedAction
+  | PushHugeArrayAction
+  | AddIteratorAction
+  | AddHugeObjectAction
+  | AddRecursiveAction
+  | AddNativeMapAction
+  | AddImmutableMapAction
+  | ChangeImmutableNestedAction
+  | HugePayloadAction
+  | AddFunctionAction
+  | AddSymbolAction
+  | ShuffleArrayAction
+  | LocationChangeAction;
+
+export interface DemoAppState {
+  router: RouterState;
+  timeoutUpdateEnabled: boolean;
+  store: number;
+  undefined: { val: undefined };
+  null: null;
+  func: () => void;
+  array: number[];
+  hugeArrays: { str: string }[];
+  hugeObjects: { [key: string]: string }[];
+  iterators: { [Symbol.iterator](): IterableIterator<string> }[];
+  nested: Nested;
+  recursive: { obj?: unknown }[];
+  immutables: Immutable.Map<string, unknown>[];
+  maps: Map<string, MapValue>[];
+  immutableNested: Immutable.Map<unknown, unknown>;
+  addFunction: { f: (a: number, b: number, c: number) => number } | null;
+  addSymbol: { s: symbol; error: Error } | null;
+  shuffleArray: unknown[];
+}
+
+const createRootReducer = (
+  history: History
+): Reducer<DemoAppState, DemoAppAction> =>
+  combineReducers<DemoAppState, DemoAppAction>({
+    router: connectRouter(history) as Reducer<RouterState, DemoAppAction>,
+    timeoutUpdateEnabled: (state = false, action: DemoAppAction) =>
+      action.type === 'TOGGLE_TIMEOUT_UPDATE'
+        ? action.timeoutUpdateEnabled
+        : state,
+    store: (state = 0, action) =>
+      action.type === 'INCREMENT' ? state + 1 : state,
+    undefined: (state = { val: undefined }) => state,
+    null: (state = null) => state,
+    func: (
+      state = () => {
+        // noop
+      }
+    ) => state,
+    array: (state = [], action: DemoAppAction) =>
+      action.type === 'PUSH'
+        ? [...state, Math.random()]
+        : action.type === 'POP'
+        ? state.slice(0, state.length - 1)
+        : action.type === 'REPLACE'
+        ? [Math.random(), ...state.slice(1)]
+        : state,
+    hugeArrays: (state = [], action: DemoAppAction) =>
+      action.type === 'PUSH_HUGE_ARRAY' ? [...state, ...HUGE_ARRAY] : state,
+    hugeObjects: (state = [], action: DemoAppAction) =>
+      action.type === 'ADD_HUGE_OBJECT' ? [...state, HUGE_OBJECT] : state,
+    iterators: (state = [], action: DemoAppAction) =>
+      action.type === 'ADD_ITERATOR' ? [...state, createIterator()] : state,
+    nested: (state = NESTED, action: DemoAppAction) =>
+      action.type === 'CHANGE_NESTED'
+        ? {
+            ...state,
+            long: {
+              nested: [
+                {
+                  path: {
+                    to: {
+                      a: state.long.nested[0].path.to.a + '!',
+                    },
+                  },
+                },
+              ],
+            },
+          }
+        : state,
+    recursive: (state: { obj?: unknown }[] = [], action: DemoAppAction) =>
+      action.type === 'ADD_RECURSIVE' ? [...state, { ...RECURSIVE }] : state,
+    immutables: (
+      state: Immutable.Map<string, unknown>[] = [],
+      action: DemoAppAction
+    ) =>
+      action.type === 'ADD_IMMUTABLE_MAP' ? [...state, IMMUTABLE_MAP] : state,
+    maps: (state: Map<string, MapValue>[] = [], action: DemoAppAction) =>
+      action.type === 'ADD_NATIVE_MAP' ? [...state, NATIVE_MAP] : state,
+    immutableNested: (state = IMMUTABLE_NESTED, action: DemoAppAction) =>
+      action.type === 'CHANGE_IMMUTABLE_NESTED'
+        ? state.updateIn(
+            ['long', 'nested', 0, 'path', 'to', 'a'],
+            (str: string) => str + '!'
+          )
+        : state,
+    addFunction: (state = null, action: DemoAppAction) =>
+      action.type === 'ADD_FUNCTION' ? { f: FUNC } : state,
+    addSymbol: (state = null, action: DemoAppAction) =>
+      action.type === 'ADD_SYMBOL'
+        ? { s: window.Symbol('symbol'), error: new Error('TEST') }
+        : state,
+    shuffleArray: (state = DEFAULT_SHUFFLE_ARRAY, action: DemoAppAction) =>
+      action.type === 'SHUFFLE_ARRAY' ? shuffle(state) : state,
+  });
+
+export default createRootReducer;
diff --git a/packages/redux-devtools-inspector/demo/tsconfig.json b/packages/redux-devtools-inspector/demo/tsconfig.json
index 2d04eaee..420884ce 100644
--- a/packages/redux-devtools-inspector/demo/tsconfig.json
+++ b/packages/redux-devtools-inspector/demo/tsconfig.json
@@ -1,4 +1,7 @@
 {
   "extends": "../../../tsconfig.react.base.json",
+  "compilerOptions": {
+    "resolveJsonModule": true
+  },
   "include": ["../src", "src"]
 }
diff --git a/packages/redux-devtools-inspector/package.json b/packages/redux-devtools-inspector/package.json
index 61acb6d4..47c8344f 100644
--- a/packages/redux-devtools-inspector/package.json
+++ b/packages/redux-devtools-inspector/package.json
@@ -21,7 +21,7 @@
     "url": "https://github.com/reduxjs/redux-devtools"
   },
   "scripts": {
-    "start": "webpack-dev-server",
+    "start": "webpack-dev-server --config demo/config/webpack.config.ts",
     "stats": "webpack --profile --json > stats.json",
     "build:demo": "NODE_ENV=production webpack -p",
     "build": "npm run build:types && npm run build:js",
@@ -52,11 +52,16 @@
     "redux-devtools-themes": "^1.0.0"
   },
   "devDependencies": {
+    "@babel/runtime": "^7.11.2",
     "@types/dateformat": "^3.0.1",
     "@types/hex-rgba": "^1.0.0",
+    "@types/history": "^4.7.7",
     "@types/lodash.debounce": "^4.0.6",
+    "@types/lodash.shuffle": "^4.2.6",
     "@types/react": "^16.9.46",
     "@types/react-dragula": "^1.1.0",
+    "@types/react-router": "^5.1.8",
+    "@types/redux-logger": "^3.0.8",
     "base16": "^1.0.0",
     "connected-react-router": "^6.8.0",
     "history": "^4.10.1",
diff --git a/packages/redux-devtools-inspector/src/DevtoolsInspector.tsx b/packages/redux-devtools-inspector/src/DevtoolsInspector.tsx
index 25d42721..5800feab 100644
--- a/packages/redux-devtools-inspector/src/DevtoolsInspector.tsx
+++ b/packages/redux-devtools-inspector/src/DevtoolsInspector.tsx
@@ -128,6 +128,32 @@ function createThemeState<S, A extends Action<unknown>>(
   return { base16Theme, styling };
 }
 
+interface ExternalProps<S, A extends Action<unknown>> {
+  dispatch: Dispatch<
+    DevtoolsInspectorAction | LiftedAction<S, A, DevtoolsInspectorState>
+  >;
+  preserveScrollTop?: boolean;
+  draggableActions: boolean;
+  select: (state: S) => unknown;
+  theme: keyof typeof base16Themes | Base16Theme;
+  supportImmutable: boolean;
+  diffObjectHash?: (item: unknown, index: number) => string;
+  diffPropertyFilter?: (name: string, context: DiffContext) => boolean;
+  hideMainButtons?: boolean;
+  hideActionButtons?: boolean;
+  invertTheme: boolean;
+  dataTypeKey?: string;
+  tabs: Tab<S, A>[] | ((tabs: Tab<S, A>[]) => Tab<S, A>[]);
+}
+
+interface DefaultProps {
+  select: (state: unknown) => unknown;
+  supportImmutable: boolean;
+  draggableActions: boolean;
+  theme: keyof typeof base16Themes;
+  invertTheme: boolean;
+}
+
 export interface DevtoolsInspectorProps<S, A extends Action<unknown>>
   extends LiftedState<S, A, DevtoolsInspectorState> {
   dispatch: Dispatch<
@@ -156,10 +182,10 @@ interface State<S, A extends Action<unknown>> {
   themeState: { base16Theme: Base16Theme; styling: StylingFunction };
 }
 
-export default class DevtoolsInspector<
-  S,
-  A extends Action<unknown>
-> extends PureComponent<DevtoolsInspectorProps<S, A>, State<S, A>> {
+class DevtoolsInspector<S, A extends Action<unknown>> extends PureComponent<
+  DevtoolsInspectorProps<S, A>,
+  State<S, A>
+> {
   state: State<S, A> = {
     ...createIntermediateState(this.props, this.props.monitorState),
     isWideLayout: false,
@@ -436,3 +462,14 @@ export default class DevtoolsInspector<
     this.updateMonitorState({ tabName });
   };
 }
+
+export default (DevtoolsInspector as unknown) as React.ComponentType<
+  ExternalProps<unknown, Action<unknown>>
+> & {
+  update(
+    monitorProps: ExternalProps<unknown, Action<unknown>>,
+    state: DevtoolsInspectorState | undefined,
+    action: DevtoolsInspectorAction
+  ): DevtoolsInspectorState;
+  defaultProps: DefaultProps;
+};
diff --git a/packages/redux-devtools-inspector/tsconfig.json b/packages/redux-devtools-inspector/tsconfig.json
index 7b7d1492..5c73f98c 100644
--- a/packages/redux-devtools-inspector/tsconfig.json
+++ b/packages/redux-devtools-inspector/tsconfig.json
@@ -1,7 +1,8 @@
 {
   "extends": "../../tsconfig.react.base.json",
   "compilerOptions": {
-    "outDir": "lib"
+    "outDir": "lib",
+    "resolveJsonModule": true
   },
   "include": ["src"]
 }
diff --git a/packages/redux-devtools-inspector/tsconfig.webpack.json b/packages/redux-devtools-inspector/tsconfig.webpack.json
deleted file mode 100644
index 86bc1286..00000000
--- a/packages/redux-devtools-inspector/tsconfig.webpack.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "include": ["webpack.config.ts"]
-}
diff --git a/yarn.lock b/yarn.lock
index 28bf49fc..3eaea5c1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -25,7 +25,7 @@
   dependencies:
     "@babel/highlight" "^7.0.0"
 
-"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4":
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.8.3":
   version "7.10.4"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.10.4.tgz#168da1a36e90da68ae8d49c0f1b48c7c6249213a"
   integrity sha512-vG6SvB6oYEhvgisZNFRmRCUkLz11c7rp+tbNTynGqc6mS1d5ATd/sGyV6W0KZZnXRKMTzZDRgQT3Ou9jhpAfUg==
@@ -1224,7 +1224,7 @@
   dependencies:
     regenerator-runtime "^0.12.0"
 
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7":
   version "7.11.2"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.11.2.tgz#f549c13c754cc40b87644b9fa9f09a6a95fe0736"
   integrity sha512-TeWkU52so0mPtDcaCTxNBI/IHiz0pZgr8VEFqXFtZWpYD08ZB6FaSwVAS8MKRQAP3bYKiVjwysOJgMFY28o6Tw==
@@ -3136,6 +3136,11 @@
   resolved "https://registry.yarnpkg.com/@types/hex-rgba/-/hex-rgba-1.0.0.tgz#b2aed2aa9fdd6152b7f0ac5e3733b974d4eba35a"
   integrity sha512-u3AGV8fjRsDBqY4wOvVWhVCgKDfh2b0h3mux7KPKU1cm/6mJp14OWBINLgBypeBTM89Nm2j+eKQqIoIe7150DA==
 
+"@types/history@*", "@types/history@^4.7.7":
+  version "4.7.7"
+  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.7.tgz#613957d900fab9ff84c8dfb24fa3eef0c2a40896"
+  integrity sha512-2xtoL22/3Mv6a70i4+4RB7VgbDDORoWwjcqeNysojZA0R7NK17RbY5Gof/2QiFfJgX+KkWghbwJ+d/2SB8Ndzg==
+
 "@types/hoist-non-react-statics@*", "@types/hoist-non-react-statics@^3.3.0":
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
@@ -3205,7 +3210,7 @@
     jest-diff "^25.2.1"
     pretty-format "^25.2.1"
 
-"@types/json-schema@^7.0.3", "@types/json-schema@^7.0.4":
+"@types/json-schema@^7.0.3", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.5":
   version "7.0.5"
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.5.tgz#dcce4430e64b443ba8945f0290fb564ad5bac6dd"
   integrity sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ==
@@ -3224,6 +3229,13 @@
   dependencies:
     "@types/lodash" "*"
 
+"@types/lodash.shuffle@^4.2.6":
+  version "4.2.6"
+  resolved "https://registry.yarnpkg.com/@types/lodash.shuffle/-/lodash.shuffle-4.2.6.tgz#191b0fc66699214558352123811d1657d9ed8930"
+  integrity sha512-ucI9VswlV9jOZiIh43Nd0tJ4Z8pfXy3PbQ9cB6Re1gPds8gLbOdmB0l3UkVI2crZjnQB95bhyNZVEDH8DgglYA==
+  dependencies:
+    "@types/lodash" "*"
+
 "@types/lodash@*", "@types/lodash@^4.14.159":
   version "4.14.159"
   resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.159.tgz#61089719dc6fdd9c5cb46efc827f2571d1517065"
@@ -3330,6 +3342,14 @@
     hoist-non-react-statics "^3.3.0"
     redux "^4.0.0"
 
+"@types/react-router@^5.1.8":
+  version "5.1.8"
+  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.8.tgz#4614e5ba7559657438e17766bb95ef6ed6acc3fa"
+  integrity sha512-HzOyJb+wFmyEhyfp4D4NYrumi+LQgQL/68HvJO+q6XtuHSDvw6Aqov7sCAhjbNq3bUPgPqbdvjXC5HeB2oEAPg==
+  dependencies:
+    "@types/history" "*"
+    "@types/react" "*"
+
 "@types/react-test-renderer@^16.9.3":
   version "16.9.3"
   resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-16.9.3.tgz#96bab1860904366f4e848b739ba0e2f67bcae87e"
@@ -3359,6 +3379,13 @@
   dependencies:
     "@types/base16" "*"
 
+"@types/redux-logger@^3.0.8":
+  version "3.0.8"
+  resolved "https://registry.yarnpkg.com/@types/redux-logger/-/redux-logger-3.0.8.tgz#1fb6d26917bb198792bb1cf57feb31cae1532c5d"
+  integrity sha512-zM+cxiSw6nZtRbxpVp9SE3x/X77Z7e7YAfHD1NkxJyJbAGSXJGF0E9aqajZfPOa/sTYnuwutmlCldveExuCeLw==
+  dependencies:
+    redux "^4.0.0"
+
 "@types/serve-static@*":
   version "1.13.5"
   resolved "https://registry.yarnpkg.com/@types/serve-static/-/serve-static-1.13.5.tgz#3d25d941a18415d3ab092def846e135a08bbcf53"
@@ -4287,6 +4314,11 @@ asynckit@^0.4.0:
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
   integrity sha1-x57Zf380y48robyXkLzDZkdLS3k=
 
+at-least-node@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/at-least-node/-/at-least-node-1.0.0.tgz#602cd4b46e844ad4effc92a8011a3c46e0238dc2"
+  integrity sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==
+
 atoa@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/atoa/-/atoa-1.0.0.tgz#0cc0e91a480e738f923ebc103676471779b34a49"
@@ -7903,6 +7935,23 @@ forever-agent@~0.6.1:
   resolved "https://registry.yarnpkg.com/forever-agent/-/forever-agent-0.6.1.tgz#fbc71f0c41adeb37f96c577ad1ed42d8fdacca91"
   integrity sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=
 
+fork-ts-checker-webpack-plugin@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-5.1.0.tgz#586fbee24aeea950c53bab529e32017f543e71cf"
+  integrity sha512-vuKyEjSLGbhQbEr5bifXXOkr9iV73L6n72mHoHIv7okvrf7O7z6RKeplM6C6ATPsukoQivij+Ba1vcptL60Z2g==
+  dependencies:
+    "@babel/code-frame" "^7.8.3"
+    "@types/json-schema" "^7.0.5"
+    chalk "^4.1.0"
+    cosmiconfig "^6.0.0"
+    deepmerge "^4.2.2"
+    fs-extra "^9.0.0"
+    memfs "^3.1.2"
+    minimatch "^3.0.4"
+    schema-utils "2.7.0"
+    semver "^7.3.2"
+    tapable "^1.0.0"
+
 form-data@^2.3.1:
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.5.1.tgz#f2cbec57b5e59e23716e128fe44d4e5dd23895f4"
@@ -7989,6 +8038,16 @@ fs-extra@^8.1.0:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
+fs-extra@^9.0.0:
+  version "9.0.1"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-9.0.1.tgz#910da0062437ba4c39fedd863f1675ccfefcb9fc"
+  integrity sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==
+  dependencies:
+    at-least-node "^1.0.0"
+    graceful-fs "^4.2.0"
+    jsonfile "^6.0.1"
+    universalify "^1.0.0"
+
 fs-minipass@^1.2.5:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/fs-minipass/-/fs-minipass-1.2.7.tgz#ccff8570841e7fe4265693da88936c55aed7f7c7"
@@ -7996,6 +8055,11 @@ fs-minipass@^1.2.5:
   dependencies:
     minipass "^2.6.0"
 
+fs-monkey@1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/fs-monkey/-/fs-monkey-1.0.1.tgz#4a82f36944365e619f4454d9fff106553067b781"
+  integrity sha512-fcSa+wyTqZa46iWweI7/ZiUfegOZl0SG8+dltIwFXo7+zYU9J9kpS3NB6pZcSlJdhvIwp81Adx2XhZorncxiaA==
+
 fs-readdir-recursive@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/fs-readdir-recursive/-/fs-readdir-recursive-1.1.0.tgz#e32fc030a2ccee44a6b5371308da54be0b397d27"
@@ -10265,6 +10329,15 @@ jsonfile@^4.0.0:
   optionalDependencies:
     graceful-fs "^4.1.6"
 
+jsonfile@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-6.0.1.tgz#98966cba214378c8c84b82e085907b40bf614179"
+  integrity sha512-jR2b5v7d2vIOust+w3wtFKZIfpC2pnRmFAhAC/BuweZFQR8qZzxH1OyrQ10HmdVYiXWkYUqPVsz91cG7EL2FBg==
+  dependencies:
+    universalify "^1.0.0"
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 jsonify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/jsonify/-/jsonify-0.0.0.tgz#2c74b6ee41d93ca51b7b5aaee8f503631d252a73"
@@ -11123,6 +11196,13 @@ media-typer@0.3.0:
   resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
   integrity sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=
 
+memfs@^3.1.2:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/memfs/-/memfs-3.2.0.tgz#f9438e622b5acd1daa8a4ae160c496fdd1325b26"
+  integrity sha512-f/xxz2TpdKv6uDn6GtHee8ivFyxwxmPuXatBb1FBwxYNuVpbM3k/Y1Z+vC0mH/dIXXrukYfe3qe5J32Dfjg93A==
+  dependencies:
+    fs-monkey "1.0.1"
+
 memory-fs@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
@@ -14318,6 +14398,15 @@ scheduler@^0.19.1:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+schema-utils@2.7.0, schema-utils@^2.6.5, schema-utils@^2.6.6, schema-utils@^2.7.0:
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.0.tgz#17151f76d8eae67fbbf77960c33c676ad9f4efc7"
+  integrity sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==
+  dependencies:
+    "@types/json-schema" "^7.0.4"
+    ajv "^6.12.2"
+    ajv-keywords "^3.4.1"
+
 schema-utils@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-1.0.0.tgz#0b79a93204d7b600d4b2850d1f66c2a34951c770"
@@ -14327,15 +14416,6 @@ schema-utils@^1.0.0:
     ajv-errors "^1.0.0"
     ajv-keywords "^3.1.0"
 
-schema-utils@^2.6.5, schema-utils@^2.6.6, schema-utils@^2.7.0:
-  version "2.7.0"
-  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.0.tgz#17151f76d8eae67fbbf77960c33c676ad9f4efc7"
-  integrity sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==
-  dependencies:
-    "@types/json-schema" "^7.0.4"
-    ajv "^6.12.2"
-    ajv-keywords "^3.4.1"
-
 seamless-immutable@^7.1.4:
   version "7.1.4"
   resolved "https://registry.yarnpkg.com/seamless-immutable/-/seamless-immutable-7.1.4.tgz#6e9536def083ddc4dea0207d722e0e80d0f372f8"
@@ -16128,6 +16208,11 @@ universalify@^0.1.0:
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
   integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==
 
+universalify@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/universalify/-/universalify-1.0.0.tgz#b61a1da173e8435b2fe3c67d29b9adf8594bd16d"
+  integrity sha512-rb6X1W158d7pRQBg5gkR8uPaSfiids68LTJQYOtEUhoJUWBdaQHsuT/EUduxXYxcrt4r5PJ4fuHW1MHT6p0qug==
+
 unpipe@1.0.0, unpipe@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec"