* Include additional share URL to test redact

nigel-wells · nigel-wells · commit f5b016902cf6 · 2025-04-15T14:18:06.000+12:00
* Await online status before sending requests
* Moved GA configuration to Analytics Service
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/index.html b/src/SIL.XForge.Scripture/ClientApp/src/index.html
@@ -1,15 +1,12 @@
 <!doctype html>
 <html lang="en">
   <head>
-    <script async src="https://www.googletagmanager.com/gtag/js?id=G-SVKBDV7K3Q"></script>
+    <script async src="https://www.googletagmanager.com/gtag/js"></script>
     <script>
       window.dataLayer = window.dataLayer || [];
       function gtag() {
         dataLayer.push(arguments);
       }
-      gtag("js", new Date());
-
-      gtag("config", "G-SVKBDV7K3Q");
     </script>
 
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Outlined" rel="stylesheet" />
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/analytics.service.spec.ts b/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/analytics.service.spec.ts
@@ -7,7 +7,8 @@ describe('AnalyticsService', () => {
   });
 
   it('should redact the join key from URL', () => {
-    const url = 'https://example.com/join/123';
-    expect(sanitizeUrl(url)).toEqual('https://example.com/join/redacted');
+    ['https://example.com/join/123', 'https://example.com/join/123/en'].forEach(url => {
+      expect(sanitizeUrl(url)).toContain('https://example.com/join/redacted');
+    });
   });
 });
diff --git a/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/analytics.service.ts b/src/SIL.XForge.Scripture/ClientApp/src/xforge-common/analytics.service.ts
@@ -4,16 +4,39 @@ import { OnlineStatusService } from './online-status.service';
 
 declare function gtag(...args: any): void;
 
-// Using a type rather than interface because I intend to turn in into a union type later for each type of event that
-// can be reported.
-// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
-type EventParams = {
-  page_path: string;
-};
+interface CommandParams {}
+
+enum GoogleCommands {
+  Config = 'config',
+  Event = 'event',
+  JavaScript = 'js'
+}
+
+interface ConfigParams extends CommandParams {
+  send_page_view?: boolean;
+}
+
+interface PageViewParams extends CommandParams {
+  page_location?: string;
+  page_title?: string;
+}
 
 @Injectable({ providedIn: 'root' })
 export class AnalyticsService {
-  constructor(private readonly onlineStatus: OnlineStatusService) {}
+  private initiated?: Promise<void>;
+  constructor(private readonly onlineStatus: OnlineStatusService) {
+    if (typeof environment.googleTagId !== 'string') {
+      return;
+    }
+
+    this.initiated = new Promise(resolve => {
+      this.onlineStatus.online.then(() => {
+        this.send(GoogleCommands.JavaScript, new Date());
+        this.send(GoogleCommands.Config, environment.googleTagId, { send_page_view: false } as ConfigParams);
+        resolve();
+      });
+    });
+  }
 
   /**
    * Logs the page navigation event to the analytics service. This method is responsible for sanitizing the URL before
@@ -22,13 +45,11 @@ export class AnalyticsService {
    */
   logNavigation(url: string): void {
     const sanitizedUrl = sanitizeUrl(url);
-    this.logEvent('page_view', { page_path: sanitizedUrl });
+    this.send(GoogleCommands.Event, 'page_view', { page_location: sanitizedUrl } as PageViewParams);
   }
 
-  private logEvent(eventName: string, eventParams: EventParams): void {
-    if (this.onlineStatus.isOnline && typeof environment.googleTagId === 'string') {
-      gtag(eventName, environment.googleTagId, eventParams);
-    }
+  private send(command: GoogleCommands, name: any, params?: CommandParams): void {
+    Promise.all([this.initiated, this.onlineStatus.online]).then(() => gtag(command, name, params));
   }
 }
 
