|
1 | 1 | // import necessary React/Redux libraries
|
| 2 | +import { createHashHistory } from 'history' |
| 3 | +import { connectRouter, routerMiddleware } from 'connected-react-router' |
2 | 4 | import React, { Component } from 'react'
|
3 | 5 | import { render } from 'react-dom'
|
4 |
| -import { createStore, combineReducers, applyMiddleware } from 'redux' |
| 6 | +import { createStore, combineReducers, applyMiddleware, compose } from 'redux' |
5 | 7 | import { Provider } from 'react-redux'
|
6 | 8 | import thunk from 'redux-thunk'
|
7 | 9 | import createLogger from 'redux-logger'
|
@@ -38,19 +40,29 @@ const initialQuery = {
|
38 | 40 | type: 'ITINERARY'
|
39 | 41 | }
|
40 | 42 |
|
| 43 | +const history = createHashHistory() |
| 44 | +const middleware = [ |
| 45 | + thunk, |
| 46 | + routerMiddleware(history) // for dispatching history actions |
| 47 | +] |
| 48 | + |
| 49 | +// check if app is being run in development mode. If so, enable redux-logger |
| 50 | +if (process.env.NODE_ENV === 'development') { |
| 51 | + middleware.push(createLogger()) |
| 52 | +} |
| 53 | + |
41 | 54 | // set up the Redux store
|
42 | 55 | const store = createStore(
|
43 | 56 | combineReducers({
|
44 |
| - otp: createOtpReducer(otpConfig) // add optional initial query here |
45 |
| - // add your own reducers if you want |
| 57 | + otp: createOtpReducer(otpConfig), |
| 58 | + router: connectRouter(history) |
46 | 59 | }),
|
47 |
| - applyMiddleware(thunk, createLogger()) |
| 60 | + compose(applyMiddleware(...middleware)) |
48 | 61 | )
|
49 | 62 |
|
50 | 63 | // define a simple responsive UI using Bootstrap and OTP-RR
|
51 | 64 | class OtpRRExample extends Component {
|
52 | 65 | render () {
|
53 |
| - |
54 | 66 | /** desktop view **/
|
55 | 67 | const desktopView = (
|
56 | 68 | <div className='otp'>
|
|
0 commit comments