rwr-redux 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/docs/rails-redux-router.md +46 -33
- data/js/src/version.js +1 -1
- data/lib/react_webpack_rails/redux_integration/version.rb +1 -1
- data/package.json +6 -6
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 36a0dc245883afb465fb10b4271473744a8fffb2
|
4
|
+
data.tar.gz: efd6cb621c8949ee78ea69d6242f970ffd23aa3c
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 66966465aa0155af43630883102678dc143e4eec8ac92b4d288f09c6b867fb19766c0cfc8f481cf00fb2c6f49f0a9c28e61ec9a9d459820ab6b6cc520958503f
|
7
|
+
data.tar.gz: 1b68bda1434af2f9b59ebf68feabf0e7fdad0b5146a6d7a9cfda3fc2b2636f990c761d93b05abebd54075f41c9c2cbcb74f52b299d49dec2675ce7c408000520
|
data/README.md
CHANGED
@@ -82,7 +82,7 @@ If you have more than one store in a view, you can specify `store_name`:
|
|
82
82
|
|
83
83
|
## Usage with react-redux-router
|
84
84
|
|
85
|
-
If you want to use router in your redux app, you have to only create routes component. `rwr-redux` will wrap it with `<Router>` and `<Provider>`components, and also, will sync history with the store. Only `browserHistory` is supported.
|
85
|
+
If you want to use router in your redux app, you have to only create routes component. `rwr-redux` will wrap it with `<Router>` and `<Provider>` components, and also, will sync history with the store. Only `browserHistory` is supported.
|
86
86
|
|
87
87
|
### example routes
|
88
88
|
`app/react/routes/index.js`
|
data/docs/rails-redux-router.md
CHANGED
@@ -9,54 +9,42 @@ If you want check the source code right away, you can find example app [here](ht
|
|
9
9
|
|
10
10
|
## Setup
|
11
11
|
|
12
|
-
* [react_webpack_rails](https://github.com/netguru/react_webpack_rails) and [rwr-redux](https://github.com/netguru/rwr-redux) have to be added
|
12
|
+
* [react_webpack_rails](https://github.com/netguru/react_webpack_rails) and [rwr-redux](https://github.com/netguru/rwr-redux) have to be added to your app
|
13
13
|
* install react-router and react-router-redux:
|
14
14
|
```bash
|
15
15
|
$ npm install --save react-router react-router-redux
|
16
16
|
```
|
17
17
|
|
18
|
-
##
|
18
|
+
## Routes
|
19
19
|
|
20
|
-
|
20
|
+
`rwr-redux` will wrap Routes with `<Router>` and `<Provider>` components, and also, will sync browserHistory with the store.
|
21
21
|
|
22
|
-
`react/
|
23
|
-
```
|
24
|
-
import React
|
22
|
+
[`react/routes/index.js`](https://github.com/caspg/rails-react-examples/blob/master/redux-router/app/react/routes/index.js)
|
23
|
+
```js
|
24
|
+
import React from 'react';
|
25
25
|
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
|
26
|
-
import { syncHistoryWithStore } from 'react-router-redux';
|
27
|
-
import RWRRedux from 'rwr-redux';
|
28
|
-
|
29
|
-
import App from './App';
|
30
|
-
(...)
|
31
|
-
|
32
|
-
export default class Root extends Component {
|
33
|
-
componentWillMount() {
|
34
|
-
const mountedStore = RWRRedux.getStore();
|
35
|
-
this.history = syncHistoryWithStore(browserHistory, mountedStore);
|
36
|
-
}
|
37
|
-
|
38
|
-
render() {
|
39
|
-
return (
|
40
|
-
<Router history={this.history} >
|
41
|
-
<Route path="/" component={App}>
|
42
|
-
(...)
|
43
|
-
</Route>
|
44
|
-
</Router>
|
45
|
-
);
|
46
|
-
}
|
47
|
-
}
|
48
|
-
```
|
49
26
|
|
50
|
-
|
27
|
+
import App from '../containers/App';
|
28
|
+
import CounterPage from '../containers/CounterPage';
|
29
|
+
import ScorePage from '../components/ScorePage';
|
30
|
+
import About from '../components/About';
|
31
|
+
|
32
|
+
export default (
|
33
|
+
<Route path="/" component={App}>
|
34
|
+
<IndexRoute component={CounterPage} />
|
35
|
+
<Route path="/score-board" component={ScorePage} />
|
36
|
+
<Route path="/about" component={About} />
|
37
|
+
</Route>
|
38
|
+
);
|
51
39
|
|
52
|
-
|
40
|
+
```
|
53
41
|
|
54
42
|
## Store
|
55
43
|
|
56
44
|
Navbar component will issue [navigation events](https://github.com/reactjs/react-router-redux#what-if-i-want-to-issue-navigation-events-via-redux-actions) via Redux actions. Those events will change state and cause main component to rerender.
|
57
45
|
|
58
46
|
To make it works, you need to apply middleware to the store:
|
59
|
-
`react/store/index.js`
|
47
|
+
[`react/store/index.js`](https://github.com/caspg/rails-react-examples/blob/master/redux-router/app/react/store/index.js)
|
60
48
|
```jsx
|
61
49
|
import { createStore, applyMiddleware } from 'redux';
|
62
50
|
import { routerMiddleware } from 'react-router-redux'
|
@@ -77,7 +65,7 @@ export default function configureStore(initialState) {
|
|
77
65
|
|
78
66
|
## Navbar component
|
79
67
|
|
80
|
-
`react/containers/Navbar.jsx`
|
68
|
+
[`react/containers/Navbar.jsx`](https://github.com/caspg/rails-react-examples/blob/master/redux-router/app/react/containers/Navbar.jsx)
|
81
69
|
|
82
70
|
Import `push` method from react-router-redux:
|
83
71
|
```jsx
|
@@ -89,6 +77,31 @@ And now you can dispatch an action with navigation event:
|
|
89
77
|
this.props.dispatch(push(path));
|
90
78
|
```
|
91
79
|
|
80
|
+
## Register store and router
|
81
|
+
|
82
|
+
[`react/index.js`](https://github.com/caspg/rails-react-examples/blob/master/redux-router/app/react/index.js)
|
83
|
+
|
84
|
+
Register integrations:
|
85
|
+
```js
|
86
|
+
integrationsManager.register('redux-store', RWRRedux.storeIntegrationWrapper);
|
87
|
+
integrationsManager.register('redux-container', RWRRedux.containerIntegrationWrapper);
|
88
|
+
integrationsManager.register('redux-router', RWRRedux.routerIntegrationWrapper);
|
89
|
+
```
|
90
|
+
|
91
|
+
Register store and components:
|
92
|
+
```js
|
93
|
+
|
94
|
+
import CounterStore from './store';
|
95
|
+
RWRRedux.registerStore('CounterStore', CounterStore);
|
96
|
+
|
97
|
+
import Navbar from './containers/Navbar';
|
98
|
+
RWRRedux.registerContainer('Navbar', Navbar);
|
99
|
+
|
100
|
+
import MainRoutes from './routes';
|
101
|
+
RWRRedux.registerRoutes('MainRoutes', MainRoutes);
|
102
|
+
```
|
103
|
+
|
104
|
+
|
92
105
|
## Rails part
|
93
106
|
|
94
107
|
Add wildcard route:
|
data/js/src/version.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
export default '0.
|
1
|
+
export default '0.3.0';
|
data/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "rwr-redux",
|
3
|
-
"version": "0.
|
3
|
+
"version": "0.3.0",
|
4
4
|
"description": "Redux integration for react_webpack_rails",
|
5
5
|
"main": "js/lib/index.js",
|
6
6
|
"files": [
|
@@ -30,11 +30,11 @@
|
|
30
30
|
},
|
31
31
|
"homepage": "https://github.com/netguru/rwr-redux",
|
32
32
|
"dependencies": {
|
33
|
-
"react-redux": "^4.4.
|
34
|
-
"react-router": "^2.
|
35
|
-
"react-router-redux": "^4.0.
|
36
|
-
"react-webpack-rails": "^0.
|
37
|
-
"redux": "^3.
|
33
|
+
"react-redux": "^4.4.5",
|
34
|
+
"react-router": "^2.4.1",
|
35
|
+
"react-router-redux": "^4.0.4",
|
36
|
+
"react-webpack-rails": "^0.4.1",
|
37
|
+
"redux": "^3.5.2"
|
38
38
|
},
|
39
39
|
"devDependencies": {
|
40
40
|
"babel-cli": "^6.4.0",
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: rwr-redux
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.3.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kacper Goliński
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: exe
|
11
11
|
cert_chain: []
|
12
|
-
date: 2016-
|
12
|
+
date: 2016-06-06 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: bundler
|