lazyload sentry preventing unauthorized connections

src/app.js

@@ -15,11 +15,12 @@ import {
     initRouter,
     initSentry
 } from './plugin';
-import { pinia } from './stores';
+import { initPiniaPlugins, pinia } from './stores';
 
 import App from './App.vue';
 
 await initPlugins();
+await initPiniaPlugins();
 
 // #region | Hey look it's most of VRCX!
 

src/components/NavMenu.vue

@@ -215,8 +215,6 @@
     import { THEME_CONFIG } from '../shared/constants';
     import { openExternalLink } from '../shared/utils';
 
-    import * as Sentry from '@sentry/vue';
-
     const { t } = useI18n();
     const router = useRouter();
 
@@ -457,8 +455,10 @@
     onMounted(() => {
         if (!sentryErrorReporting.value) return;
         try {
+            import('@sentry/vue').then((Sentry) => {
                 const feedback = Sentry.getFeedback();
                 feedback?.attachTo(document.getElementById('feedback'));
+            });
             window.addEventListener('keydown', handleKeydown);
         } catch (error) {
             console.error('Error setting up Sentry feedback:', error);

src/plugin/sentry.js

@@ -2,17 +2,24 @@ import { router } from './router';
 
 import configRepository from '../service/config';
 
-import * as Sentry from '@sentry/vue';
+let version = '';
 
-export async function initSentry(app) {
+export async function isSentryEnabled() {
-    try {
     const enabled = await configRepository.getString(
         'VRCX_SentryEnabled',
         'false'
     );
-        const version = await AppApi.GetVersion();
+    version = await AppApi.GetVersion();
     const isNightly = version.includes('Nightly');
     if (enabled !== 'true' || !isNightly) {
+        return false;
+    }
+    return true;
+}
+
+export async function initSentry(app) {
+    try {
+        if (!(await isSentryEnabled())) {
             return;
         }
         const vrcxId = await configRepository.getString('VRCX_id', '');
@@ -33,6 +40,7 @@ export async function initSentry(app) {
             return;
         }
         const dsn = atob(response.data);
+        const Sentry = await import('@sentry/vue');
         Sentry.init({
             app,
             dsn,

src/stores/index.js

@@ -1,6 +1,7 @@
 import { createPinia } from 'pinia';
 import { createSentryPiniaPlugin } from '@sentry/vue';
 
+import { isSentryEnabled } from '../plugin';
 import { useAdvancedSettingsStore } from './settings/advanced';
 import { useAppearanceSettingsStore } from './settings/appearance';
 import { useAuthStore } from './auth';
@@ -37,8 +38,14 @@ import { useWristOverlaySettingsStore } from './settings/wristOverlay';
 
 export const pinia = createPinia();
 
+async function registerSentryPiniaPlugin() {
+    if (!(await isSentryEnabled())) {
+        return;
+    }
+
+    const Sentry = await import('@sentry/vue');
     pinia.use(
-    createSentryPiniaPlugin({
+        Sentry.createSentryPiniaPlugin({
             stateTransformer: (state) => ({
                 ...state,
                 Auth: null,
@@ -105,6 +112,11 @@ pinia.use(
             })
         })
     );
+}
+
+export async function initPiniaPlugins() {
+    await registerSentryPiniaPlugin();
+}
 
 export function createGlobalStores() {
     return {