Effect inside Componentstore not terminating

Question

I have a NX Repo with NGRX Componentstore. I have a simple AuthStore with a Login effect. However as soon as i dispatch a login to trigger the API call I will get the desired Token, but it never terminates. So the Effect requests Token after Token.

This is the effect which causes the:

getAccountLoginDTO = this.effect(
    (loginRequestDTO$: Observable<LoginRequestDTO>) =>
      loginRequestDTO$.pipe(
        tap(() => this.setIsLoading(true)),
        exhaustMap((loginRequestDTO) =>
          this.authService.login(loginRequestDTO).pipe(
            tapResponse(
              (loginResponseDTO: LoginResponseDTO) => {
                this.patchState({
                  loginResponseDTO,
                  isAuthenticated: true,
                  loading: false,
                });
              },
              (error: ApiError) => {
                this.patchState({
                  error,
                  isAuthenticated: false,
                  loading: false,
                });
              }
            )
          )
        )
      )
  );

How can I get this effect to only run if I need the Token (1 Time)?

Thanks

The full repo/file: https://github.com/party-time-2/party-time/blob/main/libs/auth/src/lib/%2Bstate/auth.state.ts

Answer 1

You've created an effect that continues to send the received action back to the store. Either send a different action, or create a non-dispatching effect so that the action is not send to the store.

getAccountLoginDTO = this.effect(
    (loginRequestDTO$: Observable<LoginRequestDTO>) =>
      loginRequestDTO$.pipe(
        tap(() => this.setIsLoading(true)),
        exhaustMap((loginRequestDTO) =>
          this.authService.login(loginRequestDTO).pipe(
            tapResponse(
              (loginResponseDTO: LoginResponseDTO) => {
                this.patchState({
                  loginResponseDTO,
                  isAuthenticated: true,
                  loading: false,
                });
              },
              (error: ApiError) => {
                this.patchState({
                  error,
                  isAuthenticated: false,
                  loading: false,
                });
              }
            )
          )
        )
      ),
    // 👇
    {dispatch: false}
  );