feat(stats): add Sentry observability with distributed tracing

[Copilot]

Implements Sentry error tracking and distributed tracing for stats-web, matching the deploy-web setup. The traceparent header is now propagated for all requests (SSR and client-side).

Changes

Core Sentry Setup

• Added @sentry/nextjs v9.37.0 dependency
• Created sentry.client.config.ts for browser-side initialization with browser extension/third-party error filtering
• Updated instrumentation.ts to initialize Sentry on server runtime
• Modified next.config.js to integrate Sentry webpack plugin for source maps and release tracking
• Excluded pino-pretty from client bundle to resolve webpack errors

Distributed Tracing

• Created ErrorHandlerService with sentryTraceToW3C() converter (Sentry trace format → W3C traceparent)
• Enhanced serverFetch() to inject traceparent and baggage headers from Sentry trace context
• Configured client-side trace propagation for /api/ and /_next/ routes

Error Capture

• Updated error.tsx and global-error.tsx to capture exceptions via Sentry.captureException()

Environment Configuration

• Added Sentry env vars to all deployment configs (.env.sample, .env.production, .env.staging, .env.local.sample)
• Required vars: NEXT_PUBLIC_SENTRY_DSN, NEXT_PUBLIC_SENTRY_APPLICATION_KEY, NEXT_PUBLIC_SENTRY_ENABLED

Example: Distributed Tracing

// Server-side requests automatically include distributed tracing headers
export async function serverFetch(url: string, init?: RequestInit): Promise<Response> {
  const traceHeaders = getTraceparentHeaders(); // Extracts from Sentry, converts to W3C
  const mergedHeaders = new Headers(init?.headers);
  
  traceHeaders.forEach((value, key) => {
    mergedHeaders.set(key, value); // traceparent + baggage
  });
  
  return fetch(url, { ...init, headers: mergedHeaders });
}

Requires Sentry project creation and credential configuration for activation.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>setup sentry for stats-web</issue_title>
<issue_description>## Why

observability layer is missing for stats-web

What

1. Look at apps/deploy-web @sentry/nextjs setup
2. Copy it to stats-web
3. Ensure distributed tracing works properly, traceparent header is set for ALL requests sent from SSR and FE
4. Setup project on Sentry
5. Adjust .env files to contain sentry specific configs
   </issue_description>

<agent_instructions>follow CLAUDE.md and .cursor/*.mdc rules</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes setup sentry for stats-web #2529

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[coderabbitai]

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​sentry/​nextjs@​9.47.1

View full report