index.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. /** @module SZTMExcel */
  2. // Import dependencies
  3. import React from 'react'
  4. import ReactDOM from 'react-dom'
  5. import { createStore, applyMiddleware, combineReducers, bindActionCreators, compose } from 'redux'
  6. import { Provider, connect } from 'react-redux'
  7. import createSagaMiddleware from 'redux-saga'
  8. import { all } from 'redux-saga/effects'
  9. /** react-router is not used in this project.
  10. import { browserHistory, Router, Route, IndexRoute } from 'react-router'
  11. import { syncHistoryWithStore, routerReducer } from 'react-router-redux'
  12. */
  13. // Import the main app
  14. import Main from './Main'
  15. // Import the submodules
  16. import playerList from './playerList'
  17. import calendar from './calendar'
  18. import layout from './layout'
  19. import scraper from './scraper'
  20. import alerts from './alerts'
  21. /**
  22. * Redux Section
  23. */
  24. /** The root reducer is combined from all sub-module reducers */
  25. const rootReducer = combineReducers({
  26. playerList: playerList.reducer,
  27. calendar: calendar.reducer,
  28. layout: layout.reducer,
  29. scraper: scraper.reducer,
  30. alerts: alerts.reducer
  31. })
  32. console.log('Root reducer:', rootReducer)
  33. /** The default state is combined from all sub-module states */
  34. const defaultState = {
  35. playerList: playerList.state,
  36. calendar: calendar.state,
  37. layout: layout.state,
  38. scraper: scraper.state,
  39. alerts: alerts.state
  40. }
  41. console.log('Default state:', defaultState)
  42. /** The root saga, calling all other sagas */
  43. function * rootSaga () {
  44. console.log('rootSaga called')
  45. yield all([
  46. playerList.saga(),
  47. calendar.saga(),
  48. layout.saga(),
  49. scraper.saga(),
  50. alerts.saga()
  51. ])
  52. }
  53. /** Create the saga middleware */
  54. const sagaMiddleware = createSagaMiddleware()
  55. const logger = store => next => action => {
  56. console.log('dispatching', action)
  57. let result = next(action)
  58. console.log('next state', store.getState())
  59. return result
  60. }
  61. const crashReporter = store => next => action => {
  62. try {
  63. return next(action)
  64. } catch (err) {
  65. console.error('Caught an exception!', err)
  66. throw err
  67. }
  68. }
  69. const middleware = [
  70. logger,
  71. crashReporter,
  72. alerts.middleware,
  73. sagaMiddleware
  74. ]
  75. /** The enhancer allows to use Redux development tools in Chrome */
  76. // see: https://github.com/zalmoxisus/redux-devtools-extension/issues/220
  77. let enhancer
  78. if (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__) {
  79. enhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(
  80. applyMiddleware(...middleware)
  81. )
  82. } else {
  83. enhancer = compose(
  84. applyMiddleware(...middleware)
  85. )
  86. }
  87. // const enhancer = compose(
  88. // applyMiddleware(alerts.middleware),
  89. // applyMiddleware(sagaMiddleware),
  90. // applyMiddleware(logger),
  91. // applyMiddleware(crashReporter),
  92. // window.devToolsExtension ? window.devToolsExtension() : f => f
  93. // )
  94. console.log('Enhancers:', enhancer)
  95. /** Build the Redux store from the rootReducer, the defualtState and the enhancers. */
  96. const store = createStore(rootReducer, defaultState, enhancer)
  97. console.log('Store:', store)
  98. sagaMiddleware.run(rootSaga)
  99. /** react-route is not used in this project.
  100. const history = syncHistoryWithStore(browserHistory, store)
  101. console.log('history:', history)
  102. */
  103. /** Collect the action creators from all modules in actionCreators */
  104. const actionCreators = {
  105. playerList: playerList.actions,
  106. calendar: calendar.actions,
  107. layout: layout.actions,
  108. scraper: scraper.actions,
  109. alerts: alerts.actions
  110. }
  111. /** Creates a function */
  112. function mapStateToProps (state) {
  113. const propState = {}
  114. Object.keys(state).forEach(key => {
  115. propState[key] = state[key]
  116. })
  117. console.log('Mapping state to props:', state, propState)
  118. return propState
  119. }
  120. function mapDispatchToProps (dispatch) {
  121. const boundActionCreators = {}
  122. console.log('ActionCreators', actionCreators)
  123. Object.keys(actionCreators).forEach(key => {
  124. boundActionCreators[`${key}Actions`] = bindActionCreators(actionCreators[key], dispatch)
  125. })
  126. console.log('Mapping dispatch to props:', dispatch, boundActionCreators)
  127. return boundActionCreators
  128. }
  129. const App = connect(mapStateToProps, mapDispatchToProps)(Main)
  130. /**
  131. * React-Router Section
  132. **/
  133. /** Combine the routes from all modules.
  134. const router = (
  135. <Provider store={store}>
  136. <Router history={history}>
  137. <Route component={App}>
  138. <Route path='/'>
  139. <IndexRoute component={demo_module.components.DemoModule} />
  140. <Route path='/project/:projectId' component={project.components.Project} />
  141. <Route path='/project' component={project.components.Project} />
  142. <Route path='/registermap/:registermapId' component={registermap.components.Registermap} />
  143. <Route path='/registermap' component={registermap.components.Registermap} />
  144. <Route path='/sample' component={Sample} />
  145. </Route>
  146. {demo_module.routes}
  147. <Route path='/login' />
  148. </Route>
  149. </Router>
  150. </Provider>
  151. )
  152. */
  153. const provider = (
  154. <Provider store={store}>
  155. <App />
  156. </Provider>
  157. )
  158. /**
  159. * Render the app
  160. **/
  161. ReactDOM.render(
  162. provider,
  163. document.getElementById('root')
  164. )