@if (env('APP_ENV') == 'production')
  <script src="https://browser.sentry-cdn.com/9.35.0/bundle.tracing.min.js" integrity="sha384-XvcGe2ErrJucCsy3ffdT1rnrcilIPvF5GfEDumgaFnypaxiXyJqr4p4zdMfDrTcM" crossorigin="anonymous"></script>
  <script>
      Sentry.init({
        // Core Configuration
        dsn: "https://93bcd5bcfd9b4901a29f947d3f4359ab@o974569.ingest.us.sentry.io/5930290",
        release: "{{ env('SENTRY_RELEASE', 'VoM@1.0.0') }}",
        environment: "production",
        enabled: true,
        debug: false, // Disable in production to reduce noise

        // Enhanced Data Collection (More Details)
        sendDefaultPii: true,
        attachStacktrace: true,
        maxBreadcrumbs: 50,
        maxValueLength: 500,
        normalizeDepth: 4,
        normalizeMaxBreadth: 500,
        sampleRate: 1.0,
        tracesSampleRate: 0.1,
        autoSessionTracking: true,
        sessionSampleRate: 0.1,

        ignoreErrors: [
          // Browser/Extension Errors (not actionable)
          'ResizeObserver loop limit exceeded',
          'ResizeObserver loop completed with undelivered notifications',
          'Script error.',
          'Non-Error promise rejection captured',
          'ChunkLoadError',
          'Loading chunk',
          'Loading CSS chunk',

          // Network/Connectivity Errors (usually not actionable)
          'NetworkError',
          'fetch',
          'XMLHttpRequest',

          // Third-party script errors
          /google/i,
          /facebook/i,
          /twitter/i,
          /gstatic/i,
          /analytics/i,
          /gtag/i,
          /gtm/i,

          // Common browser quirks
          'cancelled',
          'timeout',
          'aborted'
        ],


        // Enhanced Context and Debugging
        initialScope: {
          tags: {
            version: "{{ env('SENTRY_RELEASE', 'VoM@1.0.0') }}",
            component: "frontend",
            build: "{{ env('APP_BUILD_NUMBER', 'unknown') }}",
          },
          level: 'info',
        },

        // Advanced Error Processing
        beforeSend: (event, hint) => {
          // Skip events in development unless they're errors
          if ("{{ env('APP_ENV', 'production') }}" === 'development' && event.level !== 'error') {
            return null;
          }

          // Enhance error context
          if (event.exception && hint.originalException) {
            const error = hint.originalException;

            // Add more context for specific error types
            if (error.name === 'ChunkLoadError') {
              event.tags = { ...event.tags, error_type: 'chunk_load' };
              event.extra = { ...event.extra, chunk_info: error.message };
            }

            // Add user agent info for client-side errors
            if (navigator && navigator.userAgent) {
              event.contexts = {
                ...event.contexts,
                browser_info: {
                  user_agent: navigator.userAgent,
                  language: navigator.language,
                  platform: navigator.platform,
                }
              };
            }
          }
          return event;
        },

        // Enhanced Breadcrumb Processing
        beforeBreadcrumb: (breadcrumb, hint) => {
          // Skip noisy breadcrumbs in production
          if ("{{ env('APP_ENV', 'production') }}" === 'production') {
            if (breadcrumb.category === 'console' && breadcrumb.level !== 'error') {
              return null; // Only keep console errors in production
            }

            if (breadcrumb.category === 'sentry.event') {
              return null; // Skip Sentry's own events
            }
          }

          // Enhanced XHR/Fetch breadcrumbs
          if (breadcrumb.category === 'fetch' || breadcrumb.category === 'xhr') {
            breadcrumb.data = {
              ...breadcrumb.data,
              timestamp: Date.now(),
            };
          }

          return breadcrumb;
        },

        // Optimized Integrations
        integrations: [
        // PERFORMANCE OPTIMIZATION: Browser Tracing with enhanced filtering to prevent UI blocking
        Sentry.browserTracingIntegration({
          // Only trace navigation and critical interactions
          routingInstrumentation: Sentry.browserTracingIntegration.instrumentNavigation,

          // PERFORMANCE OPTIMIZATION: Keep page load and navigation instrumentation enabled
          // This maintains important performance metrics while filtering out problematic spans
          instrumentPageLoad: true,
          instrumentNavigation: true,

          // PERFORMANCE OPTIMIZATION: Enhanced span filtering to prevent long animation frame issues
          // Filters out static assets, page unload events, and the specific 'ui.long-animation-frame' spans
          // that were causing 10.85-second UI thread blocking in production
          beforeSpanStart: (span) => {
            // Skip spans for static assets and problematic page unload events
            if (span.name && (/\.(js|css|png|jpg|jpeg|gif|svg|ico)$/.test(span.name) || 
                span.name.includes('onpagehide') || 
                span.name.includes('beforeunload') ||
                span.name.includes('ui.long-animation-frame'))) {
              return false;
            }
            return span;
          }
        }),

          // Enhanced error capture
          Sentry.globalHandlersIntegration({
            onerror: true,
            onunhandledrejection: true,
          }),

          // Smart breadcrumbs
          Sentry.breadcrumbsIntegration({
            console: "{{ env('APP_ENV', 'production') }}" !== 'production', // Only in dev
            dom: true,
            fetch: true,
            history: true,
            sentry: false, // Don't track Sentry's own events
            xhr: true,
          }),

          // Deduplication to prevent spam
          Sentry.dedupeIntegration(),
        ],

        // PERFORMANCE OPTIMIZATION: Transport optimization to prevent hanging requests during page unload
        transportOptions: {
          // PERFORMANCE OPTIMIZATION: Disabled keepalive and added timeout to prevent 10.85-second UI blocking
          // The original keepalive: true was causing Sentry to wait for network requests during page unload
          // This change prevents the long animation frame issues seen in production monitoring
          fetchOptions: {
            keepalive: false, // Changed from true to prevent connection hanging
            timeout: 5000, // Added 5 second timeout to prevent hanging requests
          }
        },
      });

      // Additional setup for enhanced monitoring
      if ("{{ env('APP_ENV', 'production') }}" === 'production') {
        // Add performance observer for Core Web Vitals
        if ('PerformanceObserver' in window) {
          const observer = new PerformanceObserver((list) => {
            for (const entry of list.getEntries()) {
              if (entry.name === 'first-contentful-paint') {
                Sentry.setMeasurement('fcp', entry.startTime, 'millisecond');
              }
              if (entry.name === 'largest-contentful-paint') {
                Sentry.setMeasurement('lcp', entry.startTime, 'millisecond');
              }
            }
          });

          observer.observe({ entryTypes: ['paint', 'largest-contentful-paint'] });
        }

        // PERFORMANCE OPTIMIZATION: Prevent long animation frame issues during page unload
        // This event listener addresses the specific 10.85-second UI thread blocking issue
        // that was occurring during page navigation when Sentry tried to send performance data
        window.addEventListener('beforeunload', function() {
          // PERFORMANCE OPTIMIZATION: Gracefully shutdown Sentry during page unload
          // This prevents the DOMWindow.onpagehide event from causing UI thread blocking
          // by closing Sentry with a 2-second timeout instead of waiting for network requests
          if (window.Sentry) {
            window.Sentry.getCurrentScope().setLevel('fatal');
            window.Sentry.close(2000); // Close with 2 second timeout to prevent hanging
          }
        });

        // Add user context when available
        if (window.user) {
          Sentry.setUser({
            id: window.user.id,
            email: window.user.email,
            segment: window.user.segment || 'unknown',
          });
        }
      }
  </script>
@endif