feat: Added sentry

apps/api/package.json

@@ -33,6 +33,7 @@
     "@nestjs/swagger": "^6.1.2",
     "@nestjs/terminus": "^9.1.3",
     "@nestjs/websockets": "9.4.3",
+    "@sentry/node": "^7.112.2",
     "ajv": "^8.12.0",
     "ajv-formats": "^2.1.1",
     "ajv-keywords": "^5.1.0",

apps/api/src/.env.development

@@ -15,6 +15,9 @@ S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
 
+# Analytics
+SENTRY_DSN=
+
 # URLs
 WIDGET_BASE_URL=http://localhost:3500
 WEB_BASE_URL=http://localhost:4200

apps/api/src/.env.production

@@ -15,6 +15,9 @@ S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
 
+# Analytics
+SENTRY_DSN=
+
 # URLs
 WIDGET_BASE_URL=http://localhost:3500
 WEB_BASE_URL=http://localhost:4200

apps/api/src/.env.test

@@ -15,6 +15,9 @@ S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
 
+# Analytics
+SENTRY_DSN=
+
 # URLs
 WIDGET_BASE_URL=http://localhost:3500
 WEB_BASE_URL=http://localhost:4200

apps/api/src/.example.env

@@ -8,6 +8,9 @@ RABBITMQ_CONN_URL=amqp://guest:guest@localhost:5672
 # Database
 MONGO_URL=mongodb://localhost:27017/impler-db
 
+# Analytics
+SENTRY_DSN=
+
 # Storage
 S3_LOCAL_STACK=http://localhost:4566
 S3_REGION=us-east-1

apps/api/src/app/shared/filters/exception.filter.ts

@@ -0,0 +1,15 @@
+import { Catch, ArgumentsHost, HttpServer } from '@nestjs/common';
+import { AbstractHttpAdapter, BaseExceptionFilter } from '@nestjs/core';
+import * as Sentry from '@sentry/node';
+
+Catch();
+export class SentryFilter extends BaseExceptionFilter {
+  handleUnknownError(
+    exception: any,
+    host: ArgumentsHost,
+    applicationRef: HttpServer<any, any> | AbstractHttpAdapter<any, any, any>
+  ): void {
+    Sentry.captureException(exception);
+    super.handleUnknownError(exception, host, applicationRef);
+  }
+}

apps/api/src/bootstrap.ts

@@ -1,9 +1,11 @@
 import './config';
 
-import * as compression from 'compression';
-import { NestFactory } from '@nestjs/core';
+import * as Sentry from '@sentry/node';
 import * as bodyParser from 'body-parser';
+import * as compression from 'compression';
+import { HttpAdapterHost, NestFactory } from '@nestjs/core';
 import * as cookieParser from 'cookie-parser';
+import { SentryFilter } from './app/shared/filters/exception.filter';
 import { ExpressAdapter } from '@nestjs/platform-express';
 import { SwaggerModule, DocumentBuilder } from '@nestjs/swagger';
 import { INestApplication, ValidationPipe, Logger } from '@nestjs/common';
@@ -30,9 +32,7 @@ export async function bootstrap(expressApp?): Promise<INestApplication> {
   }
 
   app.enableCors(corsOptionsDelegate);
-
   app.setGlobalPrefix('v1');
-
   app.useGlobalPipes(
     new ValidationPipe({
       transform: true,
@@ -65,6 +65,17 @@ export async function bootstrap(expressApp?): Promise<INestApplication> {
 
   SwaggerModule.setup('api', app, document);
 
+  if (process.env.SENTRY_DSN) {
+    Sentry.init({
+      tracesSampleRate: 1.0,
+      dsn: process.env.SENTRY_DSN,
+      integrations: [new Sentry.Integrations.Console({ tracing: true })],
+    });
+
+    const { httpAdapter } = app.get(HttpAdapterHost);
+    app.useGlobalFilters(new SentryFilter(httpAdapter));
+  }
+
   if (expressApp) {
     await app.init();
   } else {

apps/api/src/types/env.d.ts

@@ -4,6 +4,7 @@ declare namespace NodeJS {
     PORT: number;
     JWT_SECRET: string;
     NODE_ENV: 'test' | 'prod' | 'dev' | 'ci' | 'local';
+    SENTRY_DSN: string;
 
     MONGO_URL: string;
     RABBITMQ_CONN_URL: string;

apps/queue-manager/package.json

@@ -18,6 +18,7 @@
   "dependencies": {
     "@impler/dal": "^0.18.1",
     "@impler/shared": "^0.18.1",
+    "@sentry/node": "^7.112.2",
     "axios": "1.6.2",
     "dotenv": "^16.0.2",
     "envalid": "^7.3.1"

apps/queue-manager/src/.env.development

@@ -8,3 +8,6 @@ S3_LOCAL_STACK=http://localhost:4566
 S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
+
+# Analytics
+SENTRY_DSN=

apps/queue-manager/src/.env.production

@@ -8,3 +8,6 @@ S3_LOCAL_STACK=http://localhost:4566
 S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
+
+# Analytics
+SENTRY_DSN=

apps/queue-manager/src/.env.test

@@ -8,3 +8,6 @@ S3_LOCAL_STACK=http://localhost:4566
 S3_BUCKET_NAME=impler
 AWS_ACCESS_KEY_ID=
 AWS_SECRET_ACCESS_KEY=
+
+# Analytics
+SENTRY_DSN=

apps/queue-manager/src/.example.env

@@ -6,3 +6,6 @@ MONGO_URL=mongodb://localhost:27017/impler-db
 S3_REGION=us-east-1
 S3_LOCAL_STACK=http://localhost:4566
 S3_BUCKET_NAME=impler
+
+# Analytics
+SENTRY_DSN=

apps/queue-manager/src/bootstrap.ts

@@ -1,4 +1,5 @@
 import './config/env-config';
+import * as Sentry from '@sentry/node';
 import { validateEnv } from './config/env-validator';
 import amqp, { ChannelWrapper } from 'amqp-connection-manager';
 import { IAmqpConnectionManager } from 'amqp-connection-manager/dist/esm/AmqpConnectionManager';
@@ -11,6 +12,14 @@ let connection: IAmqpConnectionManager, chanelWrapper: ChannelWrapper;
 
 validateEnv();
 
+if (process.env.SENTRY_DSN) {
+  Sentry.init({
+    dsn: process.env.SENTRY_DSN,
+    integrations: [new Sentry.Integrations.Console({ tracing: true })],
+    tracesSampleRate: 1.0,
+  });
+}
+
 export async function bootstrap() {
   // conenct dal service
   const dalService = new DalService();

apps/queue-manager/src/types/env.d.ts

@@ -6,5 +6,6 @@ declare namespace NodeJS {
     S3_LOCAL_STACK: string;
     S3_REGION: string;
     S3_BUCKET_NAME: string;
+    SENTRY_DSN: string;
   }
 }

apps/web/.example.env

@@ -3,4 +3,5 @@ NEXT_PUBLIC_EMBED_URL=http://localhost:4701/embed.umd.min.js
 NEXT_PUBLIC_AMPLITUDE_ID=
 NEXT_PUBLIC_TAWK_PROPERTY_ID=
 NEXT_PUBLIC_TAWK_WIDGET_ID=
-NEXT_PUBLIC_OPENREPLAY_KEY=
+NEXT_PUBLIC_OPENREPLAY_KEY=
+NEXT_PUBLIC_SENTRY_DSN=

apps/web/next.config.js

@@ -1,7 +1,10 @@
 /** @type {import('next').NextConfig} */
+const { withSentryConfig } = require('@sentry/nextjs');
+
 const nextConfig = {
   reactStrictMode: true,
   publicRuntimeConfig: {
+    NEXT_PUBLIC_SENTRY_DSN: process.env.NEXT_PUBLIC_SENTRY_DSN,
     NEXT_PUBLIC_API_BASE_URL: process.env.NEXT_PUBLIC_API_BASE_URL,
     NEXT_PUBLIC_EMBED_URL: process.env.NEXT_PUBLIC_EMBED_URL,
     NEXT_PUBLIC_AMPLITUDE_ID: process.env.NEXT_PUBLIC_AMPLITUDE_ID,
@@ -12,6 +15,9 @@ const nextConfig = {
     NEXT_PUBLIC_GOOGLE_ANALYTICS_ID: process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS_ID,
     NEXT_PUBLIC_ONBOARDING_TOKEN: process.env.NEXT_PUBLIC_ONBOARDING_TOKEN,
   },
+  sentry: {
+    hideSourceMaps: true,
+  },
 };
 
-module.exports = nextConfig;
+module.exports = withSentryConfig(nextConfig);

apps/web/package.json

@@ -30,6 +30,7 @@
     "@mantine/notifications": "6.0.21",
     "@mantine/prism": "6.0.21",
     "@openreplay/tracker": "^9.0.9",
+    "@sentry/nextjs": "^7.112.2",
     "@tanstack/react-query": "^4.14.5",
     "@tawk.to/tawk-messenger-react": "^2.0.1",
     "chart.js": "^4.3.0",

apps/web/pages/_app.tsx

@@ -3,10 +3,10 @@ import Head from 'next/head';
 import getConfig from 'next/config';
 import { Poppins } from 'next/font/google';
 import App, { AppProps } from 'next/app';
-import { useLocalStorage } from '@mantine/hooks';
 import { ModalsProvider } from '@mantine/modals';
-import { Notifications } from '@mantine/notifications';
+import { useLocalStorage } from '@mantine/hooks';
 import { init } from '@amplitude/analytics-browser';
+import { Notifications } from '@mantine/notifications';
 import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
 import { ColorSchemeProvider, MantineProvider, ColorScheme } from '@mantine/core';
 

apps/web/pages/_error.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import * as Sentry from '@sentry/nextjs';
+import type { NextPage } from 'next';
+import type { ErrorProps } from 'next/error';
+import NextErrorComponent from 'next/error';
+
+const CustomErrorComponent: NextPage<ErrorProps> = (props) => {
+  return <NextErrorComponent statusCode={props.statusCode} />;
+};
+
+CustomErrorComponent.getInitialProps = async (contextData) => {
+  await Sentry.captureUnderscoreErrorException(contextData);
+
+  return NextErrorComponent.getInitialProps(contextData);
+};
+
+export default CustomErrorComponent;

apps/web/sentry.client.config.ts

@@ -0,0 +1,9 @@
+import * as Sentry from '@sentry/nextjs';
+// import getConfig from 'next/config';
+
+// const { publicRuntimeConfig } = getConfig();
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+  tracesSampleRate: 1.0,
+});

apps/web/sentry.edge.config.ts

@@ -0,0 +1,6 @@
+import * as Sentry from '@sentry/nextjs';
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+  tracesSampleRate: 1.0,
+});

apps/web/sentry.server.config.ts

@@ -0,0 +1,6 @@
+import * as Sentry from '@sentry/nextjs';
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+  tracesSampleRate: 1.0,
+});

apps/web/types/global.d.ts

@@ -10,6 +10,7 @@ namespace NodeJS {
     NEXT_PUBLIC_TAWK_PROPERTY_ID: string;
     NEXT_PUBLIC_TAWK_WIDGET_ID: string;
     NEXT_PUBLIC_OPENREPLAY_KEY: string;
+    NEXT_PUBLIC_SENTRY_DSN: string;
 
     NEXT_PUBLIC_GTM_ID: string;
     NEXT_PUBLIC_GOOGLE_ANALYTICS_ID: string;

apps/widget/package.json

@@ -46,8 +46,7 @@
 		"@mantine/dropzone": "6.0.21",
 		"@mantine/hooks": "6.0.21",
 		"@mantine/notifications": "6.0.21",
-		"@sentry/react": "^7.19.0",
-		"@sentry/tracing": "^7.19.0",
+		"@sentry/react": "^7.112.1",
 		"@storybook/addon-essentials": "^6.5.13",
 		"@storybook/react": "^6.5.13",
 		"@tanstack/react-query": "^4.14.5",

apps/widget/src/components/App.tsx

@@ -1,6 +1,5 @@
 import { useState } from 'react';
 import * as Sentry from '@sentry/react';
-import { Integrations } from '@sentry/tracing';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
 
@@ -14,13 +13,7 @@ import { CONTEXT_PATH, variables, SENTRY_DSN, ENV, AMPLITUDE_ID } from '@config'
 if (SENTRY_DSN) {
   Sentry.init({
     dsn: SENTRY_DSN,
-    integrations: [new Integrations.BrowserTracing()],
     environment: ENV,
-    /*
-     * Set tracesSampleRate to 1.0 to capture 100%
-     * of transactions for performance monitoring.
-     * We recommend adjusting this value in production
-     */
     tracesSampleRate: 1.0,
   });
 }