From 0c464a99632519ae5c2e96a862ad10012c51867d Mon Sep 17 00:00:00 2001
From: Eli Ribble <eli@gleipnir.technology>
Date: Wed, 29 Apr 2026 23:59:34 +0000
Subject: [PATCH] Get working sentry for the UI

Previously it almost, but didn't quite work. Now it actually works, but
the stack traces are minified.
---
 ts/AppSync.vue     | 13 -------------
 ts/sentry.ts       | 22 ++++++++++++++++++++++
 ts/type/api.ts     |  7 ++++++-
 version/version.go |  6 +++---
 vite/rmo/main.ts   |  3 +++
 vite/sync/main.ts  |  4 +++-
 6 files changed, 37 insertions(+), 18 deletions(-)
 create mode 100644 ts/sentry.ts

diff --git a/ts/AppSync.vue b/ts/AppSync.vue
index 43983aea..f6833fa5 100644
--- a/ts/AppSync.vue
+++ b/ts/AppSync.vue
@@ -3,24 +3,12 @@
 </template>
 
 <script setup lang="ts">
-import * as Sentry from "@sentry/vue";
 import { onMounted } from "vue";
 import { apiClient } from "@/client";
 import router from "@/route/config";
 
 import { SSEManager, type SSEMessageResource } from "@/SSEManager";
 
-async function sentryInit() {
-	const config = await apiClient.JSONGet("/api");
-	Sentry.init({
-		dsn: config.DSN,
-		integrations: [Sentry.browserTracingIntegration({ router })],
-		environment: config.ENVIRONMENT,
-		release: config.RELEASE,
-		tracesSampleRate: 0.01,
-	});
-	console.log("sentry initialized");
-}
 onMounted(() => {
 	SSEManager.connect("/api/events");
 	SSEManager.subscribe((msg: SSEMessageResource) => {
@@ -28,6 +16,5 @@ onMounted(() => {
 			console.log("SSE", msg);
 		}
 	});
-	sentryInit();
 });
 </script>
diff --git a/ts/sentry.ts b/ts/sentry.ts
new file mode 100644
index 00000000..13575716
--- /dev/null
+++ b/ts/sentry.ts
@@ -0,0 +1,22 @@
+import { type App } from "vue";
+import { type Pinia } from "pinia";
+import { type Router } from "vue-router";
+import * as Sentry from "@sentry/vue";
+import { apiClient } from "@/client";
+import { APIProperties } from "@/type/api";
+
+export async function Init(app: App, pinia: Pinia) {
+	const api_info: APIProperties = await apiClient.JSONGet("/api");
+	Sentry.init({
+		app,
+		dsn: api_info.sentry_dsn,
+		//integrations: [Sentry.browserTracingIntegration({ router })],
+		environment: api_info.environment,
+		release:
+			api_info.version.revision +
+			(api_info.version.is_modified ? "-dirty" : ""),
+		tracesSampleRate: 0.01,
+	});
+	pinia.use(Sentry.createSentryPiniaPlugin());
+	console.log("sentry initialized", api_info.sentry_dsn, api_info.environment);
+}
diff --git a/ts/type/api.ts b/ts/type/api.ts
index 06998506..89f16ae3 100644
--- a/ts/type/api.ts
+++ b/ts/type/api.ts
@@ -35,11 +35,16 @@ export interface TegolaURLs {
 	nidus: string;
 	rmo: string;
 }
+export interface Version {
+	build_time: string;
+	is_modified: boolean;
+	revision: string;
+}
 export interface APIProperties {
 	environment: string;
 	sentry_dsn: string;
 	tegola: TegolaURLs;
-	version: string;
+	version: Version;
 }
 export interface BoundsDTO {
 	min: Location;
diff --git a/version/version.go b/version/version.go
index e86e1a96..e7091081 100644
--- a/version/version.go
+++ b/version/version.go
@@ -6,9 +6,9 @@ import (
 )
 
 type VersionInfo struct {
-	BuildTime  time.Time
-	IsModified bool
-	Revision   string
+	BuildTime  time.Time `json:"build_time"`
+	IsModified bool      `json:"is_modified"`
+	Revision   string    `json:"revision"`
 }
 
 func Get() VersionInfo {
diff --git a/vite/rmo/main.ts b/vite/rmo/main.ts
index 8228e536..99bd52a3 100644
--- a/vite/rmo/main.ts
+++ b/vite/rmo/main.ts
@@ -6,6 +6,7 @@ import "@/gen/custom-icons.scss";
 import "@/style/rmo.scss";
 import router from "@/rmo/route/config";
 import App from "@/rmo/App.vue";
+import * as sentry from "@/sentry";
 
 const app = createApp(App);
 const head = createHead();
@@ -15,3 +16,5 @@ app.use(head);
 app.use(pinia);
 app.use(router);
 app.mount("#app");
+
+sentry.Init(app, pinia);
diff --git a/vite/sync/main.ts b/vite/sync/main.ts
index 69834dea..f15e1ebf 100644
--- a/vite/sync/main.ts
+++ b/vite/sync/main.ts
@@ -1,8 +1,9 @@
 import { createApp } from "vue";
 import { createPinia } from "pinia";
 import App from "@/AppSync.vue";
-import router from "@/route/config";
 import * as config from "@/config";
+import router from "@/route/config";
+import * as sentry from "@/sentry";
 
 import "maplibre-gl/dist/maplibre-gl.css";
 
@@ -22,3 +23,4 @@ const app = createApp(App);
 app.use(pinia);
 app.use(router);
 app.mount("#app");
+sentry.Init(app, pinia);