Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dylanvann/redux-saga-request
🏞 Redux Saga Request, request helper for Redux Saga.
https://github.com/dylanvann/redux-saga-request
redux redux-saga request
Last synced: 26 days ago
JSON representation
🏞 Redux Saga Request, request helper for Redux Saga.
- Host: GitHub
- URL: https://github.com/dylanvann/redux-saga-request
- Owner: DylanVann
- License: mit
- Created: 2017-04-18T17:12:09.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-07-12T20:37:10.000Z (over 6 years ago)
- Last Synced: 2024-09-22T06:16:59.405Z (about 2 months ago)
- Topics: redux, redux-saga, request
- Language: JavaScript
- Homepage:
- Size: 77.1 KB
- Stars: 11
- Watchers: 4
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# redux-saga-request
🏞 Redux Saga Request, request helper for Redux Saga.
[](https://www.npmjs.com/package/redux-saga-request)
[](https://circleci.com/gh/DylanVann/redux-saga-request)
[](https://github.com/DylanVann/redux-saga-request/blob/master/LICENSE)
Helper for running async functions and dispatching actions in redux saga.
## Usage
```bash
yarn add redux-saga-request
```
```js
import { createRequest, request } from 'redux-saga-request'
// Create your request types.
const FETCH_STUFF = createRequest('FETCH_STUFF')
// Have something async to run.
const fetchStuff = () => fetch('https://unsplash.it/list').then(r => r.json())
// Run it with Redux Saga.
function* mySaga() {
yield request(FETCH_STUFF, [fetchStuff])
}
// Do stuff easily in your reducers.
const stuffReducer = (state = {}, { type, payload }) => {
switch (type) {
case FETCH_STUFF.STARTED:
return {
...state,
// Maybe use this to show a loading spinner?
fetching: true,
}
case FETCH_STUFF.SUCCEEDED:
return {
...state,
fetching: false,
fetched: true,
// Here's the stuff!
stuff: payload,
}
case FETCH_STUFF.CANCELLED:
case FETCH_STUFF.ERRORED:
return {
...state,
fetching: false,
fetched: false,
// Oh no, show an error message based on this.
errored: true,
}
default:
return state
}
}
```
## Advanced Usage
- You can pass arguments to your async function.
- You can attach metadata to all request actions to keep them
associated.
```js
function* mySaga() {
yield request(
FETCH_STUFF,
[fetchStuff, fetchStuffArg],
{ fetchStuffMeta: 'META' }
)
}
```