Recently, I started using RxJs alongside redux and have successfully created a working stream. Below is the code snippet of my action pipe:
action$.pipe(
ofType(DELETE_CALL_HISTORY),
withLatestFrom(state$),
mergeMap(() =>
fromPromise(accessService.getCallHistory()).pipe(
mergeMap((res: any) => of(deleteCallHistory(res))),
mergeMap((res: any) => of(setCallHistory(res.param))),
catchError((err: any) => {
console.error(err);
return of(
showErrorAndHideAfterDelay({
message: err,
label: 'Error',
}),
);
}),
),
),
),
In this implementation, I am attempting to execute three actions. The getCallHistory action is responsible for fetching data initially. Next, the deleteCallHistory action aims to remove an item from the list. So far, the action pipe functions as expected. However, when trying to utilize the setCallHistory action to set the updated list, it does not produce the desired result. Although the setCallHistory action is triggered, deleted items reappear upon app reload. Should I be duplicating the use of mergeMap like this or is there another approach I should consider?