effects.tns.ts

@Injectable()
export class Effects {
  getPending$ = createEffect(() =>
    this.actions$.pipe(
      ofType(ApprovalActions.getAllPendingApprovals),
      switchMap(res =>
        this.apiService.getAllPendingApprovals()
      ),
      map((approvals) => ApprovalActions.getAllPendingApprovalsComplete({ approvals }))
    )
  );
  
  savePhoto$ = createEffect(() =>
    this.actions$.pipe(
      ofType(
        NewExpenseActions.takePhotoComplete,
        NewExpenseActions.selectPhotoLibraryComplete
      ),
      tap(() => {
        this.routerExtensions.navigateByUrl('/create-expense', { clearHistory: true });  // MOBILE ONLY
      }),
      switchMap(({ uri }) => this.apiService.saveOneExpenseReceipt(uri)), // MOBILE ONLY
      map((token) => NewExpenseActions.savePhotoComplete({ token }))
    )
  );

  constructor(
    private actions$: Actions,
    private apiService: ApiService
  ) { }
}

effects.ts

@Injectable()
export class Effects {
  getPending$ = createEffect(() =>
    this.actions$.pipe(
      ofType(ApprovalActions.getAllPendingApprovals),
      switchMap(res =>
        this.apiService.getAllPendingApprovals()
      ),
      map((approvals) => ApprovalActions.getAllPendingApprovalsComplete({ approvals }))
    )
  );
  
  openModal$ = createEffect(() =>
    this.actions$.pipe(
      ofType(ModalActions.openModal),
      tap(({ name }) => {
        this.modalService.open(name); // WEB ONLY
      })
    ), { dispatch: false }
  );

  constructor(
    private actions$: Actions,
    private apiService: ApiService,
    private modalService: BaseModalService
  ) { }
}