catchError not working when refresh token gets 401 unauthorized in Angular 16

Question

Currently when any http request returns 401 Unauthorized, It refreshes tokens and re-call the last failed request successfully when access token and refresh token are not expired (backend is in nestjs).

My problem arises whenever I need to call refresh token and this expired in backend, returning 401 Unauthorized.

In this case, I need to logout the app which is not executing.

Here's interceptor:

  private renewAuthTokens(request: HttpRequest<unknown>, next: HttpHandler) {
    if (!this.refreshingTokensInProgress) {
      console.log('refresh token in progress');
      this.refreshingTokensInProgress = true;
      // Start the refresh token process
      this.refreshTokenSubject.next(null);

      return this.authService.refreshTokens()
          .pipe(
            tap((response: SessionTokenModel) => {
              this.authService.setTokens(response.accessToken!, response.refreshToken!);
            }),
            switchMap((tokens: SessionTokenModel) => {
              console.log('received new token from server, emit them and update token request');
              // Emit the new token
              this.refreshTokenSubject.next(tokens.accessToken);
              // Update the token of the request with the new one
              return next.handle(this.addAuthToken(request, tokens.accessToken!));
            }),
            catchError(() => {
              console.log('refresh token error: Redirecting to logout');
              this.authService.logout();
              return throwError(() => request);
            }),
            finalize(() => {
              this.refreshingTokensInProgress = false;
            })
          );
    } else {
      return this.refreshTokenSubject.pipe(
        filter((newToken) => newToken !== null),
        take(1),
        switchMap((newToken) => {
          console.log('received emitted new token, re-send previous failed request');
          this.refreshingTokensInProgress = false;
          // Resend the previous failed request with a new token
          return next.handle(this.addAuthToken(request, newToken));
        })
      );
    }
  }

Here is authService - refresh tokens:

catchError into pipe is not executing.

I checked similar issues here and here and I made different changes to code based on those posts with no success.

Thanks