Feat/setup posthog

.github/workflows/deploy.yml

@@ -48,10 +48,12 @@ jobs:
         env:
           POSTHOG_PROJECT_TOKEN: ${{ vars.POSTHOG_PROJECT_TOKEN }}
           POSTHOG_API_HOST: ${{ vars.POSTHOG_API_HOST }}
+          POSTHOG_UI_HOST: ${{ vars.POSTHOG_UI_HOST }}
         run: >-
           pnpm run build:prod
           --define "process.env.POSTHOG_PROJECT_TOKEN='$POSTHOG_PROJECT_TOKEN'"
           --define "process.env.POSTHOG_API_HOST='$POSTHOG_API_HOST'"
+          --define "process.env.POSTHOG_UI_HOST='$POSTHOG_UI_HOST'"
 
       - name: Upload source maps to PostHog
         env:

angular.json

@@ -80,7 +80,8 @@
             },
             "define": {
               "process.env.POSTHOG_PROJECT_TOKEN": "\"\"",
-              "process.env.POSTHOG_API_HOST": "\"\""
+              "process.env.POSTHOG_API_HOST": "\"\"",
+              "process.env.POSTHOG_UI_HOST": "\"\""
             }
           },
           "configurations": {

src/app/app.component.ts

@@ -1,9 +1,12 @@
 import {
+  afterNextRender,
   ChangeDetectionStrategy,
   Component,
+  inject,
   ViewEncapsulation,
 } from "@angular/core";
 import { RouterOutlet } from "@angular/router";
+import { UrlTagCaptureService } from "./services/url-tag-capture.service";
 
 @Component({
     selector: "app-root",
@@ -13,5 +16,9 @@ import { RouterOutlet } from "@angular/router";
     changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class AppComponent {
-  title = "application";
+  private readonly urlTagCaptureService = inject(UrlTagCaptureService);
+
+  constructor() {
+    afterNextRender(() => this.urlTagCaptureService.captureAndClearTag());
+  }
 }

src/app/initializers/posthog-analytics.initializer.ts

@@ -16,6 +16,11 @@ export function initializePosthogAnalytics(): void {
     throw new Error("POSTHOG_API_HOST is not configured at build time.");
   }
 
+  const uiHost = process.env["POSTHOG_UI_HOST"];
+  if (uiHost === undefined || uiHost.length === 0) {
+    throw new Error("POSTHOG_UI_HOST is not configured at build time.");
+  }
+
   const platformIdentifier = inject(PLATFORM_ID);
   if (!isPlatformBrowser(platformIdentifier)) {
     return;
@@ -27,6 +32,7 @@ export function initializePosthogAnalytics(): void {
       .then(({ default: posthog }) =>
         posthog.init(projectToken, {
           api_host: apiHost,
+          ui_host: uiHost,
           defaults: "2026-05-30",
         }),
       )

src/app/services/url-tag-capture.service.ts

@@ -0,0 +1,33 @@
+import { isPlatformBrowser } from "@angular/common";
+import { inject, Injectable, isDevMode, PLATFORM_ID } from "@angular/core";
+import { Router } from "@angular/router";
+
+@Injectable({ providedIn: "root" })
+export class UrlTagCaptureService {
+  private readonly platformIdentifier = inject(PLATFORM_ID);
+  private readonly router = inject(Router);
+
+  public captureAndClearTag(): void {
+    if (!isPlatformBrowser(this.platformIdentifier)) {
+      return;
+    }
+
+    const searchParameters = new URLSearchParams(window.location.search);
+    const tag = searchParameters.get("t");
+    if (tag === null || tag.length === 0) {
+      return;
+    }
+
+    if (!isDevMode()) {
+      import("posthog-js")
+        .then(({ default: posthog }) => posthog.capture("url_tag_detected", { tag }))
+        .catch((reason: unknown) => console.error(reason));
+    }
+
+    this.router.navigate([], {
+      queryParams: { t: null },
+      queryParamsHandling: "merge",
+      replaceUrl: true,
+    });
+  }
+}