Fix React hot loading

It seems that using react-loadable was breaking hot loading.
Changes to App/index.jsx would hot reload but any children components would not.

package.json

@@ -31,7 +31,6 @@
     "react": "^16",
     "react-dom": "^16",
     "react-hot-loader": "^4",
-    "react-loadable": "^5.5.0",
     "react-router-dom": "^4.3.1",
     "typeface-roboto": "^0.0.54"
   },

src/App/index.jsx

@@ -1,9 +1,10 @@
 import { hot } from 'react-hot-loader';
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { BrowserRouter, Switch, Route } from 'react-router-dom';
-import { withStyles } from '@material-ui/core';
+import { withStyles } from '@material-ui/core/styles';
 import ErrorPanel from '@mozilla-frontend-infra/components/ErrorPanel';
-import routes from './routes';
+import Main from '../views/Main';
 
 const styles = () => ({
   container: {
@@ -12,6 +13,10 @@ const styles = () => ({
 });
 
 class App extends Component {
+  static propTypes = {
+    classes: PropTypes.shape({}).isRequired,
+  };
+
   state = {
     error: undefined,
   };
@@ -25,9 +30,7 @@ class App extends Component {
         {error && <ErrorPanel error={new Error(error)} />}
         <BrowserRouter>
           <Switch>
-            {routes.map(props => (
-              <Route key={props.path} {...props} />
-            ))}
+            <Route path="/" component={Main} />
           </Switch>
         </BrowserRouter>
       </div>

src/App/routes.jsx

@@ -1,9 +0,0 @@
-import loadable from '../utils/loadable';
-
-export default [
-  {
-    component: loadable(() => import('../views/Main/index')),
-    path: '/',
-    exact: true,
-  },
-];

src/components/Spinner/index.jsx

@@ -1,28 +0,0 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import CircularProgress from '@material-ui/core/CircularProgress';
-
-const styles = ({
-  center: {
-    textAlign: 'center',
-  },
-});
-
-class Spinner extends PureComponent {
-  static propTypes = {
-    classes: PropTypes.shape({}).isRequired,
-  };
-
-  render() {
-    const { classes } = this.props;
-
-    return (
-      <div className={classes.center}>
-        <CircularProgress thickness={5} color="primary" />
-      </div>
-    );
-  }
-}
-
-export default withStyles(styles)(Spinner);

src/utils/loadable.jsx

@@ -1,40 +0,0 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import Loadable from 'react-loadable';
-import Spinner from '../components/Spinner';
-
-class Loading extends PureComponent {
-  content() {
-    const { error, timedOut, pastDelay } = this.props;
-
-    if (error) {
-      throw error;
-    } else if (timedOut || pastDelay) {
-      return <Spinner />;
-    }
-
-    return null;
-  }
-
-  render() {
-    return <div>{this.content()}</div>;
-  }
-}
-
-Loading.propTypes = {
-  error: PropTypes.shape({}),
-  timedOut: PropTypes.bool,
-  pastDelay: PropTypes.bool,
-};
-
-Loading.defaultProps = {
-  error: '',
-  timedOut: false,
-  pastDelay: false,
-};
-
-export default loader => Loadable({
-  loader,
-  loading: Loading,
-  timeout: 10000,
-});

yarn.lock

@@ -6851,7 +6851,7 @@ prompts@^0.1.9:
     kleur "^2.0.1"
     sisteransi "^0.1.1"
 
-prop-types@^15, prop-types@^15.5.0, prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2:
+prop-types@^15, prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
   integrity sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==
@@ -7065,13 +7065,6 @@ react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
   integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
 
-react-loadable@^5.5.0:
-  version "5.5.0"
-  resolved "https://registry.yarnpkg.com/react-loadable/-/react-loadable-5.5.0.tgz#582251679d3da86c32aae2c8e689c59f1196d8c4"
-  integrity sha512-C8Aui0ZpMd4KokxRdVAm2bQtI03k2RMRNzOB+IipV3yxFTSVICv7WoUr5L9ALB5BmKO1iHgZtWM8EvYG83otdg==
-  dependencies:
-    prop-types "^15.5.0"
-
 react-router-dom@^4.3.1:
   version "4.3.1"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.3.1.tgz#4c2619fc24c4fa87c9fd18f4fb4a43fe63fbd5c6"