[frontend] Add error interceptor, fix auth interceptor, add lazy loaded dashboard component

This commit is contained in:
Cathy Hu 2020-08-18 23:49:13 +02:00
parent 3e7bb6878f
commit 75df2e8cf6
4 changed files with 59 additions and 5 deletions

View file

@ -2,22 +2,28 @@ import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router'; import { Routes, RouterModule } from '@angular/router';
import { NotFoundComponent } from './shared/not-found/not-found.component'; import { NotFoundComponent } from './shared/not-found/not-found.component';
import { HomepageComponent } from './homepage/homepage.component'; import { HomepageComponent } from './homepage/homepage.component';
import { LoginComponent } from './login/login.component'; import { LoginComponent } from './auth/login/login.component';
import { RegisterComponent } from './register/register.component'; import { RegisterComponent } from './auth/register/register.component';
import { OrganizerspageComponent } from './organizerspage/organizerspage.component'; import { OrganizerspageComponent } from './organizerspage/organizerspage.component';
import { HoodspageComponent } from './hoodspage/hoodspage.component'; import { HoodspageComponent } from './hoodspage/hoodspage.component';
import { HoodpageComponent } from './hoodpage/hoodpage.component'; import { HoodpageComponent } from './hoodpage/hoodpage.component';
import { SharedModule } from './shared/shared.module'; import { SharedModule } from './shared/shared.module';
import { ConfirmComponent } from './auth/confirm/confirm.component';
const routes: Routes = [ const routes: Routes = [
{ path: '', component: HomepageComponent }, { path: '', component: HomepageComponent },
{ path: 'login', component: LoginComponent }, { path: 'login', component: LoginComponent },
{ path: 'register', component: RegisterComponent }, { path: 'register', component: RegisterComponent },
{ path: 'confirm', component: ConfirmComponent },
{ path: 'organizers', component: OrganizerspageComponent }, { path: 'organizers', component: OrganizerspageComponent },
{ path: 'hoods', component: HoodspageComponent }, { path: 'hoods', component: HoodspageComponent },
{ path: 'hoods/:id', component: HoodpageComponent }, { path: 'hoods/:id', component: HoodpageComponent },
{
path: 'dashboard',
loadChildren: () =>
import('./dashboard/dashboard.module').then((m) => m.DashboardModule),
},
{ path: '**', component: NotFoundComponent }, { path: '**', component: NotFoundComponent },
//TODO Lazy Load dashboard
]; ];
@NgModule({ @NgModule({

View file

@ -17,10 +17,10 @@ export class AuthTokenInterceptor implements HttpInterceptor {
next: HttpHandler next: HttpHandler
): Observable<HttpEvent<any>> { ): Observable<HttpEvent<any>> {
const token = this.loginService.currentHoodAdminValue; const token = this.loginService.currentHoodAdminValue;
if (token) { if (token && token.access_token) {
request = request.clone({ request = request.clone({
setHeaders: { setHeaders: {
Authorization: 'Bearer ' + token, Authorization: 'Bearer ' + token.access_token,
}, },
}); });
} }

View file

@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { ErrorInterceptor } from './error.interceptor';
describe('ErrorInterceptor', () => {
beforeEach(() =>
TestBed.configureTestingModule({
providers: [ErrorInterceptor],
})
);
it('should be created', () => {
const interceptor: ErrorInterceptor = TestBed.inject(ErrorInterceptor);
expect(interceptor).toBeTruthy();
});
});

View file

@ -0,0 +1,32 @@
import { Injectable } from '@angular/core';
import {
HttpRequest,
HttpHandler,
HttpEvent,
HttpInterceptor,
} from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { LoginService } from './login.service';
import { catchError } from 'rxjs/operators';
import { Router } from '@angular/router';
@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
constructor(private loginService: LoginService, private router: Router) {}
intercept(
request: HttpRequest<unknown>,
next: HttpHandler
): Observable<HttpEvent<any>> {
return next.handle(request).pipe(
catchError((err) => {
if (err.status === 401) {
this.loginService.logout();
location.reload(true);
}
const error = err.error.message || err.statusText;
return throwError(error);
})
);
}
}