Gleipnir/nidus-sync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add sentry integration with Vue frontend

Browse source
This commit is contained in:
Eli Ribble 2026-04-21 23:35:59 +00:00
parent baaa3bff5b
commit 2b30411c1b
No known key found for this signature in database
5 changed files with 104 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -5,6 +5,7 @@
"type": "module",
"dependencies": {
"@popperjs/core": "^2.11.8",
"@sentry/vue": "^10.49.0",
"@vueuse/core": "^14.2.1",
"@vueuse/head": "^2.0.0",
"axios": "^1.13.6",

76
pnpm-lock.yaml generated
View file

@ -11,6 +11,9 @@ importers:
'@popperjs/core':
specifier: ^2.11.8
version: 2.11.8
'@sentry/vue':
specifier: ^10.49.0
version: 10.49.0(pinia@3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3)))(vue@3.5.30(typescript@5.9.3))
'@vueuse/core':
specifier: ^14.2.1
version: 14.2.1(vue@3.5.30(typescript@5.9.3))
@ -335,6 +338,43 @@ packages:
'@rolldown/pluginutils@1.0.0-rc.2':
resolution: {integrity: sha512-izyXV/v+cHiRfozX62W9htOAvwMo4/bXKDrQ+vom1L1qRuexPock/7VZDAhnpHCLNejd3NJ6hiab+tO0D44Rgw==}
'@sentry-internal/browser-utils@10.49.0':
resolution: {integrity: sha512-n0QRx0Ysx6mPfIydTkz7VP0FmwM+/EqMZiRqdsU3aTYsngE9GmEDV0OL1bAy6a8N/C1xf9vntkuAtj6N/8Z51w==}
engines: {node: '>=18'}
'@sentry-internal/feedback@10.49.0':
resolution: {integrity: sha512-JNsUBGv0faCFE7MeZUH99Y9lU9qq3LBALbLxpE1x7ngNrQnVYRlcFgdqaD/btNBKr8awjYL8gmcSkHBWskGqLQ==}
engines: {node: '>=18'}
'@sentry-internal/replay-canvas@10.49.0':
resolution: {integrity: sha512-7D/NrgH1Qwx5trDYaaTSSJmCb1yVQQLqFG4G/S9x2ltzl9876lSGJL8UeW8ReNQgF3CDAcwbmm/9aXaVSBUNZA==}
engines: {node: '>=18'}
'@sentry-internal/replay@10.49.0':
resolution: {integrity: sha512-IEy4lwHVMiRE3JAcn+kFKjsTgalDOCSTf20SoFd+nkt6rN/k1RDyr4xpdfF//Kj3UdeTmbuibYjK5H/FLhhnGg==}
engines: {node: '>=18'}
'@sentry/browser@10.49.0':
resolution: {integrity: sha512-bGCHc+wK2Dx67YoSbmtlt04alqWfQ+dasD/GVipVOq50gvw/BBIDHTEWRJEjACl+LrvszeY54V+24p8z4IgysA==}
engines: {node: '>=18'}
'@sentry/core@10.49.0':
resolution: {integrity: sha512-UaFeum3LUM1mB0d67jvKnqId1yWQjyqmaDV6kWngG03x+jqXb08tJdGpSoxjXZe13jFBbiBL/wKDDYIK7rCK4g==}
engines: {node: '>=18'}
'@sentry/vue@10.49.0':
resolution: {integrity: sha512-xxJ3Phh1Rgb3iIrWBJC4qepUVZL2XH+2eCpXWBAd8tvGSIWGSdP8RpwIj22pKsgDO/m8e1eoD43KwVWUX3AH5g==}
engines: {node: '>=18'}
peerDependencies:
'@tanstack/vue-router': ^1.64.0
pinia: 2.x || 3.x
vue: 2.x || 3.x
peerDependenciesMeta:
'@tanstack/vue-router':
optional: true
pinia:
optional: true
'@tybys/wasm-util@0.10.1':
resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==}
@ -1282,6 +1322,42 @@ snapshots:
'@rolldown/pluginutils@1.0.0-rc.2': {}
'@sentry-internal/browser-utils@10.49.0':
dependencies:
'@sentry/core': 10.49.0
'@sentry-internal/feedback@10.49.0':
dependencies:
'@sentry/core': 10.49.0
'@sentry-internal/replay-canvas@10.49.0':
dependencies:
'@sentry-internal/replay': 10.49.0
'@sentry/core': 10.49.0
'@sentry-internal/replay@10.49.0':
dependencies:
'@sentry-internal/browser-utils': 10.49.0
'@sentry/core': 10.49.0
'@sentry/browser@10.49.0':
dependencies:
'@sentry-internal/browser-utils': 10.49.0
'@sentry-internal/feedback': 10.49.0
'@sentry-internal/replay': 10.49.0
'@sentry-internal/replay-canvas': 10.49.0
'@sentry/core': 10.49.0
'@sentry/core@10.49.0': {}
'@sentry/vue@10.49.0(pinia@3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3)))(vue@3.5.30(typescript@5.9.3))':
dependencies:
'@sentry/browser': 10.49.0
'@sentry/core': 10.49.0
vue: 3.5.30(typescript@5.9.3)
optionalDependencies:
pinia: 3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3))
'@tybys/wasm-util@0.10.1':
dependencies:
tslib: 2.8.1

14
ts/AppSync.vue
View file

@ -2,4 +2,16 @@
<router-view />
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import { onMounted } from "vue";
import { SSEManager, type SSEMessage } from "@/SSEManager";
onMounted(() => {
SSEManager.connect("/api/events");
SSEManager.subscribe((msg: SSEMessage) => {
if (msg.type != "heartbeat") {
console.log("SSE", msg);
}
});
});
</script>

3
ts/config.ts Normal file
View file

@ -0,0 +1,3 @@
export const DSN = "https://abc123@glitchtip.gleipnir.technology";
export const ENVIRONMNT = "prod";
export const RELEASE = "dev";

21
vite/sync/main.ts
View file

@ -2,7 +2,9 @@ import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "@/AppSync.vue";
import router from "@/router";
import { SSEManager, type SSEMessage } from "@/SSEManager";
import * as Sentry from "@sentry/vue";
import * as config from "@/config";
import "maplibre-gl/dist/maplibre-gl.css";
// Import Bootstrap Icons CSS
@ -16,17 +18,16 @@ import "@/gen/custom-icons.scss";
import * as bootstrap from "bootstrap";
window.bootstrap = bootstrap;
document.addEventListener("DOMContentLoaded", () => {
SSEManager.connect("/api/events");
SSEManager.subscribe((msg: SSEMessage) => {
if (msg.type != "heartbeat") {
console.log("SSE", msg);
}
});
});
const pinia = createPinia();
const app = createApp(App);
app.use(pinia);
app.use(router);
app.mount("#app");
Sentry.init({
dsn: config.DSN,
integrations: [Sentry.browserTracingIntegration({ router })],
environment: config.ENVIRONMENT,
release: config.RELEASE,
tracesSampleRate: 0.01,
});