feat(vesting): add sentry

apps/vesting/src/main.tsx

@@ -1,17 +1,35 @@
 import { StrictMode } from 'react';
+import * as Sentry from '@sentry/react';
 import { createRoot } from 'react-dom/client';
 import { App } from './app/app';
 import { AppProviders } from './providers/app-providers';
 
+Sentry.init({
+  dsn: process.env.SENTRY_DSN,
+  integrations: [
+    Sentry.browserTracingIntegration(),
+    Sentry.replayIntegration(),
+  ],
+  // Tracing
+  tracesSampleRate: 1.0, //  Capture 100% of the transactions
+  // Session Replay
+  replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
+  replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
+});
+
 function startApp() {
   const rootElement = document.getElementById('root');
   const root = createRoot(rootElement as HTMLElement);
 
   root.render(
     <StrictMode>
-      <AppProviders>
-        <App />
-      </AppProviders>
+      <Sentry.ErrorBoundary
+        fallback={<div>Something went wrong. Please try again later.</div>}
+      >
+        <AppProviders>
+          <App />
+        </AppProviders>
+      </Sentry.ErrorBoundary>
     </StrictMode>,
   );
 }

apps/vesting/vite.config.ts

@@ -1,5 +1,6 @@
 /// <reference types='vitest' />
 import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { sentryVitePlugin } from '@sentry/vite-plugin';
 import react from '@vitejs/plugin-react-swc';
 import { defineConfig } from 'vite';
 import { nodePolyfills } from 'vite-plugin-node-polyfills';
@@ -27,6 +28,10 @@ export default defineConfig({
         global: true,
       },
     }),
+    sentryVitePlugin({
+      org: 'haqq-network',
+      project: 'vesting-app',
+    }),
   ],
 
   // Uncomment this if you are using workers.
@@ -38,9 +43,12 @@ export default defineConfig({
     outDir: '../../dist/apps/vesting',
     emptyOutDir: true,
     reportCompressedSize: true,
+
     commonjsOptions: {
       transformMixedEsModules: true,
     },
+
+    sourcemap: true,
   },
 
   define: {
@@ -59,5 +67,6 @@ export default defineConfig({
     'process.env.POSTHOG_HOST': JSON.stringify(
       process.env['NEXT_PUBLIC_POSTHOG_HOST'],
     ),
+    'process.env.SENTRY_DSN': JSON.stringify(process.env['SENTRY_DSN']),
   },
 });

package.json

@@ -29,7 +29,9 @@
     "@headlessui/react": "2.1.3",
     "@react-spring/web": "9.7.4",
     "@sentry/nextjs": "8.26.0",
-    "@t3-oss/env-nextjs": "0.11.0",
+    "@sentry/react": "8.26.0",
+    "@sentry/vite-plugin": "2.22.2",
+    "@t3-oss/env-nextjs": "0.11.1",
     "@tanstack/react-query": "5.52.1",
     "@tanstack/react-query-devtools": "5.52.1",
     "@vercel/speed-insights": "1.0.12",
@@ -59,7 +61,7 @@
     "store2": "2.14.3",
     "swiper": "11.1.10",
     "text-mask-addons": "3.8.0",
-    "tslib": "2.6.3",
+    "tslib": "2.7.0",
     "usehooks-ts": "3.1.0",
     "vanilla-cookieconsent": "2.9.2",
     "viem": "2.20.0",
@@ -93,7 +95,7 @@
     "@storybook/theming": "8.2.9",
     "@swc-node/register": "1.10.9",
     "@swc/cli": "0.4.0",
-    "@swc/core": "1.7.14",
+    "@swc/core": "1.7.18",
     "@swc/helpers": "0.5.12",
     "@swc/jest": "0.2.36",
     "@tailwindcss/typography": "0.5.14",
@@ -143,7 +145,7 @@
     "ts-jest": "29.2.5",
     "ts-node": "10.9.2",
     "typescript": "5.5.4",
-    "vercel": "37.1.0",
+    "vercel": "37.1.1",
     "vite": "5.4.2",
     "vite-plugin-node-polyfills": "0.22.0",
     "vitest": "2.0.5"