├── .babelrc
├── .gitignore
├── LICENSE
├── README.md
├── package.json
├── rollup.config.js
├── src
├── context.js
├── create-use-connect.js
└── index.js
└── yarn.lock
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": ["@babel/env"]
3 | }
4 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 |
6 | # testing
7 | /coverage
8 |
9 | # production
10 | /build
11 |
12 | # misc
13 | .DS_Store
14 | .env.local
15 | .env.development.local
16 | .env.test.local
17 | .env.production.local
18 |
19 | npm-debug.log*
20 | yarn-debug.log*
21 | yarn-error.log*
22 |
23 | /dist
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 Martynas Kadiša
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # react-use-redux
2 |
3 | # The wait is over, just use official `react-redux` package if you want hooks.
4 |
5 | Alternative Redux bindings with [React hooks](http://reactjs.org/hooks).
6 |
7 | Note: this is an experimental package. I do not recommend using this in production. You're probably better off using [react-redux](https://github.com/reduxjs/react-redux).
8 |
9 | Discussion of using hooks in `react-redux` repo [here](https://github.com/reduxjs/react-redux/issues/1063)
10 |
11 | ## Installing
12 |
13 | ```
14 | npm install react-use-redux
15 | ```
16 |
17 | or
18 |
19 | ```
20 | yarn add react-use-redux
21 | ```
22 |
23 | ## Examples
24 |
25 | Usage is very similar to what `react-redux` provides, except it uses hooks.
26 |
27 |
28 | Firstly let's wrap our app with provider from `react-use-redux`:
29 |
30 | ```jsx
31 | import { StoreContext } from 'react-use-redux';
32 |
33 | const store = configureStore(/* ... */)
34 |
35 | const AppWithStore = () => (
36 |
37 |
38 |
39 | )
40 | ```
41 |
42 | Now that we have that taken care of we can connect our functional components to Redux store:
43 |
44 | ```jsx
45 | import { createUseConnect } from 'react-use-redux'
46 |
47 | const useConnect = createUseConnect((state) => ({ user: state.user }))
48 |
49 | const Profile = () => {
50 | const { user } = useConnect()
51 |
52 | return (
53 |
54 |
Name: {user.name}
55 |
Surname: {user.surname}
56 |