@dargmuesli/nuxt-vio 23.0.0-beta.2 → 23.0.0-beta.3

package/app/composables/sentry.ts

@@ -0,0 +1,17 @@
+import { getSharedSentryConfig } from '~~/node/static'
+
+export const useSharedSentryConfig = () => {
+  const isTesting = useIsTesting()
+  const runtimeConfig = useRuntimeConfig()
+
+  return getSharedSentryConfig({
+    enableLogs: runtimeConfig.public.sentry.logs.enable,
+    environment: runtimeConfig.public.sentry.environment,
+    host: runtimeConfig.public.sentry.host,
+    isInProduction: runtimeConfig.public.vio.isInProduction,
+    isTesting,
+    projectId: runtimeConfig.public.sentry.project.id,
+    projectPublicKey: runtimeConfig.public.sentry.project.publicKey,
+    release: runtimeConfig.public.sentry.release,
+  })
+}

package/app/stores/auth.ts

@@ -1,9 +1,11 @@
+import * as Sentry from '@sentry/nuxt'
 import { decodeJwt } from 'jose'
 import type { JWTPayload } from 'jose'
 import { defineStore } from 'pinia'
 import { ref } from 'vue'
 
 export const useVioAuthStore = defineStore('vio-auth', () => {
+  const runtimeConfig = useRuntimeConfig()
   const jwt = ref<string>()
   const jwtDecoded = ref<JWTPayload>()
   const signedInUsername = ref<string>()
@@ -21,6 +23,17 @@ export const useVioAuthStore = defineStore('vio-auth', () => {
       jwtDecodedNew.exp > Math.floor(Date.now() / 1000)
         ? (jwtDecodedNew.username as string | undefined)
         : undefined
+
+    if (runtimeConfig.public.sentry.features.userTracking) {
+      Sentry.setUser(
+        signedInUsername.value
+          ? {
+              id: jwtDecodedNew?.sub as string | undefined,
+              username: signedInUsername.value,
+            }
+          : null,
+      )
+    }
   }
 
   return {

package/node/static/index.ts

@@ -1,2 +1,3 @@
 export * from './environment'
 export * from './nuxt'
+export * from './sentry'

package/node/static/sentry.ts

@@ -0,0 +1,42 @@
+import type * as Sentry from '@sentry/nuxt'
+
+export const NUXT_PUBLIC_SENTRY_ENVIRONMENT =
+  process.env.NUXT_PUBLIC_SENTRY_ENVIRONMENT
+export const NUXT_PUBLIC_SENTRY_HOST = process.env.NUXT_PUBLIC_SENTRY_HOST || ''
+export const NUXT_PUBLIC_SENTRY_LOGS_ENABLE =
+  process.env.NUXT_PUBLIC_SENTRY_LOGS_ENABLE !== 'false'
+export const NUXT_PUBLIC_SENTRY_PROJECT_ID =
+  process.env.NUXT_PUBLIC_SENTRY_PROJECT_ID || ''
+export const NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY =
+  process.env.NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY || ''
+export const NUXT_PUBLIC_SENTRY_RELEASE = process.env.RELEASE_NAME
+
+export const getSharedSentryConfig = ({
+  enableLogs,
+  environment,
+  host,
+  isInProduction,
+  isTesting,
+  projectId,
+  projectPublicKey,
+  release,
+}: {
+  enableLogs?: boolean
+  environment?: string
+  host?: string
+  isInProduction: boolean
+  isTesting?: boolean
+  projectId?: string
+  projectPublicKey?: string
+  release?: string
+}): Parameters<typeof Sentry.init>[0] => ({
+  dsn:
+    projectPublicKey && host && projectId
+      ? `https://${projectPublicKey}@${host}/${projectId}`
+      : undefined,
+  enabled: isInProduction && !isTesting,
+  enableLogs,
+  environment,
+  release,
+  tracesSampleRate: 1.0,
+})

package/nuxt.config.ts

@@ -2,7 +2,17 @@ import tailwindcss from '@tailwindcss/vite'
 import { defu } from 'defu'
 import { createResolver } from 'nuxt/kit'
 
-import { IS_IN_STACK, SITE_URL, VIO_NUXT_BASE_CONFIG } from './node/static'
+import {
+  IS_IN_STACK,
+  NUXT_PUBLIC_SENTRY_ENVIRONMENT,
+  NUXT_PUBLIC_SENTRY_HOST,
+  NUXT_PUBLIC_SENTRY_LOGS_ENABLE,
+  NUXT_PUBLIC_SENTRY_PROJECT_ID,
+  NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY,
+  NUXT_PUBLIC_SENTRY_RELEASE,
+  SITE_URL,
+  VIO_NUXT_BASE_CONFIG,
+} from './node/static'
 import {
   GTAG_COOKIE_ID,
   TIMEZONE_COOKIE_NAME,
@@ -53,6 +63,7 @@ export default defineNuxtConfig(
         '@nuxtjs/seo',
         '@nuxtjs/turnstile',
         '@pinia/nuxt',
+        '@sentry/nuxt/module',
         'nuxt-gtag',
         'shadcn-nuxt',
         (_options, nuxt) => {
@@ -72,7 +83,16 @@ export default defineNuxtConfig(
           ) {
             if (nuxt.options.nitro.static) {
               nuxtConfigSecurityHeaders.contentSecurityPolicy = defu(
-                VIO_GET_CSP({ siteUrl: new URL(SITE_URL) }),
+                VIO_GET_CSP({
+                  sentry:
+                    NUXT_PUBLIC_SENTRY_HOST && NUXT_PUBLIC_SENTRY_PROJECT_ID
+                      ? {
+                          host: NUXT_PUBLIC_SENTRY_HOST,
+                          projectId: NUXT_PUBLIC_SENTRY_PROJECT_ID,
+                        }
+                      : undefined,
+                  siteUrl: new URL(SITE_URL),
+                }),
                 nuxtConfigSecurityHeaders.contentSecurityPolicy,
               )
             }
@@ -106,6 +126,37 @@ export default defineNuxtConfig(
           i18n: {
             baseUrl: SITE_URL,
           },
+          sentry: {
+            environment: NUXT_PUBLIC_SENTRY_ENVIRONMENT,
+            features: {
+              consoleCapture: true,
+              pinia: true,
+              profiling: true,
+              replay: true,
+              securityHeaders: true,
+              userTracking: true,
+            },
+            host: NUXT_PUBLIC_SENTRY_HOST,
+            logs: {
+              enable: NUXT_PUBLIC_SENTRY_LOGS_ENABLE,
+            },
+            profiles: {
+              sampleRate: 1.0,
+            },
+            project: {
+              id: NUXT_PUBLIC_SENTRY_PROJECT_ID,
+              publicKey: NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY,
+            },
+            release: NUXT_PUBLIC_SENTRY_RELEASE,
+            replays: {
+              onError: {
+                sampleRate: 1.0,
+              },
+              session: {
+                sampleRate: 0.0,
+              },
+            },
+          },
           site: {
             url: SITE_URL, // TODO: evaluate removal for static builds in favor of i18n.baseUrl
           },
@@ -127,11 +178,7 @@ export default defineNuxtConfig(
         },
         tsConfig: {
           nodeTsConfig: {
-            include: [
-              resolve('../.config'),
-              resolve('../node'),
-              // resolve('../sentry.server.config.ts'),
-            ],
+            include: [resolve('../.config'), resolve('../node')],
           },
           vueCompilerOptions: {
             htmlAttributes: [], // https://github.com/johnsoncodehk/volar/issues/1970#issuecomment-1276994634
@@ -290,6 +337,16 @@ export default defineNuxtConfig(
         },
         strict: true,
       },
+      sentry: {
+        release: {
+          name: process.env.RELEASE_NAME || undefined,
+        },
+        sourcemaps: {
+          disable: !process.env.SENTRY_AUTH_TOKEN,
+        },
+        telemetry: false,
+        // `org`, `project` and `authToken` are read from the `SENTRY_ORG`, `SENTRY_PROJECT` and `SENTRY_AUTH_TOKEN` environment variables by the module itself.
+      },
       seo: {
         minify: false, // TODO: enable (https://github.com/harlan-zw/nuxt-seo-utils/issues/103)
       },
@@ -326,6 +383,9 @@ export default defineNuxtConfig(
             strictTransportSecurity: false, // prevent endless reload in Chrome
           },
         },
+        sentry: {
+          enabled: false,
+        },
         site: {
           debug: true,
         },

package/package.json

@@ -15,6 +15,7 @@
     "@nuxtjs/seo": "5.3.14",
     "@nuxtjs/turnstile": "1.1.3",
     "@pinia/nuxt": "1.0.2",
+    "@sentry/nuxt": "10.71.0",
     "@tailwindcss/forms": "0.5.11",
     "@tailwindcss/typography": "0.5.20",
     "@tailwindcss/vite": "4.3.3",
@@ -84,7 +85,9 @@
     "server",
     "shared",
     "nuxt.config.ts",
-    "package.json"
+    "package.json",
+    "sentry.client.config.ts",
+    "sentry.server.config.ts"
   ],
   "main": "nuxt.config.ts",
   "name": "@dargmuesli/nuxt-vio",
@@ -101,7 +104,7 @@
     "url": "git+https://github.com/dargmuesli/vio.git"
   },
   "type": "module",
-  "version": "23.0.0-beta.2",
+  "version": "23.0.0-beta.3",
   "scripts": {
     "build": "pnpm run build:node",
     "build:node": "NUXT_PUBLIC_I18N_BASE_URL=https://app.localhost:3001 nuxt build playground",

package/sentry.client.config.ts

@@ -0,0 +1,38 @@
+import * as Sentry from '@sentry/nuxt'
+
+const runtimeConfig = useRuntimeConfig()
+const sharedSentryConfig = useSharedSentryConfig()
+
+if (sharedSentryConfig.dsn) {
+  const features = runtimeConfig.public.sentry.features
+
+  Sentry.init({
+    ...sharedSentryConfig,
+    integrations: [
+      ...(features.profiling ? [Sentry.browserProfilingIntegration()] : []),
+      ...(features.consoleCapture
+        ? [
+            Sentry.captureConsoleIntegration(),
+            Sentry.consoleLoggingIntegration(),
+          ]
+        : []),
+      Sentry.httpClientIntegration(),
+      ...(features.pinia ? [Sentry.piniaIntegration(usePinia())] : []),
+      ...(features.replay ? [Sentry.replayIntegration()] : []),
+      Sentry.zodErrorsIntegration(),
+    ],
+    profilesSampleRate: features.profiling
+      ? runtimeConfig.public.sentry.profiles.sampleRate
+      : undefined,
+    replaysOnErrorSampleRate: features.replay
+      ? runtimeConfig.public.sentry.replays.onError.sampleRate
+      : undefined,
+    replaysSessionSampleRate: features.replay
+      ? runtimeConfig.public.sentry.replays.session.sampleRate
+      : undefined,
+  })
+} else {
+  console.warn(
+    'Sentry configuration is incomplete, skipping Sentry initialization.',
+  )
+}

package/sentry.server.config.ts

@@ -0,0 +1,36 @@
+import * as Sentry from '@sentry/nuxt'
+
+import {
+  getSharedSentryConfig,
+  IS_IN_PRODUCTION,
+  NUXT_PUBLIC_SENTRY_ENVIRONMENT,
+  NUXT_PUBLIC_SENTRY_HOST,
+  NUXT_PUBLIC_SENTRY_LOGS_ENABLE,
+  NUXT_PUBLIC_SENTRY_PROJECT_ID,
+  NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY,
+  NUXT_PUBLIC_SENTRY_RELEASE,
+} from './node/static'
+
+const sharedSentryConfig = getSharedSentryConfig({
+  enableLogs: NUXT_PUBLIC_SENTRY_LOGS_ENABLE,
+  environment: NUXT_PUBLIC_SENTRY_ENVIRONMENT,
+  host: NUXT_PUBLIC_SENTRY_HOST,
+  isInProduction: IS_IN_PRODUCTION,
+  isTesting: !!process.env.NUXT_PUBLIC_VIO_IS_TESTING,
+  projectId: NUXT_PUBLIC_SENTRY_PROJECT_ID,
+  projectPublicKey: NUXT_PUBLIC_SENTRY_PROJECT_PUBLIC_KEY,
+  release: NUXT_PUBLIC_SENTRY_RELEASE,
+})
+
+if (sharedSentryConfig.dsn) {
+  Sentry.init({
+    ...sharedSentryConfig,
+    integrations: NUXT_PUBLIC_SENTRY_LOGS_ENABLE
+      ? [Sentry.consoleLoggingIntegration()]
+      : [],
+  })
+} else {
+  console.warn(
+    'Sentry configuration is incomplete, skipping Sentry initialization.',
+  )
+}

package/server/middleware/sentry.ts

@@ -0,0 +1,33 @@
+export default defineEventHandler((event) => {
+  const runtimeConfig = useRuntimeConfig(event)
+  const sentryConfig = runtimeConfig.public.sentry
+
+  if (
+    !sentryConfig.features.securityHeaders ||
+    !sentryConfig.host ||
+    !sentryConfig.project.id ||
+    !sentryConfig.project.publicKey
+  ) {
+    return
+  }
+
+  const securityEndpointParams = [
+    `sentry_key=${sentryConfig.project.publicKey}`,
+    sentryConfig.environment &&
+      `sentry_environment=${sentryConfig.environment}`,
+    sentryConfig.release && `sentry_release=${sentryConfig.release}`,
+  ]
+    .filter(Boolean)
+    .join('&')
+
+  appendHeader(
+    event,
+    'NEL',
+    '\'{"report_to":"sentry","max_age":31536000,"include_subdomains":true}\'',
+  )
+  appendHeader(
+    event,
+    'Report-To',
+    `'{"group":"sentry","max_age":31536000,"endpoints":[{"url":"https://${sentryConfig.host}/api/${sentryConfig.project.id}/security/?${securityEndpointParams}"}],"include_subdomains":true}'`,
+  )
+})

package/shared/utils/constants.ts

@@ -12,7 +12,13 @@ export const COOKIE_CONTROL_CONSENT_COOKIE_NAME =
 export const COOKIE_PREFIX = VIO_SITE_NAME.toLocaleLowerCase()
 export const COOKIE_SEPARATOR = '_'
 export const FETCH_RETRY_AMOUNT = 3
-export const VIO_GET_CSP = ({ siteUrl }: { siteUrl: URL }) =>
+export const VIO_GET_CSP = ({
+  sentry,
+  siteUrl,
+}: {
+  sentry?: { host: string; projectId: string }
+  siteUrl: URL
+}) =>
   defu(
     {
       // Cloudflare
@@ -26,6 +32,17 @@ export const VIO_GET_CSP = ({ siteUrl }: { siteUrl: URL }) =>
           }
         : {}),
     },
+    {
+      // Sentry
+      ...(sentry
+        ? {
+            'connect-src': [
+              `https://${sentry.host}/api/${sentry.projectId}/envelope/`,
+            ],
+            'worker-src': ['blob:'],
+          }
+        : {}),
+    },
     {
       // Google Analytics 4 (https://developers.google.com/tag-platform/tag-manager/web/csp)
       'connect-src': [