From 1c7ab52d2e54068d010b3e40591b71a49487f8c3 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Wed, 17 Feb 2016 15:50:44 +0000 Subject: [PATCH] Use react-router-redux@4 --- examples/real-world/containers/App.js | 12 +++++------- examples/real-world/containers/RepoPage.js | 4 ++-- examples/real-world/containers/Root.dev.js | 6 +++--- examples/real-world/containers/Root.prod.js | 6 +++--- examples/real-world/containers/UserPage.js | 4 ++-- examples/real-world/index.js | 5 ++++- examples/real-world/package.json | 4 ++-- examples/real-world/reducers/index.js | 5 ++--- examples/real-world/store/configureStore.dev.js | 13 +++---------- examples/real-world/store/configureStore.prod.js | 4 +--- 10 files changed, 27 insertions(+), 36 deletions(-) diff --git a/examples/real-world/containers/App.js b/examples/real-world/containers/App.js index 5c98257f7f..f7db3cd2b8 100644 --- a/examples/real-world/containers/App.js +++ b/examples/real-world/containers/App.js @@ -1,6 +1,6 @@ import React, { Component, PropTypes } from 'react' import { connect } from 'react-redux' -import { push } from 'react-router-redux' +import { browserHistory } from 'react-router' import Explore from '../components/Explore' import { resetErrorMessage } from '../actions' @@ -17,7 +17,7 @@ class App extends Component { } handleChange(nextValue) { - this.props.push(`/${nextValue}`) + browserHistory.push(`/${nextValue}`) } renderErrorMessage() { @@ -56,20 +56,18 @@ App.propTypes = { // Injected by React Redux errorMessage: PropTypes.string, resetErrorMessage: PropTypes.func.isRequired, - push: PropTypes.func.isRequired, inputValue: PropTypes.string.isRequired, // Injected by React Router children: PropTypes.node } -function mapStateToProps(state) { +function mapStateToProps(state, ownProps) { return { errorMessage: state.errorMessage, - inputValue: state.routing.location.pathname.substring(1) + inputValue: ownProps.location.pathname.substring(1) } } export default connect(mapStateToProps, { - resetErrorMessage, - push + resetErrorMessage })(App) diff --git a/examples/real-world/containers/RepoPage.js b/examples/real-world/containers/RepoPage.js index c38d9cd4f2..e5e62c7c30 100644 --- a/examples/real-world/containers/RepoPage.js +++ b/examples/real-world/containers/RepoPage.js @@ -72,8 +72,8 @@ RepoPage.propTypes = { loadStargazers: PropTypes.func.isRequired } -function mapStateToProps(state, props) { - const { login, name } = props.params +function mapStateToProps(state, ownProps) { + const { login, name } = ownProps.params const { pagination: { stargazersByRepo }, entities: { users, repos } diff --git a/examples/real-world/containers/Root.dev.js b/examples/real-world/containers/Root.dev.js index e8726bfb0a..b0d828a01a 100644 --- a/examples/real-world/containers/Root.dev.js +++ b/examples/real-world/containers/Root.dev.js @@ -2,15 +2,15 @@ import React, { Component, PropTypes } from 'react' import { Provider } from 'react-redux' import routes from '../routes' import DevTools from './DevTools' -import { Router, browserHistory } from 'react-router' +import { Router } from 'react-router' export default class Root extends Component { render() { - const { store } = this.props + const { store, history } = this.props return (
- +
diff --git a/examples/real-world/containers/Root.prod.js b/examples/real-world/containers/Root.prod.js index adc514de9e..b8a363b7f1 100644 --- a/examples/real-world/containers/Root.prod.js +++ b/examples/real-world/containers/Root.prod.js @@ -1,14 +1,14 @@ import React, { Component, PropTypes } from 'react' import { Provider } from 'react-redux' import routes from '../routes' -import { Router, browserHistory } from 'react-router' +import { Router } from 'react-router' export default class Root extends Component { render() { - const { store } = this.props + const { store, history } = this.props return ( - + ) } diff --git a/examples/real-world/containers/UserPage.js b/examples/real-world/containers/UserPage.js index d5c7f8877f..29a25f0220 100644 --- a/examples/real-world/containers/UserPage.js +++ b/examples/real-world/containers/UserPage.js @@ -72,8 +72,8 @@ UserPage.propTypes = { loadStarred: PropTypes.func.isRequired } -function mapStateToProps(state, props) { - const { login } = props.params +function mapStateToProps(state, ownProps) { + const { login } = ownProps.params const { pagination: { starredByUser }, entities: { users, repos } diff --git a/examples/real-world/index.js b/examples/real-world/index.js index 3a8de9d2ef..aacfee6fb5 100644 --- a/examples/real-world/index.js +++ b/examples/real-world/index.js @@ -1,12 +1,15 @@ import 'babel-polyfill' import React from 'react' import { render } from 'react-dom' +import { browserHistory } from 'react-router' +import { syncHistoryWithStore } from 'react-router-redux' import Root from './containers/Root' import configureStore from './store/configureStore' const store = configureStore() +const history = syncHistoryWithStore(browserHistory, store) render( - , + , document.getElementById('root') ) diff --git a/examples/real-world/package.json b/examples/real-world/package.json index 58c41be120..717083e8e3 100644 --- a/examples/real-world/package.json +++ b/examples/real-world/package.json @@ -23,8 +23,8 @@ "react": "^0.14.7", "react-dom": "^0.14.7", "react-redux": "^4.2.1", - "react-router": "2.0.0-rc5", - "react-router-redux": "^2.1.0", + "react-router": "2.0.0", + "react-router-redux": "^4.0.0-rc.1", "redux": "^3.2.1", "redux-logger": "^2.4.0", "redux-thunk": "^1.0.3" diff --git a/examples/real-world/reducers/index.js b/examples/real-world/reducers/index.js index d45315fcb3..8dfda6b88a 100644 --- a/examples/real-world/reducers/index.js +++ b/examples/real-world/reducers/index.js @@ -1,7 +1,7 @@ import * as ActionTypes from '../actions' import merge from 'lodash/merge' import paginate from './paginate' -import { routeReducer } from 'react-router-redux' +import { routerReducer as routing } from 'react-router-redux' import { combineReducers } from 'redux' // Updates an entity cache in response to any action with response.entities. @@ -50,8 +50,7 @@ const rootReducer = combineReducers({ entities, pagination, errorMessage, - routing: routeReducer + routing }) - export default rootReducer diff --git a/examples/real-world/store/configureStore.dev.js b/examples/real-world/store/configureStore.dev.js index 4db7c98edd..c081a7b347 100644 --- a/examples/real-world/store/configureStore.dev.js +++ b/examples/real-world/store/configureStore.dev.js @@ -1,27 +1,20 @@ import { createStore, applyMiddleware, compose } from 'redux' -import { syncHistory } from 'react-router-redux' -import { browserHistory } from 'react-router' -import DevTools from '../containers/DevTools' import thunk from 'redux-thunk' -import api from '../middleware/api' import createLogger from 'redux-logger' +import api from '../middleware/api' import rootReducer from '../reducers' - -const reduxRouterMiddleware = syncHistory(browserHistory) +import DevTools from '../containers/DevTools' export default function configureStore(initialState) { const store = createStore( rootReducer, initialState, compose( - applyMiddleware(thunk, api, reduxRouterMiddleware, createLogger()), + applyMiddleware(thunk, api, createLogger()), DevTools.instrument() ) ) - // Required for replaying actions from devtools to work - reduxRouterMiddleware.listenForReplays(store) - if (module.hot) { // Enable Webpack hot module replacement for reducers module.hot.accept('../reducers', () => { diff --git a/examples/real-world/store/configureStore.prod.js b/examples/real-world/store/configureStore.prod.js index a45088f0e0..3a9b853caf 100644 --- a/examples/real-world/store/configureStore.prod.js +++ b/examples/real-world/store/configureStore.prod.js @@ -1,6 +1,4 @@ import { createStore, applyMiddleware } from 'redux' -import { syncHistory } from 'react-router-redux' -import { browserHistory } from 'react-router' import thunk from 'redux-thunk' import api from '../middleware/api' import rootReducer from '../reducers' @@ -9,6 +7,6 @@ export default function configureStore(initialState) { return createStore( rootReducer, initialState, - applyMiddleware(thunk, api, syncHistory(browserHistory)) + applyMiddleware(thunk, api) ) }