# redux-saga-tasks

> Storage of meta information for your tasks in redux-saga

Latest version **0.3.1** (published 2021-04-17) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install redux-saga-tasks
pnpm add redux-saga-tasks
yarn add redux-saga-tasks
bun add redux-saga-tasks
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.3.1 |
| Published | 2021-04-17 |
| First published | 2019-09-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 24.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Timofey Dergachev |
| Maintainers | exeto, exeto-archive |
| Keywords | redux, redux-saga |

## Links

- npm: https://www.npmjs.com/package/redux-saga-tasks
- Repository: https://github.com/exeto-archive/redux-saga-tasks
- Homepage: https://github.com/exeto-archive/redux-saga-tasks#readme
- Issues: https://github.com/exeto-archive/redux-saga-tasks/issues
- npm.io page: https://npm.io/package/redux-saga-tasks

## Recent versions

- 0.3.1 (latest) — 2021-04-17
- 0.3.0 — 2019-12-27
- 0.2.1 — 2019-12-19
- 0.2.0 — 2019-09-10
- 0.1.0 — 2019-09-09

## README

# redux-saga-tasks

> Storage of meta information for your tasks in redux-saga

**THIS PACKAGE IS NO LONGER MAINTAINED**

**Note:** your project should use [regenerator-runtime](https://www.npmjs.com/package/regenerator-runtime)

## Install

```sh
yarn add redux-saga@^1.0.5 redux-saga-tasks
```

## Usage

### Setup root reducer

```js
import { combineReducers } from 'redux';
import { reducer as tasks } from 'redux-saga-tasks';

const rootReducer = combineReducers({
  tasks,
});
```

You need to wrap your saga in `createTaskSaga`:

```js
import { call, put } from 'redux-saga/effects';
import { createTaskSaga } from 'redux-saga-tasks';

function* findItems() {
  const data = yield call(api.find);

  yield put(findItemsSuccess(data));

  return {
    ids: data.map(item => item.id),
  };
}

function* watchFindItems() {
  yield takeEvery('FIND_ITEMS', createTaskSaga(findItems));
}
```

And use action creator:

```js
import { createTaskAction } from 'redux-saga-tasks';

export const findItems = createTaskAction('FIND_ITEMS');
```

### Example of use in component:

```js
import React, { useEffect, useState } from 'react';
import { useSelector, useDispatch, shallowEqual } from 'react-redux';
import {
  getIsRunning,
  getIsFinished,
  getData,
  getError,
} from 'redux-saga-tasks';

import { findItems } from '../items/selectors';
import Item from './Item';

const List = () => {
  const [taskId, setTaskId] = useState(null);
  const dispatch = useDispatch();

  const data = useSelector(
    state => ({
      ids: getData(state, taskId),
      isRunning: getIsRunning(state, taskId),
      isFinished: getIsFinished(state, taskId),
      error: getError(state, taskId),
    }),
    shallowEqual,
  );

  useEffect(() => {
    const { meta } = dispatch(findItems());

    setTaskId(meta.taskId);
  }, []);

  if (data.isRunning) {
    return 'running';
  }

  if (error) {
    return 'error';
  }

  return data.isFinished ? (
    <ul>
      {data.ids.map(id => (
        <li>{id}</li>
      ))}
    </ul>
  ) : null;
};
```

### Custom parseError

By default, error gets name, message, and stack from the error object. This behavior can be changed:

```js
function* watchFindItems() {
  yield takeEvery(
    'FIND_ITEMS',
    createTaskSaga(findItems, {
      parseError: err => err.response.data,
    }),
  );
}
```

## License

[MIT](LICENSE.md) © [Timofey Dergachev](https://exeto.me)

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