Files
TechRadarAJR/js/client.js
2017-02-21 21:54:38 +01:00

52 lines
1.4 KiB
JavaScript

import React from 'react';
import { render } from 'react-dom';
import { createStore, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import createHistory from 'history/createBrowserHistory';
import App from './components/App';
import appReducer from './reducer';
import actions, { NAVIGATE } from './actions';
// Remove .html and map / to index
const getPageNameFromPath = (path) => {
if (path === '/') {
return 'index';
}
return path.substring(1, path.length - 5);
}
const historyManager = store => {
const history = createHistory();
// If browser-back button is pressed, provide new pageName to store
history.listen((location, action) => {
if (action === 'POP') {
const pageName = getPageNameFromPath(location.pathname);
store.dispatch(actions.navigate(pageName, false))
}
});
return next => action => {
if(action.type === NAVIGATE && action.pushToHistory === true) {
history.push(`/${action.pageName}.html`);
}
return next(action);
}
}
// Grab the state from a global variable injected into the server-generated HTML
const preloadedState = window.__TECHRADAR__;
// Allow the passed state to be garbage-collected
delete window.__TECHRADAR__;
// Create Redux store with initial state
const store = createStore(appReducer, preloadedState, applyMiddleware(historyManager))
render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
)