I want to conditionally dispatch some actions using iif utility from RxJS. The problem is that second argument to iif is called even if test function returns false. This throws an error and app crashes immediately. I am new to to the power of RxJS so i probably don't know something. And i am using connected-react-router package if that matters.
export const roomRouteEpic: Epic = (action$, state$) => action$.ofType(LOCATION_CHANGE).pipe( pluck('payload'), mergeMap(payload => iif( () => { console.log('NOT LOGGED'); return /^\/room\/\d+$/.test(payload.location.pathname); // set as '/login' }, merge( tap(v => console.log('NOT LOGGED TOO')), of( // following state value is immediately evaluated state$.value.rooms.list[payload.location.pathname.split('/')[1]] ? actions.rooms.initRoomEnter() : actions.rooms.initRoomCreate(), ), of(actions.global.setIsLoading(true)), ), empty(), ), ), );
Ok, i found an answer on my own. My solution is to remove iif completely and rely on just ternary operator inside mergeMap. that way its not evaluated after every 'LOCATION_CHANGE' and just if regExp returns true. Thanks for your interest.
export const roomRouteEpic: Epic = (action$, state$) =>
action$.ofType(LOCATION_CHANGE).pipe(
pluck<any, any>('payload'),
mergeMap(payload =>
/^\/room\/\d+$/.test(payload.location.pathname)
? of(
state$.value.rooms.list[payload.location.pathname.split('/')[2]]
? actions.rooms.initRoomEnter()
: actions.rooms.initRoomCreate(),
actions.global.setIsLoading(true),
)
: EMPTY,
),
);