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"
  },