Configure frontend to use api gateway

frontend/src/_services/api.service.ts

@@ -0,0 +1,21 @@
+import { API_CONFIG } from '../app/api.config';
+
+/**
+ * Abstract class that serves as a base for API services.
+ */
+export abstract class ApiService {
+    /**
+     * The path for the specific resource, e.g. 'user', 'question', etc.
+     * This property must be implemented by subclasses to specify the
+     * endpoint path for the API resource they represent.
+     */
+    protected abstract apiPath: string;
+
+    /**
+     * Returns the full URL for the API endpoint based on
+     * the specified apiPath.
+     */
+    get apiUrl(): string {
+        return API_CONFIG.baseUrl + this.apiPath;
+    }
+}

frontend/src/_services/question.service.ts

@@ -1,6 +1,5 @@
 import { HttpClient, HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
 import { Injectable } from '@angular/core';
-import { API_CONFIG } from '../app/api.config';
 import { catchError, Observable, throwError } from 'rxjs';
 import {
     SingleQuestionResponse,
@@ -9,20 +8,23 @@ import {
     MessageOnlyResponse,
 } from '../app/questions/question.model';
 import { TopicResponse } from '../app/questions/topic.model';
+import { ApiService } from './api.service';
 
 @Injectable({
     providedIn: 'root',
 })
-export class QuestionService {
-    private baseUrl = API_CONFIG.baseUrl + '/questions';
+export class QuestionService extends ApiService {
+    protected apiPath = 'question/questions';
 
     private httpOptions = {
         headers: new HttpHeaders({
             'Content-Type': 'application/json',
         }),
     };
 
-    constructor(private http: HttpClient) {}
+    constructor(private http: HttpClient) {
+        super();
+    }
 
     getQuestions(
         title?: string,
@@ -46,11 +48,11 @@ export class QuestionService {
         }
 
         // send request
-        return this.http.get<QuestionResponse>(this.baseUrl, { params });
+        return this.http.get<QuestionResponse>(this.apiUrl, { params });
     }
 
-    getQuestionByID(id: number): Observable<SingleQuestionResponse> {
-        return this.http.get<SingleQuestionResponse>(this.baseUrl + '/' + id);
+    getQuestionByID(id: number): Observable<QuestionResponse> {
+        return this.http.get<QuestionResponse>(this.apiUrl + '/' + id);
     }
 
     getQuestionByParam(topics: string[], difficulty: string, limit?: number): Observable<QuestionResponse> {
@@ -61,32 +63,32 @@ export class QuestionService {
         }
         params = params.append('topics', topics.join(',')).append('difficulty', difficulty);
 
-        return this.http.get<QuestionResponse>(this.baseUrl + '/search', { params });
+        return this.http.get<QuestionResponse>(this.apiUrl + '/search', { params });
     }
 
     getTopics(): Observable<TopicResponse> {
-        return this.http.get<TopicResponse>(this.baseUrl + '/topics');
+        return this.http.get<TopicResponse>(this.apiUrl + '/topics');
     }
 
     addQuestion(question: QuestionBody): Observable<SingleQuestionResponse> {
         return this.http
-            .post<SingleQuestionResponse>(this.baseUrl, question, this.httpOptions)
+            .post<SingleQuestionResponse>(this.apiUrl, question, this.httpOptions)
             .pipe(catchError(this.handleError));
     }
 
     updateQuestion(id: number, question: QuestionBody): Observable<SingleQuestionResponse> {
         return this.http
-            .put<SingleQuestionResponse>(this.baseUrl + '/' + id, question, this.httpOptions)
+            .put<SingleQuestionResponse>(this.apiUrl + '/' + id, question, this.httpOptions)
             .pipe(catchError(this.handleError));
     }
 
     deleteQuestion(id: number): Observable<SingleQuestionResponse> {
-        return this.http.delete<SingleQuestionResponse>(this.baseUrl + '/' + id).pipe(catchError(this.handleError));
+        return this.http.delete<SingleQuestionResponse>(this.apiUrl + '/' + id).pipe(catchError(this.handleError));
     }
 
     deleteQuestions(ids: number[]): Observable<MessageOnlyResponse> {
         return this.http
-            .post<MessageOnlyResponse>(this.baseUrl + '/delete', { ids }, this.httpOptions)
+            .post<MessageOnlyResponse>(this.apiUrl + '/delete', { ids }, this.httpOptions)
             .pipe(catchError(this.handleError));
     }
 

frontend/src/app/api.config.ts

@@ -1,3 +1,3 @@
 export const API_CONFIG = {
-    baseUrl: 'http://localhost:8081',
+    baseUrl: 'http://localhost:8080/api/',
 };