Add Sentry by default for error tracking

package.json

@@ -86,7 +86,6 @@
     "tslib": "^2.6.2",
     "typescript": "4.9.5",
     "vite": "3.2.7",
-    "vite-plugin-conditional-compiler": "^0.2.1",
     "ws": "8.13.0"
   },
   "lint-staged": {

src/pages/background/index.ts

@@ -1,30 +1,25 @@
 import { ResponseStatus } from '@root/src/pages/popup/Popup';
 import { ErrorCode } from '@root/src/shared/constants/error';
 import { Action } from '@root/src/shared/hooks/useMessage';
+import {
+  fetchDailyBalancesForAllAccounts,
+  formatBalancesAsCSV,
+} from '@root/src/shared/lib/accounts';
+import { throttle } from '@root/src/shared/lib/events';
 import stateStorage from '@root/src/shared/storages/stateStorage';
 import {
   concatenateCSVPages,
   fetchAllDownloadTransactionPages,
   fetchTransactionsTotalCount,
 } from '@src/shared/lib/transactions';
 import apiKeyStorage from '@src/shared/storages/apiKeyStorage';
-import reloadOnUpdate from 'virtual:reload-on-update-in-background-script';
-import {
-  fetchDailyBalancesForAllAccounts,
-  formatBalancesAsCSV,
-} from '@root/src/shared/lib/accounts';
 import JSZip from 'jszip';
+import reloadOnUpdate from 'virtual:reload-on-update-in-background-script';
 import 'webextension-polyfill';
-import { throttle } from '@root/src/shared/lib/events';
-
-// #v-ifdef VITE_SENTRY_DSN
-// We don't want to track any user data, so we only initialize Sentry in development
-// (it's where we have VITE_SENTRY_DSN defined)
 
 import * as Sentry from '@sentry/browser';
 
-// https://github.com/getsentry/sentry-javascript/issues/5289#issuecomment-1368705821
-// @ts-ignore - Just for local development
+// @ts-ignore - https://github.com/getsentry/sentry-javascript/issues/5289#issuecomment-1368705821
 Sentry.WINDOW.document = {
   visibilityState: 'hidden',
   addEventListener: () => {},
@@ -38,8 +33,14 @@ Sentry.init({
   integrations: [new Sentry.BrowserTracing()],
   tracesSampleRate: 1.0,
   ignoreErrors: [/ResizeObserver/, 'ResizeObserver loop limit exceeded', 'Network request failed'],
+  beforeSend(event) {
+    if (event.user) {
+      // Do not send any user data to Sentry
+      delete event.user;
+    }
+    return event;
+  },
 });
-// #v-endif
 
 reloadOnUpdate('pages/background');
 
@@ -60,14 +61,12 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
     return true;
   }
 
-  // #v-ifdef VITE_SENTRY_DSN
   const transaction = Sentry.startTransaction({
     name: message.action,
     op: 'background',
   });
 
   Sentry.configureScope((scope) => scope.setSpan(transaction));
-  // #v-endif
 
   console.log(`Received message with action: ${message.action}`);
 
@@ -83,9 +82,7 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
     throw new Error('Debug error');
   }
 
-  // #v-ifdef VITE_SENTRY_DSN
   transaction.finish();
-  // #v-endif
 
   return true; // indicates we will send a response asynchronously
 });

src/pages/popup/Popup.tsx

@@ -1,29 +1,32 @@
-import { useEffect, useState, useMemo } from 'react';
-import apiKeyStorage from '@src/shared/storages/apiKeyStorage';
-import withSuspense from '@src/shared/hoc/withSuspense';
-import withErrorBoundary from '@src/shared/hoc/withErrorBoundary';
-import { Action, useMessageSender } from '@src/shared/hooks/useMessage';
-import { getUserData } from '@src/shared/lib/auth';
-import { ErrorCode } from '@src/shared/constants/error';
-import PopupContainer from '@src/components/popup/PopupContainer';
+import ErrorBoundary from '@root/src/components/ErrorBoundary';
+import Text from '@root/src/components/Text';
 import DefaultButton from '@root/src/components/button/DefaultButton';
 import PopupContext from '@root/src/pages/popup/context';
-import Text from '@root/src/components/Text';
 import stateStorage from '@root/src/shared/storages/stateStorage';
-import ErrorBoundary from '@root/src/components/ErrorBoundary';
+import PopupContainer from '@src/components/popup/PopupContainer';
+import { ErrorCode } from '@src/shared/constants/error';
+import withErrorBoundary from '@src/shared/hoc/withErrorBoundary';
+import withSuspense from '@src/shared/hoc/withSuspense';
+import { Action, useMessageSender } from '@src/shared/hooks/useMessage';
+import { getUserData } from '@src/shared/lib/auth';
+import apiKeyStorage from '@src/shared/storages/apiKeyStorage';
+import { useEffect, useMemo, useState } from 'react';
 
-// #v-ifdef VITE_SENTRY_DSN
-// We don't want to track any user data, so we only initialize Sentry in development
-// (it's where we have VITE_SENTRY_DSN defined)
 import * as Sentry from '@sentry/react';
 
 Sentry.init({
   dsn: import.meta.env.VITE_SENTRY_DSN,
   environment: import.meta.env.MODE,
   release: import.meta.env.VITE_COMMIT_SHA,
   tracesSampleRate: 1.0,
+  beforeSend(event) {
+    if (event.user) {
+      // Do not send any user data to Sentry
+      delete event.user;
+    }
+    return event;
+  },
 });
-// #v-endif
 
 export enum ResponseStatus {
   RequireAuth = 'require_auth',

vite.config.ts

@@ -7,7 +7,6 @@ import customDynamicImport from './utils/plugins/custom-dynamic-import';
 import addHmr from './utils/plugins/add-hmr';
 import watchRebuild from './utils/plugins/watch-rebuild';
 import manifest from './manifest';
-import ConditionalCompile from 'vite-plugin-conditional-compiler';
 
 const rootDir = resolve(__dirname);
 const srcDir = resolve(rootDir, 'src');
@@ -32,7 +31,6 @@ export default defineConfig({
     },
   },
   plugins: [
-    ConditionalCompile(),
     react(),
     makeManifest(manifest, {
       isDev,
@@ -41,8 +39,7 @@ export default defineConfig({
     customDynamicImport(),
     addHmr({ background: enableHmrInBackgroundScript, view: true }),
     watchRebuild(),
-    isProduction &&
-      process.env.SENTRY_DSN &&
+    process.env.SENTRY_DSN &&
       sentryVitePlugin({
         org: 'monarch',
         project: 'mint-data-exporter',