Observable - 401 causing forkJoin error

I am using forkJoin to make multiple server requests. This is the pattern I used to use in my application and it works great. However, we have only just started implementing user roles that run on the backend. I'm not sure what is the best practice for implementing roles as I am mainly a frontend developer, however this is the problem I am facing:

Our application has member and administrator roles.

• In each view, I have to make calls to the backend for both the member and the member members, regardless of how the roles are not defined on the interface.

• Member data is always returned for both roles, since the admin members and members have personal data.

• Requests made for administrator data are returned only when the user is an administrator. Whenever the user doesn't have admin access, the query returns a 401 error. That is where I have my problem.

Whenever the call returns 401, the error method in my subscription method gets called and I don't have access to any of the calls that were made, including calls related to item data.

In my included code, inside forkJoin, there are five calls passed to the method. The third and fourth calls only return data if the user is an administrator, and the rest of the calls always return for a member or administrator.

When the user is not an admin, the third call returns 401 and the thread stops and the error handler in my subscription method gets called. This is obviously not what I want. I want the stream to continue so I can use the data in the _data method.

I have only been using RXJS for 6 months and am learning. Perhaps I should use a different pattern, or perhaps there is a way to fix this. Any help with code examples would be greatly appreciated. Below my example code, I've included another example code where I tried to fix the problem by playing around with the catch methods. It didn't work.

My View get method:

private getZone() {
  this.spinner.show();
  this.zonesService.getZone(this.zoneId)
    .map(response => {
      this.zone = response['group'];
      return this.zone;
    })
    .flatMap(() => {
      return Observable.forkJoin(
        this.teamsService.getTeam(this.zone['TeamId']),
        this.zonesService.getZoneAssociations(this.zone['id'], '/myDevices'),
        this.zonesService.getZoneAssociations(this.zone['id'], '/devices'),
        this.zonesService.getZoneAssociations(this.zone['id'], '/groupMembers'),
        this.sitesService.getSite(this.zone['SiteId'])
      );
    })
    .subscribe(
      _data => {
        // data handling...
      },
      _error => {
        // error handling ...
      }
    );
}

      

        
        
        
      

    

My attempt to fix:

private getZone() {
  this.spinner.show();
  this.zonesService.getZone(this.zoneId)
    .map(response => {
      this.zone = response['group'];
      return this.zone;
    })
    .flatMap(() => {
      return Observable.forkJoin(
        this.teamsService.getTeam(this.zone['TeamId']),
        this.zonesService.getZoneAssociations(this.zone['id'], '/myDevices'),
        this.zonesService.getZoneAssociations(this.zone['id'], '/devices')
          .catch(error => Observable.throw(error)),
        this.zonesService.getZoneAssociations(this.zone['id'], '/groupMembers')
          .catch(error => Observable.throw(error)),
        this.sitesService.getSite(this.zone['SiteId'])
      );
    })
    .subscribe(
      _data => {
        // data handling...
      },
      _error => {
        // error handling...
      }
    );
}