I have been struggling to make this work. I am listening to setTeam action and checking if the image is null from the payload. If it's null, call the API and get blob and convert it to base64 and dispatch update action.
The code looks like this.
fetchImage = createEffect(() =>
this.actions$.pipe(
ofType(teamActions.setTeam),
withLatestFrom(this.store.pipe(select(selectTeam))),
switchMap(([payload]) => {
if (!payload.team.teamLogoImage) {
return this.teamService.getImage(payload.team.id)
.pipe(map((value => {
ImageUtils.getBase64(value); //returns promise
return teamActions.updateTeamLogoImage({teamLogoImage: val});
})))
}
})
));
The problem here is ImageUtils.getBase64 returns Promise and I need to wait till this promise is resolved before dispatching updateTeamLogoImage action. How can this be achieved?