Refactor code structure for improved readability and maintainability

Author: tacxou

apps/web/nuxt.config.ts

@@ -68,7 +68,15 @@ export default defineNuxtConfig({
     appManagerVersion: process.env.npm_package_version,
     customSlots: {},
   },
+  runtimeConfig: {
+    public: {
+      sentry: {
+        dsn: process.env.SESAME_SENTRY_DSN,
+      },
+    },
+  },
   modules: [
+    '@sentry/nuxt/module',
     '@nuxt-alt/auth',
     '@nuxt-alt/proxy',
     '@nuxt-alt/http',

apps/web/sentry.client.config.ts

@@ -0,0 +1,5 @@
+import * as Sentry from '@sentry/nuxt'
+Sentry.init({
+  dsn: process.env.SESAME_SENTRY_DSN!,
+  sendDefaultPii: true,
+});

apps/web/src/pages/sentry-example-page.vue

@@ -0,0 +1,9 @@
+<script setup>
+const triggerError = () => {
+  throw new Error('Nuxt Button Error')
+}
+</script>
+
+<template>
+  <button id="errorBtn" @click="triggerError">Trigger Error</button>
+</template>

apps/web/src/server/routes/api/core/backends/sse.get.ts

@@ -0,0 +1,63 @@
+import {
+  H3Event,
+  defineEventHandler,
+  getQuery,
+  getHeaders,
+  setResponseStatus,
+  setHeaders,
+  sendStream,
+  createError,
+} from 'h3'
+import { Agent, request } from 'undici'
+
+const SESAME_APP_API_URL = process.env.SESAME_APP_API_URL || 'http://localhost:4002'
+
+// Create an agent with disabled timeouts for SSE connections
+const sseAgent = new Agent({
+  bodyTimeout: 0, // Disable body timeout
+  headersTimeout: 0, // Disable headers timeout
+  keepAliveTimeout: 0, // Keep connection alive indefinitely
+  keepAliveMaxTimeout: 0,
+})
+
+export default defineEventHandler(async (event: H3Event) => {
+  const query = getQuery(event)
+  const url = new URL(`${SESAME_APP_API_URL}/core/backends/sse`)
+
+  // Forward query parameters
+  Object.entries(query).forEach(([key, value]) => {
+    if (value) {
+      url.searchParams.append(key, String(value))
+    }
+  })
+
+  try {
+    // Make request to backend with custom agent
+    const { statusCode, headers, body } = await request(url.toString(), {
+      method: 'GET',
+      headers: {
+        ...getHeaders(event),
+        host: new URL(SESAME_APP_API_URL).host,
+      },
+      dispatcher: sseAgent,
+    })
+
+    // Set SSE headers
+    setResponseStatus(event, statusCode)
+    setHeaders(event, {
+      'Content-Type': headers['content-type'] || 'text/event-stream',
+      'Cache-Control': 'no-cache, no-transform',
+      'Connection': 'keep-alive',
+      'X-Accel-Buffering': 'no',
+    })
+
+    // Stream the response body
+    return sendStream(event, body)
+  } catch (error) {
+    console.error('[SSE Proxy] Error:', error)
+    throw createError({
+      statusCode: 502,
+      message: 'Failed to connect to SSE endpoint',
+    })
+  }
+})