fix(app-check): move app check to an http interceptor

package.json

@@ -66,7 +66,7 @@
     "@capacitor/splash-screen": "5.0.7",
     "@ctrl/ngx-github-buttons": "9.0.0",
     "@google/model-viewer": "3.4.0",
-    "@ionic/angular": "7.6.6",
+    "@ionic/angular": "7.7.0",
     "@mediapipe/drawing_utils": "0.3.1675466124",
     "@mediapipe/holistic": "0.5.1675471629",
     "@mediapipe/tasks-text": "^0.10.9",
@@ -115,7 +115,7 @@
     "@angular/compiler-cli": "17.1.1",
     "@capacitor/assets": "3.0.4",
     "@capacitor/cli": "5.6.0",
-    "@ionic/angular-server": "7.6.6",
+    "@ionic/angular-server": "7.7.0",
     "@playwright/test": "1.41.1",
     "@sign-mt/configuration": "git://github.com/sign/.github.git",
     "@trapezedev/project": "7.0.10",

src/app/app.module.ts

@@ -11,6 +11,8 @@ import {AppTranslocoModule} from './core/modules/transloco/transloco.module';
 import {AppNgxsModule} from './core/modules/ngxs/ngxs.module';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {isSafari} from './core/constants';
+import {HTTP_INTERCEPTORS} from '@angular/common/http';
+import {TokenInterceptor} from './core/services/http/token-interceptor.service';
 
 @NgModule({
   declarations: [AppComponent],
@@ -29,7 +31,11 @@ import {isSafari} from './core/constants';
       registrationStrategy: 'registerWhenStable:30000',
     }),
   ],
-  providers: [NavigatorService, {provide: RouteReuseStrategy, useClass: IonicRouteStrategy}],
+  providers: [
+    NavigatorService,
+    {provide: RouteReuseStrategy, useClass: IonicRouteStrategy},
+    {provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true},
+  ],
   bootstrap: [AppComponent],
 })
 export class AppModule {}

src/app/core/services/http/token-interceptor.service.ts

@@ -0,0 +1,27 @@
+import {Injectable} from '@angular/core';
+import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
+import {from, Observable, switchMap} from 'rxjs';
+import {AppCheck} from '../../helpers/app-check/app-check';
+
+@Injectable()
+export class TokenInterceptor implements HttpInterceptor {
+  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    if (req.url.includes('/api/')) {
+      const appCheckToken$ = from(AppCheck.getToken());
+
+      return appCheckToken$.pipe(
+        switchMap(token =>
+          next.handle(
+            req.clone({
+              headers: req.headers
+                .set('X-Firebase-AppCheck', token) // Python Cloud Functions
+                .set('X-AppCheck-Token', token), // Node.js Cloud Functions
+            })
+          )
+        )
+      );
+    }
+
+    return next.handle(req);
+  }
+}

src/app/modules/translate/translate.service.ts

@@ -1,8 +1,7 @@
 import {Injectable} from '@angular/core';
-import {delay, from, Observable, of, switchMap} from 'rxjs';
+import {Observable} from 'rxjs';
 import {map} from 'rxjs/operators';
 import {HttpClient} from '@angular/common/http';
-import {AppCheck} from '../../core/helpers/app-check/app-check';
 
 @Injectable({
   providedIn: 'root',
@@ -173,25 +172,15 @@ export class TranslationService {
     params.set('text', text);
     const url = 'https://sign.mt/api/text-normalization?' + params.toString();
 
-    const appCheckToken$ = from(AppCheck.getToken());
-
-    return appCheckToken$.pipe(
-      switchMap(token => this.http.get<{text: string}>(url, {headers: {'X-AppCheck-Token': token}})),
-      map(response => response.text)
-    );
+    return this.http.get<{text: string}>(url).pipe(map(response => response.text));
   }
 
   describeSignWriting(fsw: string): Observable<string> {
     const url = 'https://sign.mt/api/signwriting-description';
 
-    const appCheckToken$ = from(AppCheck.getToken());
-
-    return appCheckToken$.pipe(
-      switchMap(token =>
-        this.http.post<{result: {description: string}}>(url, {data: {fsw}}, {headers: {'X-Firebase-AppCheck': token}})
-      ),
-      map(response => response.result.description)
-    );
+    return this.http
+      .post<{result: {description: string}}>(url, {data: {fsw}})
+      .pipe(map(response => response.result.description));
   }
 
   translateSpokenToSigned(text: string, spokenLanguage: string, signedLanguage: string): string {