How we can replace Effect code with createEffect in angular for logging..?

Question

Can anyone please help me out with how I can convert below Effect code with createEffect? As we know that effect is already deprecated.?

  @Effect()
LogIn: Observable<any> = this.actions.pipe(
  ofType(AuthActionTypes.LOGIN)
  .map((action: LogIn) => action.payload)
  .switchMap((payload: any) => {
    return this.authService.logIn(payload.email, payload.password).
      .map((user: any) => {
        console.log(user);
        return new LogInSuccess({token: user.token, email: payload.email});
      })
      .catch((error: any) => {
        console.log(error);
        // return Observable.of(new LogInFailure({ error: error }));
      });
  }));

Thanks in Advance !! NOTE* :- I am using below doc for this https://mherman.org/blog/authentication-in-angular-with-ngrx/

Answer 1

LogIn: Observable<any> = createEffect(() => {
  return this.actions.pipe(
  ofType(AuthActionTypes.LOGIN),
  map((action: LogIn) => action.payload),
  switchMap((payload: any) => {
    return this.authService.logIn(payload.email, payload.password).pipe(
      map((user: any) => {
        console.log(user);
        return new LogInSuccess({token: user.token, email: payload.email});
      }),
      catchError((error: any) => {
        console.log(error);
        return of(new LogInFailure({ error: error }));
      });
  })
});