# redux-batched-actions

> redux higher order reducer + action creator to reduce actions under a single subscriber notification

Latest version **0.5.0** (published 2020-03-31) · MIT license · 0 weekly downloads

## Install

```sh
npm install redux-batched-actions
pnpm add redux-batched-actions
yarn add redux-batched-actions
bun add redux-batched-actions
```

## Health

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

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

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.0 |
| Published | 2020-03-31 |
| First published | 2015-10-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 12.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1036 |
| Author | Tim Shelburne |
| Maintainers | tshelburne |
| Keywords | redux, react, reactjs, batched, action |

## Links

- npm: https://www.npmjs.com/package/redux-batched-actions
- Repository: https://github.com/tshelburne/redux-batched-actions
- Issues: https://github.com/tshelburne/redux-batched-actions/issues
- npm.io page: https://npm.io/package/redux-batched-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

- 0.5.0 (latest) — 2020-03-31
- 0.4.1 — 2018-09-26
- 0.4.0 — 2018-08-16
- 0.3.0 — 2018-05-02
- 0.2.1 — 2018-01-06
- 0.1.6 — 2017-07-28
- 0.2.0 — 2017-04-21
- 0.1.5 — 2016-12-06
- 0.1.4 — 2016-10-31
- 0.1.3 — 2016-07-31
- 0.1.2 — 2016-02-02
- 0.1.1 — 2015-10-19
- 0.1.0 — 2015-10-19

## README

redux-batched-actions
=====================

[![Build Status](https://travis-ci.org/tshelburne/redux-batched-actions.svg)](https://travis-ci.org/tshelburne/redux-batched-actions)

Batching action creator and associated higher order reducer for [redux](https://github.com/gaearon/redux) that enables batching subscriber notifications for an array of actions.

```js
npm install --save redux-batched-actions
```

## Usage

```js
import {createStore, applyMiddleware} from 'redux';
import {batchActions, enableBatching, batchDispatchMiddleware} from 'redux-batched-actions';
import {createAction} from 'redux-actions';

const doThing = createAction('DO_THING')
const doOther = createAction('DO_OTHER')

function reducer(state, action) {
	switch (action.type) {
		case 'DO_THING': return 'thing'
		case 'DO_OTHER': return 'other'
		default: return state
	}
}

// Handle bundled actions in reducer
const store = createStore(enableBatching(reducer), initialState)

store.dispatch(batchActions([doThing(), doOther()]))
// OR
store.dispatch(batchActions([doThing(), doOther()], 'DO_BOTH'))

```

## Recipes

### Async

Usage for action creators that return objects is trivial, but it also works well with [thunks](https://github.com/gaearon/redux-thunk) to perform large reductions on multiple asynchronous actions, or actions that rely on external services. For example:

```js
const setLoading = createAction('SET_LOADING')
const setUser = createAction('SET_USER')
const unsetLoading = createAction('UNSET_LOADING')

function login(credentials) {
	return function(dispatch) {
		dispatch(setLoading());

		authenticate(credentials)
			.then(user => {
				dispatch(batchActions([
					setUser(user),
					unsetLoading()
				], 'LOGIN_SUCCESS'))
			})
		})
	}
}
```

In this example, the subscribers would be notified twice: once when the state is loading, and then again once the user has been loaded.

### Middleware integration

You can add a middleware to dispatch each of the bundled actions. This can be used if other middlewares are listening for one of the bundled actions to be dispatched.

```js
const store = createStore(
		reducer,
		initialState,
		applyMiddleware(batchDispatchMiddleware)
)
```

Note that batchDispatchMiddleware and enableBatching should not be used together as batchDispatchMiddleware calls next on the action it receives, whilst also dispatching each of the bundled actions.

## Thanks

Thanks to [Dan Abramov](https://github.com/gaearon) for help in Redux best practices and original idea.

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