Skip to content
This repository was archived by the owner on Oct 26, 2018. It is now read-only.

Commit 8d5b39b

Browse files
committed
Merge pull request #259 from reactjs/synchronicity
Split history syncing from action creators
2 parents 83462cc + 8d4750e commit 8d5b39b

32 files changed

+1031
-870
lines changed

.babelrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"presets": ["es2015", "stage-2"]
2+
"presets": ["es2015", "stage-1"]
33
}

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
lib
22
node_modules
33
coverage
4+
*.log

README.md

Lines changed: 89 additions & 84 deletions
Large diffs are not rendered by default.

examples/basic/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ This example also demonstrates integration with
1313

1414
1. Install dependencies with `npm install` in this directory (make sure it creates a local node_modules)
1515
2. By default, it uses the local version from `src` of react-router-redux, so you need to run `npm install` from there first. If you want to use a version straight from npm, remove the lines in `webpack.config.js` at the bottom.
16-
3. Build with `webpack --watch`
17-
4. Open `index.html`
16+
3. Start build with `npm start`
17+
4. Open [http://localhost:8080/](http://localhost:8080/)
1818

1919
-
2020

examples/basic/app.js

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -4,38 +4,35 @@ import DockMonitor from 'redux-devtools-dock-monitor'
44

55
import React from 'react'
66
import ReactDOM from 'react-dom'
7-
import { applyMiddleware, compose, createStore, combineReducers } from 'redux'
7+
import { createStore, combineReducers } from 'redux'
88
import { Provider } from 'react-redux'
99
import { Router, Route, IndexRoute, browserHistory } from 'react-router'
10-
import { syncHistory, routeReducer } from 'react-router-redux'
10+
import { syncHistoryWithStore, routerReducer } from 'react-router-redux'
1111

1212
import * as reducers from './reducers'
1313
import { App, Home, Foo, Bar } from './components'
1414

15-
const middleware = syncHistory(browserHistory)
1615
const reducer = combineReducers({
1716
...reducers,
18-
routing: routeReducer
17+
routing: routerReducer
1918
})
2019

2120
const DevTools = createDevTools(
22-
<DockMonitor toggleVisibilityKey="ctrl-h"
23-
changePositionKey="ctrl-q">
21+
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q">
2422
<LogMonitor theme="tomorrow" preserveScrollTop={false} />
2523
</DockMonitor>
2624
)
2725

28-
const finalCreateStore = compose(
29-
applyMiddleware(middleware),
26+
const store = createStore(
27+
reducer,
3028
DevTools.instrument()
31-
)(createStore)
32-
const store = finalCreateStore(reducer)
33-
middleware.listenForReplays(store)
29+
)
30+
const history = syncHistoryWithStore(browserHistory, store)
3431

3532
ReactDOM.render(
3633
<Provider store={store}>
3734
<div>
38-
<Router history={browserHistory}>
35+
<Router history={history}>
3936
<Route path="/" component={App}>
4037
<IndexRoute component={Home}/>
4138
<Route path="foo" component={Foo}/>

examples/basic/components/App.js

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
import React from 'react'
2-
import { Link } from 'react-router'
3-
import { connect } from 'react-redux'
4-
import { routeActions } from 'react-router-redux'
2+
import { Link, hashHistory } from 'react-router'
53

6-
function App({ push, children }) {
4+
export default function App({ children }) {
75
return (
86
<div>
97
<header>
@@ -16,14 +14,9 @@ function App({ push, children }) {
1614
<Link to="/bar">Bar</Link>
1715
</header>
1816
<div>
19-
<button onClick={() => push('/foo')}>Go to /foo</button>
17+
<button onClick={() => hashHistory.push('/foo')}>Go to /foo</button>
2018
</div>
2119
<div style={{ marginTop: '1.5em' }}>{children}</div>
2220
</div>
2321
)
2422
}
25-
26-
export default connect(
27-
null,
28-
routeActions
29-
)(App)

examples/basic/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,6 @@
66
</head>
77
<body>
88
<div id="mount"></div>
9-
<script src="dist/bundle.js"></script>
9+
<script src="/bundle.js"></script>
1010
</body>
1111
</html>

examples/basic/package.json

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,30 @@
44
"repository": "reactjs/react-router-redux",
55
"license": "MIT",
66
"dependencies": {
7-
"react": "^0.14.2",
8-
"react-dom": "^0.14.2",
9-
"react-redux": "^4.0.0",
7+
"react": "^0.14.7",
8+
"react-dom": "^0.14.7",
9+
"react-redux": "^4.3.0",
1010
"react-router": "^2.0.0",
11-
"redux": "^3.0.4",
12-
"react-router-redux": "^2.1.0"
11+
"redux": "^3.2.1",
12+
"react-router-redux": "^3.0.0"
1313
},
1414
"devDependencies": {
15-
"babel-core": "^6.1.21",
16-
"babel-eslint": "^5.0.0-beta6",
17-
"babel-loader": "^6.2.0",
18-
"babel-preset-es2015": "^6.1.18",
19-
"babel-preset-react": "^6.1.18",
15+
"babel-core": "^6.4.5",
16+
"babel-eslint": "^5.0.0-beta9",
17+
"babel-loader": "^6.2.2",
18+
"babel-preset-es2015": "^6.3.13",
19+
"babel-preset-react": "^6.3.13",
2020
"babel-preset-stage-1": "^6.3.13",
2121
"eslint": "^1.10.3",
2222
"eslint-config-rackt": "^1.1.1",
23-
"eslint-plugin-react": "^3.15.0",
24-
"redux-devtools": "^3.0.0",
23+
"eslint-plugin-react": "^3.16.1",
24+
"redux-devtools": "^3.1.0",
2525
"redux-devtools-dock-monitor": "^1.0.1",
26-
"redux-devtools-log-monitor": "^1.0.1",
27-
"webpack": "^1.12.6"
26+
"redux-devtools-log-monitor": "^1.0.4",
27+
"webpack": "^1.12.13",
28+
"webpack-dev-server": "^1.14.1"
2829
},
2930
"scripts": {
30-
"start": "webpack --watch"
31+
"start": "webpack-dev-server --history-api-fallback --no-info --open"
3132
}
3233
}

examples/server/.babelrc

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"presets": ["es2015", "react", "stage-1"],
3+
"plugins": [
4+
["babel-plugin-module-alias", [
5+
{ "src": "../../src", "expose": "react-router-redux" }
6+
]]
7+
]
8+
}

examples/server/client.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import 'babel-polyfill'
2+
3+
import React from 'react'
4+
import { render } from 'react-dom'
5+
6+
import { Provider } from 'react-redux'
7+
import { Router, browserHistory } from 'react-router'
8+
import { syncHistoryWithStore } from 'react-router-redux'
9+
10+
import { configureStore, DevTools } from './store'
11+
import routes from './routes'
12+
13+
const store = configureStore(browserHistory, window.__initialState__)
14+
const history = syncHistoryWithStore(browserHistory, store)
15+
16+
render(
17+
<Provider store={store}>
18+
<Router history={history} routes={routes} />
19+
</Provider>,
20+
document.getElementById('root')
21+
)
22+
23+
render(
24+
<Provider store={store}>
25+
<DevTools/>
26+
</Provider>,
27+
document.getElementById('devtools')
28+
)

0 commit comments

Comments
 (0)