Sawtaytoes

tap(() => (
  dispatch(
    pong(),
  )
)),
ignoreElements(),

Sawtaytoes

const pingEpic = (
  action$,
) => (
  action$
  .pipe(
    ofType(CREATE_PING_LISTENER)
    mergeMap(({
      namespace,
    }) => (
      action$

Sawtaytoes

const dispatchOnError = (
  actionCreator,
  returnValue,
) => (
  catchError((
    error,
  ) => {
    dispatch(
      actionCreator(
        error,

Sawtaytoes

const fetchUserEpic = (
  action$,
  state$,
  { dispatch },
) => (
  action$
  .pipe(
    ofType(FETCH_USER),
    tap(() => {
      dispatch(

Sawtaytoes

const fetchUserEpic = action$ => (
  action$.pipe(
    ofType(FETCH_USER),
    switchMap(({ username, password }) => (
      merge(
        of(setLoading('login')),
        ajax.getJSON('https://api.example.com/login').pipe(
          switchMap(({ authToken }) => of(
            fetchUserSucceeded(authToken),
            setLoaded('login'),

Sawtaytoes

const fetchUserEpic = (
  action$,
) => (
  action$
  .pipe(
    ofType(FETCH_USER),
    switchMap(({
      password,
      username,
    }) => (

Sawtaytoes

const someEpic = (
  action$,
) => (
  action$
  .pipe(
    ofType(FETCH_DATA),
    switchMap(() => (
      ajax('/data')
      .pipe(
        switchMap((

Sawtaytoes

const someEpic = (
  action$,
  store,
) => (
  action$
  .pipe(
    ofType(FETCH_DATA),
    switchMap(() => (
      ajax('/data')
      .pipe(

Sawtaytoes

The goal of this Gist is to figure out which items storage technique is a best-practice or good recommendation for taking a list of items and storing them into an asynchronous data storage.

There are various goals to accomplish such as reducing indirection, creating distinct micro-epics (each with their own job), and having an overall simpler time maintaining the code.

I've put together 2 examples of how you might handle storing a list of items with epics. A third example was added to show what one of the versions would look like with the ability to know when those items are done storing.

Sawtaytoes

<script>
  import { createStore } from './fakeRedux.js'
  
  let count = 0
  
  const stateModifiers = {
    DECREMENT: () => {
      count -= 1
    },
    INCREMENT: () => {