[frontend] Add access token interceptor

kibicara-frontend/src/app/app.module.ts

@@ -10,12 +10,13 @@ import { DashboardModule } from './dashboard/dashboard.module';
 import { HoodpageComponent } from './hoodpage/hoodpage.component';
 import { HoodspageComponent } from './hoodspage/hoodspage.component';
 import { ApiModule } from './core/api/api.module';
-import { HttpClientModule } from '@angular/common/http';
+import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
 import { BASE_PATH } from './core/api/variables';
 import { environment } from 'src/environments/environment';
 import { LoginComponent } from './login/login.component';
 import { RegisterComponent } from './register/register.component';
 import { ReactiveFormsModule } from '@angular/forms';
+import { AuthTokenInterceptor } from './core/auth/auth-token.interceptor';
 
 @NgModule({
   declarations: [
@@ -36,7 +37,10 @@ import { ReactiveFormsModule } from '@angular/forms';
     HttpClientModule,
     ReactiveFormsModule,
   ],
-  providers: [{ provide: BASE_PATH, useValue: environment.API_BASE_PATH }],
+  providers: [
+    { provide: BASE_PATH, useValue: environment.API_BASE_PATH },
+    { provide: HTTP_INTERCEPTORS, useClass: AuthTokenInterceptor, multi: true },
+  ],
   bootstrap: [AppComponent],
 })
 export class AppModule {}

kibicara-frontend/src/app/core/auth/auth-token-interceptor.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { AuthTokenInterceptorService } from './auth-token-interceptor.service';
-
-describe('AuthTokenInterceptorService', () => {
-  let service: AuthTokenInterceptorService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(AuthTokenInterceptorService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

kibicara-frontend/src/app/core/auth/auth-token-interceptor.service.ts

@@ -1,26 +0,0 @@
-import { Injectable } from '@angular/core';
-import { HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
-import { Observable } from 'rxjs';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class AuthTokenInterceptorService {
-  constructor() {}
-
-  intercept(
-    req: HttpRequest<any>,
-    next: HttpHandler
-  ): Observable<HttpEvent<any>> {
-    // const token = this.loginService.token;
-
-    // if (token) {
-    //   req = req.clone({
-    //     setHeaders: {
-    //       Authorization: 'Bearer ' + this.loginService.token,
-    //     },
-    //   });
-    // }
-    return next.handle(req);
-  }
-}

kibicara-frontend/src/app/core/auth/auth-token.interceptor.spec.ts

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

kibicara-frontend/src/app/core/auth/auth-token.interceptor.ts

@@ -0,0 +1,29 @@
+import { Injectable } from '@angular/core';
+import {
+  HttpRequest,
+  HttpHandler,
+  HttpEvent,
+  HttpInterceptor,
+} from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { LoginService } from './login.service';
+
+@Injectable()
+export class AuthTokenInterceptor implements HttpInterceptor {
+  constructor(private loginService: LoginService) {}
+
+  intercept(
+    request: HttpRequest<any>,
+    next: HttpHandler
+  ): Observable<HttpEvent<any>> {
+    const token = this.loginService.currentHoodAdminValue;
+    if (token) {
+      request = request.clone({
+        setHeaders: {
+          Authorization: 'Bearer ' + token,
+        },
+      });
+    }
+    return next.handle(request);
+  }
+}

kibicara-frontend/src/app/core/auth/login.service.ts

@@ -1,18 +1,19 @@
 import { Injectable } from '@angular/core';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
-import { AdminService } from '../api';
+import { AdminService, BodyAccessToken } from '../api';
 
 @Injectable({
   providedIn: 'root',
 })
 export class LoginService {
-  private currentHoodAdminSubject: BehaviorSubject<any>;
-  public currentHoodAdmin: Observable<any>;
+  private currentHoodAdminSubject: BehaviorSubject<BodyAccessToken>;
+  public currentHoodAdmin: Observable<BodyAccessToken>;
+  private identifier = 'currentHoodAdmin';
 
   constructor(private readonly adminService: AdminService) {
-    this.currentHoodAdminSubject = new BehaviorSubject<any>(
-      JSON.parse(localStorage.getItem('currentHoodAdmin'))
+    this.currentHoodAdminSubject = new BehaviorSubject<BodyAccessToken>(
+      JSON.parse(localStorage.getItem(this.identifier))
     );
     this.currentHoodAdmin = this.currentHoodAdminSubject.asObservable();
   }
@@ -24,7 +25,7 @@ export class LoginService {
   login(email, password) {
     return this.adminService.login(email, password).pipe(
       map((response) => {
-        localStorage.setItem('currentHoodAdmin', JSON.stringify(response));
+        localStorage.setItem(this.identifier, JSON.stringify(response));
         this.currentHoodAdminSubject.next(response);
         return response;
       })
@@ -32,7 +33,7 @@ export class LoginService {
   }
 
   logout() {
-    localStorage.removeItem('currentHoodAdmin');
+    localStorage.removeItem(this.identifier);
     this.currentHoodAdminSubject.next(null);
   }
 }

kibicara-frontend/src/app/dashboard/dashboard.module.ts

@@ -4,12 +4,8 @@ import { HoodsComponent } from './hoods/hoods.component';
 import { SettingspageComponent } from './settingspage/settingspage.component';
 import { DashboardComponent } from './dashboard.component';
 
-
-
 @NgModule({
   declarations: [HoodsComponent, SettingspageComponent, DashboardComponent],
-  imports: [
-    CommonModule
-  ]
+  imports: [CommonModule],
 })
 export class DashboardModule {}