feat: add client-side sentry tracking

.env.example

@@ -4,3 +4,6 @@ SOROBAN_RPC_URL=https://soroban-testnet.stellar.org
 TRUSTFLOW_CONTRACT_ID=
 JWT_SECRET=change-me-in-production
 PORT=3001
+NEXT_PUBLIC_SENTRY_DSN=
+NEXT_PUBLIC_SENTRY_ENVIRONMENT=development
+NEXT_PUBLIC_SENTRY_TRACES_SAMPLE_RATE=0.1

README.md

@@ -105,8 +105,11 @@ Key variables:
 NEXT_PUBLIC_STELLAR_NETWORK=TESTNET
 NEXT_PUBLIC_SOROBAN_RPC_URL=https://soroban-testnet.stellar.org
 NEXT_PUBLIC_ESCROW_CONTRACT_ID=your-contract-id
+NEXT_PUBLIC_SENTRY_DSN=your-sentry-dsn
 ```
 
+`NEXT_PUBLIC_SENTRY_DSN` is optional. When it is omitted, the browser client skips Sentry initialization.
+
 ### Running
 
 ```bash

components/atoms/client-error-boundary/index.tsx

@@ -0,0 +1,44 @@
+import React from 'react'
+import { captureClientException } from '../../../shared/sentryClient'
+
+interface ClientErrorBoundaryProps {
+  children: React.ReactNode
+}
+
+interface ClientErrorBoundaryState {
+  hasError: boolean
+}
+
+export class ClientErrorBoundary extends React.Component<
+  ClientErrorBoundaryProps,
+  ClientErrorBoundaryState
+> {
+  state: ClientErrorBoundaryState = {
+    hasError: false,
+  }
+
+  static getDerivedStateFromError(): ClientErrorBoundaryState {
+    return { hasError: true }
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    void captureClientException(error, {
+      componentStack: errorInfo.componentStack,
+    })
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <main className="min-h-screen bg-gray-50 px-6 py-24 text-center text-gray-900 dark:bg-gray-950 dark:text-gray-100">
+          <h1 className="text-2xl font-bold">Something went wrong</h1>
+          <p className="mx-auto mt-3 max-w-md text-sm text-gray-600 dark:text-gray-400">
+            The app hit an unexpected client-side error. Please refresh the page and try again.
+          </p>
+        </main>
+      )
+    }
+
+    return this.props.children
+  }
+}

components/atoms/index.tsx

@@ -9,3 +9,4 @@ export * from './loading'
 export * from './toast'
 export * from './theme-toggle'
 export * from './spacer'
+export * from './client-error-boundary'