export class AdministratorGuard implements CanActivate {
constructor(private authService: AuthService, private router: Router) {}
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observabletrue | UrlTree> {
// Check whether this user is an administratoor.  
return this.authService.isAdmin().pipe(
map(isAdmin => {
if (!isAdmin) {
return this.router.parseUrl('/')
        }
return isAdmin
      })
    )
  }
}
export class AuthService {
constructor(private http: HttpClient) {}
// Whether the user is currently logged in.
loggedIn: boolean | null = null
// The user object object encompassing the user's name and role. Will be set
user: User | null = null
// Check whether the current user is an administrator.
isAdmin(): Observableboolean> {
return this.getCurrentUser().pipe(map(user => {
return user != null && user.role === 'admin'
    }))
  }
// Get the user definition from local state, or the server (if this is the first time we are checking).
getCurrentUser(): ObservableUser | null> {
if (this.loggedIn !== null) {
return of(this.user)
    }
return this.http.getUser>('/api/auth', {
responseType: 'json'
    }).pipe(
tap({
next: user => {
// If we get a user definition from the server it indicates this user is logged in.  
this.user     = user
this.loggedIn = true
        },
error: error => {
// A 401 response from the server indicates this user is not logged in.  
this.user     = null
this.loggedIn = false
        }
      }),
catchError(() => {
return of(null)
      })
    )
  }
}
export interface User {
username: string
role:     string
}

export class LoginComponent {

// The username and password entered by the user in the login form.
username = '';
password = '';

// The destination URL to redirect the user to once they log in successfully.
destinationURL = '/feed'

constructor(private authService : AuthService,
private route       : ActivatedRoute,
private router      : Router) { }

ngOnInit() {
this.destinationURL = this.route.snapshot.queryParams['destination'] || '/feed';
  }

onSubmit() {
this.authService.login(this.username, this.password)
      .subscribe(
        () => {
// After the user has lgged in, redirect them to their desired destination.
let url = this.destinationURL

// Confirm that the URL is a relative path - i.e. starting with a single '/' characters.
if (!url.match(/^/[^/]/)) {
url = '/feed'
          }

this.router.navigate([ url ])
        })
  }
}

@NgModule({
declarations: [],
imports: [
BrowserModule,
HttpClientModule,
HttpClientXsrfModule.withOptions({
cookieName: 'XSRF-TOKEN',
headerName: 'X-CSRF-TOKEN'
    }),
  ],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {
}

@Component({
selector: 'app-header',
template: '
' + (window.location.hash || 'Home') + ''
})
export class HeaderComponent {}

@Component({
selector: 'app-header',
template: '
{{ title }}
'
})
export class HeaderComponent {
title = ''  

ngOnInit() {
this.title = window.location.hash || 'Home';
  }
}

// The configuration information we will retrieve from the server.
export interface Config {
username     : string
accessToken  : string
role         : string
}

@Injectable()
export class ConfigService {
constructor(private http: HttpClient) {}

// Retrieve configuration information from the server.
getConfig() {
return this.http.getConfig>('api/config')
      .pipe(
catchError(this.handleError) 
      )
  }

private handleError(error: HttpErrorResponse) {
if (error.status === 0) {
// A client-side or network error occurred. Handle it accordingly.
log.error('An error occurred:', error.error)
    } else {
// The server returned an unsuccessful response code.
log.error(`Backend returned code ${error.status}, body was: `, error.error)
    }

return throwError('An unexpected error occurred loading configuration.')
  }
}