# redux-saga-fetch-actions

> Saga for consistent fetch api actions

Latest version **1.0.1** (published 2020-01-28) · MIT license · 0 weekly downloads

## Install

```sh
npm install redux-saga-fetch-actions
pnpm add redux-saga-fetch-actions
yarn add redux-saga-fetch-actions
bun add redux-saga-fetch-actions
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2020-01-28 |
| First published | 2020-01-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 7.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Clark Tozer |
| Maintainers | clarktozer |
| Keywords | react, redux, redux-saga, typescript |

## Links

- npm: https://www.npmjs.com/package/redux-saga-fetch-actions
- Repository: https://github.com/clarktozer/redux-saga-fetch-actions
- Homepage: https://github.com/clarktozer/redux-saga-fetch-actions#readme
- Issues: https://github.com/clarktozer/redux-saga-fetch-actions/issues
- npm.io page: https://npm.io/package/redux-saga-fetch-actions

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2020-01-28
- 1.0.0 — 2020-01-27
- 0.0.2 — 2020-01-22
- 0.0.1 — 2020-01-22

## README

## redux-saga-fetch-actions

![CI Status](https://img.shields.io/github/workflow/status/clarktozer/redux-saga-fetch-actions/Build%20&%20Test)
[![npm version](https://img.shields.io/npm/v/redux-saga-fetch-actions.svg)](https://www.npmjs.com/package/redux-saga-fetch-actions)

Saga for consistent async actions.

Dispatch an action in FSA format with your desired prefix (default is "FETCH\_").

```
dispatch({
    type: "FETCH_WIDGETS",
    payload: {
        request: () => Promise.resolve([1, 2, 3, 4, 5]),
        onSuccess: (response) => {
            alert(response)
        },
        onFailure: (error) => {
            alert(error)
        }
    },
    meta: "Some data"
})
```

The saga will then dispatch a request action, and either a success or failure action, both in FSA format. The meta property will be passed through to both. If no meta is provided, it will be set to be the request function.

```
{
    type: "WIDGETS_SUCCESS",
    payload: [1,2,3,4,5] // The request response,
    meta: "Some data"
}
```

```
{
    type: "WIDGETS_FAILED",
    payload: "Something went wrong!", // The exception error,
    meta: "Some data"
    error: true
}
```

## Installation

```
npm install redux-saga-fetch-actions
```

```javascript
import { all } from "redux-saga/effects";
import createSagaMiddleware from "@redux-saga/core";
import { fetchSaga } from "redux-saga-fetch-actions";
import { applyMiddleware, createStore } from "redux";
import { rootReducer } from "../reducers";

const sagaMiddleware = createSagaMiddleware();

export const store = createStore(rootReducer, applyMiddleware(sagaMiddleware));

export function* rootSaga() {
    yield all([fetchSaga("FETCH_")]);
}

sagaMiddleware.run(rootSaga);
```

## Saga Props

| Prop                               |  Type  |           Description            |
| :--------------------------------- | :----: | :------------------------------: |
| prefix<br/>_(default = "FETCH\_")_ | string | Prefix to trigger the fetch saga |

## Action Payload Props

| Prop                     |          Type           |                  Description                  |
| :----------------------- | :---------------------: | :-------------------------------------------: |
| request<br/>_(required)_ |   () => Promise<any>    |                 Fetch request                 |
| onSuccess                | (response: any) => void | Function called if the request was successful |
| onFailure                | (error: Error) => void  |     Function called if the request failed     |

---
_Source: https://npm.io/package/redux-saga-fetch-actions · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._