CODEWITHSUNDEEP
reduxrxjs5redux-observable
Anas
Anas

Reputation: 5727

RxJS Observables called in the reverse order

I have the following code that dispatch 3 actions:

For some reasons, the only way I was able to make it work is in the reverse order, what is it I'm doing wrong?

const deleteLineEpic = (action$, store) =>
action$.ofType(types.DELETE_LINE_REQUEST)
    .flatMap((action) => {
        return Observable.of(hideConfirmationMessage(action.line.productID))
                .delay(2000)
                .merge(
                    Observable.of(deleteLineFailure(action.line.productID)),
                    Observable.of(showConfirmationMessage(action.line.productID))
                );
        }
    });

Upvotes: 1

Views: 787

Answers (1)

chrigu
chrigu

Reputation: 826

I think the following happens:

deleteLine        -----X------------
showConfirmation  -------Y----------
hideConfirmation  --------- 2s -----Z

merge             -----X-Y- 2s -----Z

All 3 streams get merged, and the one with the delay emits after two seconds while the other emit the action immediately.

So it might be better to do this:

const deleteLineEpic = (action$, store) =>
action$.ofType(types.DELETE_LINE_REQUEST)
    .flatMap((action) => {
        return Observable.merge(
            Observable.of(deleteLineFailure(action.line.productID),
            showConfirmationMessage(action.line.productID)),
            Observable.of(hideConfirmationMessage(action.line.productID))
                .delay(2000)
        )}
);

Here the actions in the first Observable.of get immediately emitted after each other, while hide actions is emitted later on.

Upvotes: 2

Related Questions