I would just like to ask for suggestions and ideas about my current issue , I have a method which is getUserRoles which is fetching the logged-in user roles list.

The problem I have is that there are instances that the getUserGeneralDetails from the getUserRoles that is causing infinity , it is calling the getUserGeneralDetails infinitely and I dont understand why and what causes it.

Maybe somone can enlighten me with some problem with the code snippet I have below. Would be appreciatd, Thanks.

#method

  //In this method, we are just fetching the logged-in user roles list.
  public getUserRoles(): Promise<string[]> {

    if (this.authUser === null) {
      this.setAuthUser()
    }
    
    return new Promise((resolve, reject) => {
      this.userService
      .getUserGeneralDetails(this.authUser.nameid , this.accountId = 0)
        .pipe(catchError((error: any, caught: any) => {
          reject(error);
          return caught;
        }),
          map((res: any) => res.data && res.data.userAccountDto
            .filter(account => account.accountName === res.data.associatedAccount)
            .map(account => account.userRoleDto.roleName)
          )).subscribe((role: string[]) => {
            resolve(role);
          });

    });
  }

#code that calls the getUserRoles method

this.authService
          .loginWithCredentials(username, password)
          .then((r: any) => {
            localStorage.removeItem("previousUrl");
            if (r.isSuccess) {


              this.authService.getUserRoles().then((userRoles: string[]) => {
                localStorage.setItem("userRoles", JSON.stringify(userRoles));
              })

              
              this.route.navigateByUrl('/');
            }else{                                         
              if(r.errors.length > 0){                
                if(r.errors[0].description.indexOf('not found') !== -1){
                  errMsg = ERR_FORM_MSG.INVALID_LOGIN;
                }
              }
              this.apiErrMsg = errMsg;              
            }
          })
          .catch((e): any => {
            this.apiErrMsg = e.message
              ? e.message
              : errMsg;
          })
          .finally(() => {
            this.hasSubmit = false;
            this.closeLoader();
          });
      }

#user details

 getUserGeneralDetails(id: number , accountId:number): Observable<any> {
    const params = new HttpParams()
      .set('id', id.toString())
      .set('accountId', accountId.toString());
    return this.httpRequestService.get<any>(`${apiBaseUrl}/detail` , params);
  }