181 lines
5.3 KiB
JavaScript
Raw Normal View History

2016-08-18 11:41:13 +02:00
/**
* app.js
*
* This is the entry file for the application, only setup and boilerplate
* code.
*/
import 'babel-polyfill';
// Import all the third party stuff
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { applyRouterMiddleware, Router, browserHistory } from 'react-router';
import { syncHistoryWithStore } from 'react-router-redux';
import useScroll from 'react-router-scroll';
2016-09-06 16:59:56 +02:00
import _ from 'lodash';
2016-08-18 11:41:13 +02:00
import LanguageProvider from 'containers/LanguageProvider';
2016-09-30 18:25:04 +02:00
import NotificationProvider from 'containers/NotificationProvider';
2016-08-18 11:47:26 +02:00
import configureStore from './store';
2016-08-18 11:41:13 +02:00
// Import i18n messages
2017-08-14 15:22:42 +02:00
import { translationMessages, languages } from './i18n';
2016-08-18 11:41:13 +02:00
2016-08-18 11:47:26 +02:00
// Import the CSS reset, which HtmlWebpackPlugin transfers to the build folder
import 'sanitize.css/sanitize.css';
2016-08-18 11:41:13 +02:00
// Create redux store with history
// this uses the singleton browserHistory provided by react-router
// Optionally, this could be changed to leverage a created history
// e.g. `const browserHistory = useRouterHistory(createBrowserHistory)();`
const initialState = {};
const store = configureStore(initialState, browserHistory);
// Sync history and store, as the react-router-redux reducer
// is under the non-default key ("routing"), selectLocationState
// must be provided for resolving how to retrieve the "route" in the state
import { selectLocationState } from 'containers/App/selectors';
const history = syncHistoryWithStore(browserHistory, store, {
selectLocationState: selectLocationState(),
});
// Set up the router, wrapping all Routes in the App component
import App from 'containers/App';
import createRoutes from './routes';
const rootRoute = {
component: App,
childRoutes: createRoutes(store),
};
const render = (translatedMessages) => {
ReactDOM.render(
<Provider store={store}>
<LanguageProvider messages={translatedMessages}>
2016-09-30 18:25:04 +02:00
<NotificationProvider>
<Router
history={history}
routes={rootRoute}
render={
// Scroll to top when going to a new page, imitating default browser
// behaviour
applyRouterMiddleware(useScroll())
}
/>
</NotificationProvider>
2016-08-18 11:41:13 +02:00
</LanguageProvider>
</Provider>,
document.getElementById('app')
);
};
2016-08-18 11:47:26 +02:00
2016-08-18 11:41:13 +02:00
// Hot reloadable translation json files
if (module.hot) {
// modules.hot.accept does not accept dynamic dependencies,
// have to be constants at compile-time
module.hot.accept('./i18n', () => {
render(translationMessages);
});
}
// Chunked polyfill for browsers without Intl support
2016-09-09 11:21:54 +02:00
window.onload = function onLoad() {
if (!window.Intl) {
Promise.all([
System.import('intl'),
System.import('intl/locale-data/jsonp/en.js'),
2016-10-13 19:31:29 +02:00
System.import('intl/locale-data/jsonp/fr.js'),
2016-09-09 11:21:54 +02:00
]).then(() => render(translationMessages));
} else {
render(translationMessages);
}
};
2016-08-18 11:41:13 +02:00
// Install ServiceWorker and AppCache in the end since
// it's not most important operation and if main code fails,
// we do not want it installed
2016-09-06 16:59:56 +02:00
// import { install } from 'offline-plugin/runtime';
// install();
2016-08-26 11:05:38 +02:00
2017-03-18 17:34:00 +01:00
import { pluginLoaded, updatePlugin } from './containers/App/actions';
2016-08-26 11:05:38 +02:00
/**
* Public Strapi object exposed to the `window` object
*/
/**
* Register a plugin
*
* @param params
*/
2016-09-06 16:59:56 +02:00
const registerPlugin = (plugin) => {
2017-08-14 17:09:34 +02:00
const formattedPlugin = plugin;
2016-09-06 16:59:56 +02:00
// Add routes
// Initial list of routes
const homeRoute = rootRoute.childRoutes[0];
const pluginsRoute = _.find(homeRoute.childRoutes, { name: 'plugins' });
// Create a new prefixed route for each plugin routes
2017-08-14 17:09:34 +02:00
if (formattedPlugin && formattedPlugin.routes) {
formattedPlugin.routes.forEach(route => {
2016-09-06 16:59:56 +02:00
pluginsRoute.childRoutes.push({
2017-08-14 17:09:34 +02:00
path: `/plugins/${formattedPlugin.id}${route.path}`,
name: `plugins_${formattedPlugin.id}_${route.name}`,
2016-09-06 16:59:56 +02:00
getComponent: route.getComponent,
});
});
}
2016-10-13 19:31:29 +02:00
// Merge admin translation messages
2017-08-14 17:09:34 +02:00
_.merge(translationMessages, formattedPlugin.translationMessages);
formattedPlugin.leftMenuSections = formattedPlugin.leftMenuSections || [];
2016-09-30 18:25:04 +02:00
2017-08-14 17:09:34 +02:00
store.dispatch(pluginLoaded(formattedPlugin));
2016-08-26 11:05:38 +02:00
};
2016-09-30 18:25:04 +02:00
import { showNotification } from './containers/NotificationProvider/actions';
const displayNotification = (message, status) => {
store.dispatch(showNotification(message, status));
};
2016-10-13 19:31:29 +02:00
const port = window.Strapi && window.Strapi.port ? window.Strapi.port : 1337;
const apiUrl = window.Strapi && window.Strapi.apiUrl ? window.Strapi.apiUrl : `http://localhost:${port}`;
2016-08-26 11:05:38 +02:00
window.Strapi = {
registerPlugin,
2016-09-30 18:25:04 +02:00
notification: {
success: (message) => {
displayNotification(message, 'success');
},
warning: (message) => {
displayNotification(message, 'warning');
},
error: (message) => {
displayNotification(message, 'error');
},
info: (message) => {
displayNotification(message, 'info');
},
2016-10-05 11:32:31 +02:00
},
2016-10-13 19:31:29 +02:00
port,
apiUrl,
2017-03-18 17:34:00 +01:00
refresh: (pluginId) => ({
2016-10-13 19:31:29 +02:00
translationMessages: (translationMessagesUpdated) => {
render(_.merge({}, translationMessages, translationMessagesUpdated));
},
2017-08-14 17:09:34 +02:00
leftMenuSections: (leftMenuSectionsUpdated) => {
store.dispatch(updatePlugin(pluginId, 'leftMenuSections', leftMenuSectionsUpdated));
2017-03-18 17:34:00 +01:00
},
2016-10-13 19:31:29 +02:00
}),
2017-05-10 11:41:53 +02:00
router: browserHistory,
2017-08-14 15:22:42 +02:00
languages,
2016-08-26 11:05:38 +02:00
};
2016-09-30 18:25:04 +02:00
const dispatch = store.dispatch;
export {
dispatch,
2016-10-05 11:32:31 +02:00
};