Cleanup server side renderer

app/Root.js

@@ -3,6 +3,7 @@
 import React from 'react';
 import { setStatusCode } from 'app/actions/RoutingActions';
 import { Router, applyRouterMiddleware } from 'react-router';
+import { hot } from 'react-hot-loader/root';
 import { Provider } from 'react-redux';
 import type { Store } from 'app/types';
 import { connect } from 'react-redux';
@@ -45,4 +46,4 @@ const RouteHandler = connect(
   )
 );
 
-export default Root;
+export default hot(Root);

app/index.js

@@ -23,7 +23,6 @@ import config from 'app/config';
 import raven from 'raven-js';
 import { browserHistory } from 'react-router';
 import { syncHistoryWithStore } from 'react-router-redux';
-import { isEmpty } from 'lodash';
 import configureStore from 'app/utils/configureStore';
 import renderApp from './render';
 import { fetchMeta } from 'app/actions/MetaActions';
@@ -47,28 +46,30 @@ raven
   .install();
 
 const preloadedState = window.__PRELOADED_STATE__;
+const isSSR = window.__IS_SSR__;
+
 const store = configureStore(preloadedState, {
   raven,
   getCookie: key => cookie.get(key)
 });
 
-if (isEmpty(preloadedState)) {
+if (isSSR) {
+  store.dispatch(maybeRefreshToken());
+} else {
   store
     .dispatch(loginAutomaticallyIfPossible())
     .then(() => store.dispatch(fetchMeta()))
     .then(() => store.dispatch(maybeRefreshToken()));
-} else {
-  store.dispatch(maybeRefreshToken());
 }
 
 const history = syncHistoryWithStore(browserHistory, store);
 
 store.dispatch({ type: 'REHYDRATED' });
 
-renderApp(store, history);
+renderApp({ store, history, isSSR });
 
 if (module.hot) {
   module.hot.accept('./render', () => {
-    renderApp(store, history);
+    renderApp({ store, history, isSSR });
   });
 }

app/render.js

@@ -2,20 +2,26 @@
 
 import React from 'react';
 // $FlowFixMe hydrate() is missing in flow-typed react-dom
-import { hydrate } from 'react-dom';
+import { hydrate, render } from 'react-dom';
 import { match } from 'react-router';
 import Root from './Root';
-import { AppContainer } from 'react-hot-loader';
 import routes from 'app/routes';
 import type { Store } from 'app/types';
 
-const renderApp = (store: Store, history: any) => {
+const renderApp = ({
+  store,
+  isSSR,
+  history
+}: {
+  store: Store,
+  history: any,
+  isSSR: boolean
+}) => {
   match({ history, routes }, (error, redirectLocation, renderProps) => {
     const rootElement: HTMLElement = (document.getElementById('root'): any);
-    hydrate(
-      <AppContainer>
-        <Root {...{ store, history, routes }} {...renderProps} />
-      </AppContainer>,
+    const reactRenderFunc = isSSR ? hydrate : render;
+    reactRenderFunc(
+      <Root {...{ store, history, routes }} {...renderProps} />,
       rootElement
     );
   });

config/webpack.client.js

@@ -98,12 +98,15 @@ module.exports = (env, argv) => {
       }),
 
       new AssetsPlugin({
-        path: path.join(root, 'dist-client')
+        path: outputPath
       })
     ]),
     resolve: {
       modules: [root, 'node_modules'],
       alias: {
+        // react-hot-loader imports merge like this "require('lodash/merge')"
+        // Aka. doesn't support our lodash-es alias by default
+        'lodash/merge': 'node_modules/lodash/merge.js',
         lodash: 'node_modules/lodash-es',
         'moment-timezone':
           'moment-timezone/builds/moment-timezone-with-data-2012-2022.min',

package.json

@@ -55,17 +55,16 @@
     "moment-timezone": "^0.5.23",
     "morgan": "^1.9.1",
     "normalizr": "^3.2.2",
-    "parse5": "^3.0.2",
     "prop-types": "^15.7.2",
     "qs": "^6.5.1",
     "raven": "^2.3.0",
     "raven-for-redux": "^1.2.0",
     "raven-js": "^3.21.0",
-    "react": "^16.8.2",
+    "react": "^16.8.6",
     "react-collapse": "^4.0.3",
     "react-copy-to-clipboard": "^5.0.1",
     "react-cropper": "^0.12.0",
-    "react-dom": "^16.8.2",
+    "react-dom": "npm:@hot-loader/react-dom@^16.8.6",
     "react-dropzone": "^3.10.0",
     "react-google-recaptcha": "^1.0.5",
     "react-helmet": "^5.2.0",
@@ -143,7 +142,7 @@
     "postcss-nested": "^4.1.2",
     "postcss-preset-env": "^6.6.0",
     "prettier": "1.16.1",
-    "react-hot-loader": "3.0.0-beta.4",
+    "react-hot-loader": "^4.8.4",
     "react-styleguidist": "^9.0.2",
     "redux-mock-store": "^1.2.2",
     "start-server-webpack-plugin": "^2.2.5",
@@ -152,12 +151,12 @@
     "stylelint-config-standard": "^16.0.0",
     "timekeeper": "^1.0.0",
     "url-loader": "^1.1.2",
-    "webpack": "^4.29.4",
-    "webpack-bundle-analyzer": "^3.0.4",
-    "webpack-cli": "^3.2.3",
-    "webpack-dev-middleware": "^3.6.0",
+    "webpack": "^4.31.0",
+    "webpack-bundle-analyzer": "^3.3.2",
+    "webpack-cli": "^3.3.2",
+    "webpack-dev-middleware": "^3.6.2",
     "webpack-filter-warnings-plugin": "^1.2.1",
-    "webpack-hot-middleware": "^2.24.3",
+    "webpack-hot-middleware": "^2.24.4",
     "webpack-node-externals": "^1.7.2",
     "webpack-stats-plugin": "^0.2.1"
   },