refact common layout (#490)

web/app/components/sentry-initor.tsx

@@ -0,0 +1,30 @@
+'use client'
+
+import { useEffect } from 'react'
+import * as Sentry from '@sentry/react'
+
+const isDevelopment = process.env.NODE_ENV === 'development'
+
+const SentryInit = ({
+  children,
+}: { children: React.ReactElement }) => {
+  useEffect(() => {
+    const SENTRY_DSN = document?.body?.getAttribute('data-public-sentry-dsn')
+    if (!isDevelopment && SENTRY_DSN) {
+      Sentry.init({
+        dsn: SENTRY_DSN,
+        integrations: [
+          new Sentry.BrowserTracing({
+          }),
+          new Sentry.Replay(),
+        ],
+        tracesSampleRate: 0.1,
+        replaysSessionSampleRate: 0.1,
+        replaysOnErrorSampleRate: 1.0,
+      })
+    }
+  }, [])
+  return children
+}
+
+export default SentryInit