silverstripe-framework/admin/client/src/boot/index.js

69 lines
2.8 KiB
JavaScript
Raw Normal View History

import BootRoutes from './BootRoutes';
import { combineReducers, createStore, applyMiddleware, compose } from 'redux';
import thunkMiddleware from 'redux-thunk';
import Config from 'lib/Config';
Correct naming for JS and CSS files in client/ Removed some dist/js/*.js files since they're no longer built as individual files. This was a side effect of them living in the toplevel folder of admin/client/src/, which used to have all the legacy/*.js files in there (they do need to be built). Following AirBnB convention: https://github.com/airbnb/javascript#naming--filename-matches-export While it technically allows index.js files, we found them to be bad for dev and debugging in practice: Depending on the used IDE, editor tabs all look the same. Other views like Chrome Dev Tools with sourcemaps rely on path context, and are harder to auto-complete. There's no direct rules for CSS files, but same principles apply here. Also renamed the sections/ folder to containers/, which more clearly communicates the distinction between components/ (shouldn't contain state-dependant, smart components). Renamed state/ files to follow AirBnB naming conventions https://github.com/airbnb/javascript#naming--filename-matches-export https://github.com/airbnb/javascript#naming--camelCase-default-export https://github.com/airbnb/javascript#naming--PascalCase-singleton Leaving the folder name in state/<state-key> lowercase since that's also the key to reducers in the actual state object. References: http://engineering.kapost.com/2016/01/organizing-large-react-applications/ https://github.com/erikras/react-redux-universal-hot-example/tree/master/src https://github.com/RickWong/react-isomorphic-starterkit/tree/master/src https://github.com/react-toolbox/react-toolbox/issues/98 https://github.com/react-bootstrap/react-bootstrap/tree/master/src
2016-04-21 11:59:44 +02:00
import reducerRegister from 'lib/ReducerRegister';
import injector from 'lib/Injector';
Correct naming for JS and CSS files in client/ Removed some dist/js/*.js files since they're no longer built as individual files. This was a side effect of them living in the toplevel folder of admin/client/src/, which used to have all the legacy/*.js files in there (they do need to be built). Following AirBnB convention: https://github.com/airbnb/javascript#naming--filename-matches-export While it technically allows index.js files, we found them to be bad for dev and debugging in practice: Depending on the used IDE, editor tabs all look the same. Other views like Chrome Dev Tools with sourcemaps rely on path context, and are harder to auto-complete. There's no direct rules for CSS files, but same principles apply here. Also renamed the sections/ folder to containers/, which more clearly communicates the distinction between components/ (shouldn't contain state-dependant, smart components). Renamed state/ files to follow AirBnB naming conventions https://github.com/airbnb/javascript#naming--filename-matches-export https://github.com/airbnb/javascript#naming--camelCase-default-export https://github.com/airbnb/javascript#naming--PascalCase-singleton Leaving the folder name in state/<state-key> lowercase since that's also the key to reducers in the actual state object. References: http://engineering.kapost.com/2016/01/organizing-large-react-applications/ https://github.com/erikras/react-redux-universal-hot-example/tree/master/src https://github.com/RickWong/react-isomorphic-starterkit/tree/master/src https://github.com/react-toolbox/react-toolbox/issues/98 https://github.com/react-bootstrap/react-bootstrap/tree/master/src
2016-04-21 11:59:44 +02:00
import * as configActions from 'state/config/ConfigActions';
import ConfigReducer from 'state/config/ConfigReducer';
import FormReducer from 'state/form/FormReducer';
Correct naming for JS and CSS files in client/ Removed some dist/js/*.js files since they're no longer built as individual files. This was a side effect of them living in the toplevel folder of admin/client/src/, which used to have all the legacy/*.js files in there (they do need to be built). Following AirBnB convention: https://github.com/airbnb/javascript#naming--filename-matches-export While it technically allows index.js files, we found them to be bad for dev and debugging in practice: Depending on the used IDE, editor tabs all look the same. Other views like Chrome Dev Tools with sourcemaps rely on path context, and are harder to auto-complete. There's no direct rules for CSS files, but same principles apply here. Also renamed the sections/ folder to containers/, which more clearly communicates the distinction between components/ (shouldn't contain state-dependant, smart components). Renamed state/ files to follow AirBnB naming conventions https://github.com/airbnb/javascript#naming--filename-matches-export https://github.com/airbnb/javascript#naming--camelCase-default-export https://github.com/airbnb/javascript#naming--PascalCase-singleton Leaving the folder name in state/<state-key> lowercase since that's also the key to reducers in the actual state object. References: http://engineering.kapost.com/2016/01/organizing-large-react-applications/ https://github.com/erikras/react-redux-universal-hot-example/tree/master/src https://github.com/RickWong/react-isomorphic-starterkit/tree/master/src https://github.com/react-toolbox/react-toolbox/issues/98 https://github.com/react-bootstrap/react-bootstrap/tree/master/src
2016-04-21 11:59:44 +02:00
import SchemaReducer from 'state/schema/SchemaReducer';
import RecordsReducer from 'state/records/RecordsReducer';
import CampaignReducer from 'state/campaign/CampaignReducer';
import BreadcrumbsReducer from 'state/breadcrumbs/BreadcrumbsReducer';
import TextField from 'components/TextField/TextField';
import HiddenField from 'components/HiddenField/HiddenField';
import GridField from 'components/GridField/GridField';
import FormAction from 'components/FormAction/FormAction';
import PopoverField from 'components/PopoverField/PopoverField';
import HeaderField from 'components/HeaderField/HeaderField';
import LiteralField from 'components/LiteralField/LiteralField';
import { routerReducer } from 'react-router-redux';
2016-03-22 04:27:44 +01:00
// Sections
// eslint-disable-next-line no-unused-vars
import CampaignAdmin from 'containers/CampaignAdmin/controller';
function appBoot() {
reducerRegister.add('config', ConfigReducer);
reducerRegister.add('form', FormReducer);
reducerRegister.add('schemas', SchemaReducer);
reducerRegister.add('records', RecordsReducer);
2016-04-12 00:24:16 +02:00
reducerRegister.add('campaign', CampaignReducer);
reducerRegister.add('breadcrumbs', BreadcrumbsReducer);
reducerRegister.add('routing', routerReducer);
injector.register('TextField', TextField);
injector.register('HiddenField', HiddenField);
injector.register('GridField', GridField);
injector.register('PopoverField', PopoverField);
injector.register('HeaderField', HeaderField);
injector.register('LiteralField', LiteralField);
injector.register('FormAction', FormAction);
2016-03-22 04:27:44 +01:00
const initialState = {};
const rootReducer = combineReducers(reducerRegister.getAll());
const middleware = [thunkMiddleware];
const env = Config.get('environment');
const debugging = Config.get('debugging');
let runMiddleware = applyMiddleware(...middleware);
const devTools = window.devToolsExtension;
if (env === 'dev' && debugging && typeof devTools === 'function') {
runMiddleware = compose(applyMiddleware(...middleware), devTools());
}
const createStoreWithMiddleware = runMiddleware(createStore);
const store = createStoreWithMiddleware(rootReducer, initialState);
2016-03-22 04:27:44 +01:00
// Set the initial config state.
store.dispatch(configActions.setConfig(Config.getAll()));
// Bootstrap routing
const routes = new BootRoutes(store);
routes.start(window.location.pathname);
}
window.onload = appBoot;