CODEWITHSUNDEEP
reactjsreduxrxjsredux-observable
robinvdvleuten
robinvdvleuten

Reputation: 1514

How to wait for another epic who listens to same action stream

So in my struggles to master RXjs, I ran into the following situation; when the application rehydrates (bootstrapped the first time), I dispatch a corresponding REHYDRATE action. I have two epics listening to this action, but I want the second epic only to be invoked when the first epic finishes. My current attempt looks like the following;

export const rehydrateEpic = (
  action$: ActionsObservable
) =>
  action$.ofType(REHYDRATE)
    .switchMap(() => {
      // Wait for the JWT token to be successfully fetched.
      return action$.ofType(GET_JWT_SUCCESS)
        // When this line is removed, you will disappear in a spacetime continuum.
        .take(1)
        .do(action => {
          // I get the action here...
          console.log(action)
        })
        .switchMap(action => {
          return action$.ofType([
              actions.GET_ACCOUNT_INFO_SUCCESS,
              actions.GET_ACCOUNT_INFO_FAILURE,
            ])
            .do(action => {
              // ...but this one is never reached :(
              console.log(action)
            })
            .startWith(actions.getAccountInfo())
        })
    })

I see in my devtools that I get a GET_ACCOUNT_INFO_FAILURE so somehow the Redux flow seems to work.

Upvotes: 1

Views: 336

Answers (2)

robinvdvleuten
robinvdvleuten

Reputation: 1514

So I figured it out myself. By using zip(), I can wait for both streams to emit. In my case within the example, it will look like this;

export const rehydrateEpic = (
  action$: ActionsObservable
) =>
  action$.ofType(REHYDRATE)
    // Wait for the JWT token to be successfully fetched.
    .zip(() => action$.ofType(GET_JWT_SUCCESS))
    .switchMap(() => {
      return action$.ofType([
          actions.GET_ACCOUNT_INFO_SUCCESS,
          actions.GET_ACCOUNT_INFO_FAILURE,
        ])
        .do(action => {
          // ...but this one is never reached :(
          console.log(action)
        })
        .startWith(actions.getAccountInfo())
    })

Upvotes: 1

jayphelps
jayphelps

Reputation: 15401

I have two epics listening to this action, but I want the second epic only to be invoked when the first epic finishes.

Sounds like the second epic shouldn't listen for REHYDRATE but instead listen for an action that the first epic emits when its done. How does that sound?

Upvotes: 2

Related Questions