redux-saga-relay

Small library to add relay functionality to redux-saga for more concise sagas 🐎

Usage no npm install needed!

<script type="module">
  import reduxSagaRelay from 'https://cdn.skypack.dev/redux-saga-relay';
</script>

README

redux-saga-relay

Transform verbose logic in redux-saga into compact callbacks. You need to have redux-saga installed to use the library.

Before

import { takeEvery, all, put } from "redux-saga";
import { BUTTON_PRESSED, FETCH_TODOS, FETCH_USERS, FETCH_PAYMENTS } from "./types";

export function* root() {
  yield takeEvery(BUTTON_PRESSED, _dispatchMultipleRequests),
}

function* _dispatchMultipleRequests(){
    yield all([
      put({ type: FETCH_TODOS }),
      put({ type: FETCH_USERS }),
      put({ type: FETCH_PAYMENTS }),
    ]);
}

After

import { takeEvery } from "redux-saga";
import { relay } from "redux-saga-relay";
import { BUTTON_PRESSED, FETCH_TODOS, FETCH_USERS, FETCH_PAYMENTS } from "./types";

export function* root() {
  yield takeEvery(BUTTON_PRESSED, (action) => 
    relay([FETCH_TODOS, FETCH_USERS, FETCH_PAYMENTS], action)
  )
}

See below for all options and complex transformations.

Install

NPM:

 npm install redux-saga-relay

Yarn:

yarn add redux-saga-relay

Usage

Pass a string and relay a single action:

(action) => relay(TYPE_1, action)

Pass an array of strings and relay multiple actions:

(action) => relay([TYPE_1, TYPE_2, TYPE_2], action)

The triggered action will be spread into TYPE_1, TYPE_2 and TYPE_3 and dispatched to the redux store, after a transformation has been applied (more on transformations below).

Pass a function and relay to a callback:

takeEvery(CUSTOM_BUTTON_PRESS, action => 
  relay(() => {
    // Do something here
  })
)

Extend

You can extend your actions in your sagas with additional payload or metadata using the extend method exposed by the library.

import { relay, extend } from "redux-saga-relay";

takeEvery(CUSTOM_BUTTON_PRESS, action =>
  relay(FETCH_ORDERS, extend(action, { ...payload }, { ...meta }))
)

Catch Issues

The relay code is wrapped in a try - catch block, meaning that you can catch errors in your callbacks, to hook into the catch statement pass a function as the third parameter of the relay function.

(action) => relay(() => {
   const { value } = object.that.does.not.exist; //Bad code
}, null, _recordErrorInSentry)

Transformations

Actions are transformed by default to remove meta.analytics from the action before it is relayed. You can optionally overwrite this transformation by passing a function to the forth parameter of the relay function.

(action) => relay(TYPE_1, action, _recordErrorInSentry, _customTransform)

function _customTransform(action) {
   return _.omit(action, "payload") // apply custom transform to action before it is relayed
}

Authors

License

This project is licensed under the MIT Licence