4e12c45057
On changes to the react bundle webpack will store the current redux state in localStorage, waits (to allow the server to restart) then refreshes the page. On page load, it checks if it has state stored and loads it into the app.
78 lines
2.2 KiB
JavaScript
78 lines
2.2 KiB
JavaScript
import './es6-shims';
|
|
import Rx from 'rx';
|
|
import React from 'react';
|
|
import debug from 'debug';
|
|
import { Router } from 'react-router';
|
|
import { routeReducer as routing, syncHistory } from 'react-router-redux';
|
|
import { createHistory } from 'history';
|
|
|
|
import createApp from '../common/app';
|
|
import provideStore from '../common/app/provide-store';
|
|
|
|
// client specific sagas
|
|
import sagas from './sagas';
|
|
|
|
// render to observable
|
|
import render from '../common/app/utils/render';
|
|
import {
|
|
isColdStored,
|
|
getColdStorage,
|
|
saveToColdStorage
|
|
} from './cold-reload';
|
|
|
|
Rx.config.longStackSupport = !!debug.enabled;
|
|
|
|
const log = debug('fcc:client');
|
|
const DOMContainer = document.getElementById('fcc');
|
|
const hotReloadTimeout = 5000;
|
|
const csrfToken = window.__fcc__.csrf.token;
|
|
const initialState = isColdStored() ?
|
|
getColdStorage() :
|
|
window.__fcc__.data;
|
|
initialState.app.csrfToken = csrfToken;
|
|
|
|
const serviceOptions = { xhrPath: '/services', context: { _csrf: csrfToken } };
|
|
|
|
const history = createHistory();
|
|
const routingMiddleware = syncHistory(history);
|
|
|
|
const devTools = window.devToolsExtension ? window.devToolsExtension() : f => f;
|
|
const shouldRouterListenForReplays = !!window.devToolsExtension;
|
|
|
|
const clientSagaOptions = { doc: document };
|
|
|
|
|
|
createApp({
|
|
history,
|
|
serviceOptions,
|
|
initialState,
|
|
middlewares: [
|
|
routingMiddleware,
|
|
...sagas.map(saga => saga(clientSagaOptions))
|
|
],
|
|
reducers: { routing },
|
|
enhancers: [ devTools ]
|
|
})
|
|
.doOnNext(({ store }) => {
|
|
if (shouldRouterListenForReplays && store) {
|
|
log('routing middleware listening for replays');
|
|
routingMiddleware.listenForReplays(store);
|
|
}
|
|
if (module.hot && typeof module.hot.accept === 'function') {
|
|
module.hot.accept('../common/app', function() {
|
|
saveToColdStorage(store.getState());
|
|
setTimeout(() => window.location.reload(), hotReloadTimeout);
|
|
});
|
|
}
|
|
})
|
|
.doOnNext(() => log('rendering'))
|
|
.flatMap(({ props, store }) => render(
|
|
provideStore(React.createElement(Router, props), store),
|
|
DOMContainer
|
|
))
|
|
.subscribe(
|
|
() => debug('react rendered'),
|
|
err => { throw err; },
|
|
() => debug('react closed subscription')
|
|
);
|