Client: handle the case when the refreshing token step fails

client/src/app/admin/requests/request-stats/request-stats.component.html

@@ -12,7 +12,7 @@
   </div>
 
   <div>
-    <span class="label-description">Total requests:</span>
+    <span class="label-description">Remaining requests:</span>
     {{ stats.requests.length }}
   </div>
 </div>

client/src/app/shared/auth/auth-http.service.ts

@@ -28,7 +28,7 @@ export class AuthHttp extends Http {
     return super.request(url, options)
                 .catch((err) => {
                   if (err.status === 401) {
-                    return this.handleTokenExpired(err, url, options);
+                    return this.handleTokenExpired(url, options);
                   }
 
                   return Observable.throw(err);
@@ -65,12 +65,13 @@ export class AuthHttp extends Http {
     return this.request(url, options);
   }
 
-  private handleTokenExpired(err: Response, url: string | Request, options: RequestOptionsArgs) {
+  private handleTokenExpired(url: string | Request, options: RequestOptionsArgs) {
-    return this.authService.refreshAccessToken().flatMap(() => {
+    return this.authService.refreshAccessToken()
-      this.setAuthorizationHeader(options.headers);
+                           .flatMap(() => {
+                              this.setAuthorizationHeader(options.headers);
 
-      return super.request(url, options);
+                              return super.request(url, options);
-    });
+                            });
   }
 
   private setAuthorizationHeader(headers: Headers) {

client/src/app/shared/auth/auth.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
-import { Headers, Http, URLSearchParams } from '@angular/http';
+import { Headers, Http, Response, URLSearchParams } from '@angular/http';
+import { Router } from '@angular/router';
 import { Observable } from 'rxjs/Observable';
 import { Subject } from 'rxjs/Subject';
 
@@ -20,7 +21,11 @@ export class AuthService {
   private loginChanged: Subject<AuthStatus>;
   private user: AuthUser = null;
 
-  constructor(private http: Http, private restExtractor: RestExtractor) {
+  constructor(
+    private http: Http,
+    private restExtractor: RestExtractor,
+    private router: Router
+   ) {
     this.loginChanged = new Subject<AuthStatus>();
     this.loginChangedSource = this.loginChanged.asObservable();
 
@@ -142,7 +147,21 @@ export class AuthService {
     return this.http.post(AuthService.BASE_TOKEN_URL, body.toString(), options)
                     .map(this.restExtractor.extractDataGet)
                     .map(res => this.handleRefreshToken(res))
-                    .catch((res) => this.restExtractor.handleError(res));
+                    .catch((res: Response) => {
+                      // The refresh token is invalid?
+                      if (res.status === 400 && res.json() && res.json().error === 'invalid_grant') {
+                        console.error('Cannot refresh token -> logout...');
+                        this.logout();
+                        this.router.navigate(['/login']);
+
+                        return Observable.throw({
+                          json: '',
+                          text: 'You need to reconnect.'
+                        });
+                      }
+
+                      return this.restExtractor.handleError(res);
+                    });
   }
 
   private fetchUserInformations (obj: any) {