|
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