Working on an Angular project that utilizes @ngrx/effect, we are incorporating an observable stream with the withLatestFrom rxjs operator.
Here is a glimpse of our observable effect stream:
@Effect()
handleUsersData$ = this.actions$
.pipe(
ofType(HANDLE_USER_DATA),
withLatestFrom(
this.store.pipe(select(getCurrentUserId)),
this.store.pipe(select(getUserEntities)),
),
tap(([action, currentUserId, users]) => console.log(([action, currentUserId, users]))),
switchMap(([action, currentUserId, users]) => {
const dispatchedActions: Action[] = [];
if (currentUserId) {
dispatchedActions.push(new SetCurrentUser());
} else {
dispatchedActions.push(new SomeAction());
dispatchedActions.push(new ClearUsers());
}
return dispatchedActions;
})
);
One of the selectors being used is as follows:
export const getCurrentUserId = createSelector(
getUserEntities,
getRouterStateUrl,
(users: Dictionary<User>, router: RouterStateUrl) => {
return router.params && users[router.params.userId] || null;
}
);
When a userId is specified, the actions are correctly dispatched. The user ID and user entities are displayed in the console.log.
However, when the userId is not included in the router params, the selector returns null and the observable stream does not trigger. The console.log within the tap function shows nothing.
Why does the withLatestFrom appear to disregard the null value and fail to tick if this is the outcome of the selector? This value is valid within our scenario.
What can be done to guarantee that the observable stream keeps ticking even when there is a null value in the getCurrentUserId selector?