redux-sequence-action

0.2.1 verified Sat Apr 25 auth: no javascript maintenance

A Redux middleware that enables sequential dispatch of actions using arrays and nested arrays, providing a declarative syntax for ordered action execution. Version 0.2.1, stable but unmaintained since 2016. It simplifies dispatching sequences like A → [B, C] → D → E without needing thunk or promise middleware. Differentiates from redux-saga or redux-observable by being a lightweight, pure middleware approach with no additional dependencies.

Common errors

error Uncaught Error: Actions must be plain objects. Use custom middleware for async actions. ↓

cause Dispatching an array action without the sequenceAction middleware.

fix

Add sequenceAction to applyMiddleware: applyMiddleware(sequenceAction).

error TypeError: dispatch is not a function ↓

cause Trying to dispatch an array inside a thunk that was not created by this middleware.

fix

Ensure the outer dispatch is from a store that has sequenceAction middleware, and use the pattern dispatch([...]).

error Cannot read property 'type' of undefined ↓

cause An element in the action array is undefined or null.

fix

Check all elements in the array returned by action creator to ensure they are valid actions or thunks.

Warnings

gotcha Action creators must return an array of actions or thunks; returning a plain object will cause middleware to pass it through unhandled, potentially breaking the sequence. ↓

fix Ensure action creators return arrays or define a fallback for single actions.

deprecated Package is unmaintained since 2016; no compatibility with modern Redux (v4+) or TypeScript types. ↓

fix Consider using redux-thunk with promise chains or redux-saga for sequence control.

gotcha When using nested arrays for parallel actions, the middleware does not actually run them in parallel; it dispatches sequentially in order, ignoring the array nesting semantics as parallel. ↓

fix Use Promise.all or a different middleware like redux-promise for true parallel dispatch.

breaking The function action (thunk) inside the array receives (dispatch, getState) but the dispatch provided by the middleware is the store's raw dispatch, which does not pass through other middlewares unless applied after in chain. ↓

fix Ensure sequenceAction is the last middleware in applyMiddleware chain to avoid middleware skipping.

Install

npm install redux-sequence-action

yarn add redux-sequence-action

pnpm add redux-sequence-action

Imports

sequenceAction

wrong

import { sequenceAction } from 'redux-sequence-action'

correct

import sequenceAction from 'redux-sequence-action'

Default export; named import will fail.

applyMiddleware

wrong

import { applyMiddleware, createStore } from 'redux-sequence-action'

correct

import { applyMiddleware, createStore } from 'redux'

applyMiddleware is from redux, not this package.

dispatch
wrong
```
dispatch(A, B, C, D, E)
```
correct
```
dispatch([A, [B, C], D, E])
```
dispatch takes an array of actions to sequence, not multiple arguments.

Quickstart

Demonstrates sequential dispatch: first a sync action, then a function with dispatch and getState, resulting in state changes in order.

import { createStore, applyMiddleware } from 'redux';
import sequenceAction from 'redux-sequence-action';

const reducer = (state = { count: 0 }, action) => {
  switch (action.type) {
    case 'INC': return { ...state, count: state.count + 1 };
    case 'DEC': return { ...state, count: state.count - 1 };
    default: return state;
  }
};

const store = createStore(reducer, applyMiddleware(sequenceAction));

store.dispatch([
  { type: 'INC' },
  (dispatch, getState) => {
    console.log('After INC:', getState().count); // 1
    dispatch({ type: 'DEC' });
  }
]);

console.log(store.getState().count); // 0