Merge pull request #487 from Gencaster/sentry

Add Sentry logging

caster-back/gencaster/settings/deploy_dev.py

@@ -5,6 +5,9 @@
 Settings for deploying "*production*" dev environment on the server via Docker.
 """
 
+import sentry_sdk
+from sentry_sdk.integrations.django import DjangoIntegration
+
 from .base import *  # noqa
 
 CSRF_TRUSTED_ORIGINS = [
@@ -39,3 +42,20 @@
 SESSION_COOKIE_SAMESITE = None
 
 CSRF_COOKIE_SECURE = True
+
+
+if SENTRY_DSN := os.environ.get("SENTRY_DSN_CASTER_BACK", None):
+    print("### SENTRY LOGGING ACTIVE ###")
+    sentry_sdk.init(
+        dsn=SENTRY_DSN,
+        integrations=[
+            DjangoIntegration(),
+        ],
+        # Set traces_sample_rate to 1.0 to capture 100%
+        # of transactions for performance monitoring.
+        # We recommend adjusting this value in production.
+        traces_sample_rate=1.0,
+        # If you wish to associate users to errors (assuming you are using
+        # django.contrib.auth) you may enable sending PII data.
+        send_default_pii=True,
+    )

caster-back/requirements.txt

@@ -10,3 +10,4 @@ django-cors-headers==4.0.0
 mistletoe==1.0.1
 pydantic==1.10.7
 channels-redis==4.1.0
+sentry-sdk==1.27.0

caster-editor/Dockerfile.deploy

@@ -10,8 +10,10 @@ RUN npm ci
 COPY src/ /root/caster-editor/src/
 
 ARG BACKEND_URL
+ARG SENTRY_DSN_CASTER_EDITOR
 
 ENV VITE_BACKEND_URL=${BACKEND_URL}
+ENV VITE_SENTRY_DSN_CASTER_EDITOR=${SENTRY_DSN_CASTER_EDITOR}
 
 ADD . .
 

caster-editor/package.json

@@ -24,6 +24,7 @@
     "@codemirror/lang-python": "^6.1.2",
     "@element-plus/icons-vue": "^2.1.0",
     "@rah-emil/vite-plugin-vue-type-imports": "^0.2.5",
+    "@sentry/vue": "^7.57.0",
     "@toast-ui/editor": "^3.2.2",
     "@urql/exchange-multipart-fetch": "^1.0.1",
     "@urql/vue": "^1.0.4",

caster-editor/src/main.ts

@@ -9,6 +9,7 @@ import VNetworkGraph from "v-network-graph";
 import { SubscriptionClient } from "subscriptions-transport-ws";
 import { multipartFetchExchange } from "@urql/exchange-multipart-fetch";
 import "v-network-graph/lib/style.css";
+import * as Sentry from "@sentry/vue";
 
 import ElementPlus from "element-plus";
 import "element-plus/dist/index.css";
@@ -20,6 +21,33 @@ import "./assets/scss/main.scss";
 import "v-network-graph/lib/style.css";
 
 const app = createApp(App);
+
+if (
+  import.meta.env.VITE_BACKEND_URL &&
+  import.meta.env.VITE_SENTRY_DSN_CASTER_EDITOR
+) {
+  Sentry.init({
+    app,
+    dsn: import.meta.env.VITE_SENTRY_DSN_CASTER_EDITOR,
+    integrations: [
+      new Sentry.BrowserTracing({
+        // Set `tracePropagationTargets` to control for which URLs distributed tracing should be enabled
+        tracePropagationTargets: [
+          "127.0.0.1",
+          "https://backend.dev.gencaster.org/graphql",
+        ],
+        routingInstrumentation: Sentry.vueRouterInstrumentation(router),
+      }),
+      new Sentry.Replay(),
+    ],
+    // Performance Monitoring
+    tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
+    // Session Replay
+    replaysSessionSampleRate: 0.5, // 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.
+  });
+}
+
 app.use(router);
 
 app.use(urql, {

caster-front/Dockerfile.deploy

@@ -11,9 +11,11 @@ COPY . .
 
 ARG BACKEND_URL
 ARG JANUS_URL
+ARG SENTRY_DSN_CASTER_FRONT
 
 ENV VITE_BACKEND_URL=${BACKEND_URL}
 ENV VITE_JANUS_URL=${JANUS_URL}
+ENV VITE_SENTRY_DSN_CASTER_FRONT=${SENTRY_DSN_CASTER_FRONT}
 
 RUN npm run build