Move telemetry into sync-client

frontend/sync-client/package.json

@@ -28,6 +28,8 @@
         "webpack": "^5.99.9",
         "webpack-cli": "^6.0.1",
         "webpack-merge": "^6.0.1",
+        "@plausible-analytics/tracker": "^0.4.3",
+        "@sentry/browser": "^10.8.0",
         "ws": "^8.18.3"
     }
 }

frontend/sync-client/src/persistence/settings.ts

@@ -10,6 +10,7 @@ export interface SyncSettings {
 	ignorePatterns: string[];
 	webSocketRetryIntervalMs: number;
 	diffCacheSizeMB: number;
+	enableTelemetry: boolean;
 }
 
 export const DEFAULT_SETTINGS: SyncSettings = {
@@ -21,7 +22,8 @@ export const DEFAULT_SETTINGS: SyncSettings = {
 	maxFileSizeMB: 10,
 	ignorePatterns: [],
 	webSocketRetryIntervalMs: 3500,
-	diffCacheSizeMB: 4
+	diffCacheSizeMB: 4,
+	enableTelemetry: false
 };
 
 export class Settings {

frontend/sync-client/src/sync-client.ts

@@ -22,11 +22,13 @@ import type { CursorSpan } from "./services/types/CursorSpan";
 import type { MaybeOutdatedClientCursors } from "./types/maybe-outdated-client-cursors";
 import { FileChangeNotifier } from "./sync-operations/file-change-notifier";
 import { FixedSizeDocumentCache } from "./utils/fix-sized-cache";
+import { setUpTelemetry } from "./utils/set-up-telemetry";
 
 export class SyncClient {
 	private static readonly MINIMUM_SAVE_INTERVAL_MS = 1000;
 	private hasStartedOfflineSync = false;
 	private hasFinishedOfflineSync = false;
+	private unloadTelemetry?: () => void;
 
 	private constructor(
 		private readonly history: SyncHistory,
@@ -41,6 +43,10 @@ export class SyncClient {
 		private readonly fileChangeNotifier: FileChangeNotifier,
 		private readonly contentCache: FixedSizeDocumentCache
 	) {
+		if (settings.getSettings().enableTelemetry) {
+			this.unloadTelemetry = setUpTelemetry();
+		}
+
 		this.settings.addOnSettingsChangeListener(
 			async (newSettings, oldSettings) => {
 				if (newSettings.vaultName !== oldSettings.vaultName) {
@@ -62,6 +68,16 @@ export class SyncClient {
 						newSettings.diffCacheSizeMB * 1024 * 1024
 					);
 				}
+
+				if (
+					newSettings.enableTelemetry !== oldSettings.enableTelemetry
+				) {
+					if (newSettings.enableTelemetry) {
+						this.unloadTelemetry = setUpTelemetry();
+					} else {
+						this.unloadTelemetry?.();
+					}
+				}
 			}
 		);
 	}

frontend/sync-client/src/utils/set-up-telemetry.ts

@@ -0,0 +1,41 @@
+import * as Sentry from "@sentry/browser";
+import { init as plausibleInit } from "@plausible-analytics/tracker";
+
+export const setUpTelemetry = (): (() => void) => {
+	plausibleInit({
+		domain: "vault-link",
+		endpoint: "https://stats.schmelczer.dev/status",
+		autoCapturePageviews: true,
+		captureOnLocalhost: true,
+		logging: true
+	});
+
+	Sentry.init({
+		dsn: "https://56accd39d92442e788a457a04623cf57@bugs.schmelczer.dev/1",
+		skipBrowserExtensionCheck: false
+	});
+
+	const onError = (event: ErrorEvent): void => {
+		Sentry.captureException(event.error, {
+			extra: {
+				message: event.message,
+				filename: event.filename,
+				lineno: event.lineno,
+				colno: event.colno
+			}
+		});
+	};
+	window.addEventListener("error", onError);
+
+	const onUnhandledRejection = (event: PromiseRejectionEvent): void => {
+		Sentry.captureException(event.reason);
+	};
+	window.addEventListener("unhandledrejection", onUnhandledRejection);
+
+	return (): void => {
+		window.removeEventListener("error", onError);
+		window.removeEventListener("unhandledrejection", onUnhandledRejection);
+		Sentry.close(5000);
+		// unloading plausible requires reloading
+	};
+};