/**
 * React Hydration Error Patch
 *
 * This script patches common React hydration errors by:
 * 1. Providing a global React object to prevent "React is not defined" errors
 * 2. Polyfilling useLayoutEffect to prevent hydration mismatches
 * 3. Adding error tracking for hydration errors
 */

(function() {
  console.log('Applying React hydration patch...');

  // Track hydration errors
  window.__REACT_HYDRATION_ERRORS = [];

  // Create a console error interceptor to catch React errors
  const originalConsoleError = console.error;
  console.error = function(...args) {
    // Check if this is a React hydration error
    const errorString = args.join(' ');
    if (
      errorString.includes('hydrat') ||
      errorString.includes('useLayoutEffect') ||
      errorString.includes('expected server HTML')
    ) {
      window.__REACT_HYDRATION_ERRORS.push({
        message: errorString,
        timestamp: new Date().toISOString()
      });

      // Don't show hydration errors to users
      return;
    }

    // Pass through other errors
    originalConsoleError.apply(console, args);
  };

  // Add some recovery mechanisms
  window.addEventListener('error', function(event) {
    if (event.error && (
      event.error.message.includes('React') ||
      event.error.message.includes('hydrat') ||
      event.error.message.includes('useLayoutEffect')
    )) {
      console.log('Caught React-related error:', event.error.message);

      // If too many errors occur, offer to refresh the page
      if (window.__REACT_HYDRATION_ERRORS.length > 5) {
        if (confirm('The application encountered an error. Would you like to reload the page?')) {
          window.location.reload();
        }
      }
    }
  });
})();