import { createRoot } from 'react-dom/client'
import App from './App.tsx'
import './index.css'
import './i18n'

// Load fonts asynchronously to avoid render blocking
const loadFonts = () => {
  // @ts-ignore - dynamic imports for fonts
  import('@fontsource-variable/playfair-display');
  // @ts-ignore
  import('@fontsource/poppins/400.css');
  // @ts-ignore
  import('@fontsource/poppins/600.css');
  // @ts-ignore
  import('@fontsource/poppins/700.css');
};

// Defer font loading for better FCP
if (typeof window !== 'undefined') {
  if ('requestIdleCallback' in window) {
    requestIdleCallback(loadFonts, { timeout: 1000 });
  } else {
    setTimeout(loadFonts, 100);
  }
}

// Force Service Worker update check and reload on new version
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.ready.then((registration) => {
    registration.addEventListener('updatefound', () => {
      const newWorker = registration.installing;
      if (newWorker) {
        newWorker.addEventListener('statechange', () => {
          if (newWorker.state === 'activated') {
            // New service worker activated, reload page to get latest version
            window.location.reload();
          }
        });
      }
    });
    
    // Check for updates every 30 seconds
    setInterval(() => {
      registration.update();
    }, 30000);
  });
  
  // Listen for controlling service worker changes
  navigator.serviceWorker.addEventListener('controllerchange', () => {
    window.location.reload();
  });
}

// Render app
createRoot(document.getElementById("root")!).render(<App />);