// Configuration in vite.config.ts
VitePWA({
  registerType: 'prompt',
  includeAssets: [
    'favicon.ico',
    'apple-icon-180.png',
    'manifest-icon-192.maskable.png',
    'manifest-icon-512.maskable.png'
  ],
  manifest: {
    name: "Let's Stream V2.0",
    short_name: "Let's Stream",
    description: "Watch movies and TV shows online",
    theme_color: '#3b82f6',
    start_url: '/',
    display: 'standalone',
    background_color: '#0f0f0f'
  }
})

// Example: PWA install prompt component
const PWAInstallPrompt = () => {
  const [showPrompt, setShowPrompt] = useState(false);
  
  useEffect(() => {
    // Listen for beforeinstallprompt
    window.addEventListener('beforeinstallprompt', (e) => {
      e.preventDefault();
      setShowPrompt(true);
    });
  }, []);

  return showPrompt ? (
    <div className="pwa-prompt">
      <h3>Install App</h3>
      <p>Install Let's Stream for a better experience!</p>
      <button onClick={handleInstall}>Install</button>
    </div>
  ) : null;
};

// Example: Offline status hook
const useOfflineStatus = () => {
  const [isOffline, setIsOffline] = useState(!navigator.onLine);

  useEffect(() => {
    const handleOnline = () => setIsOffline(false);
    const handleOffline = () => setIsOffline(true);

    window.addEventListener('online', handleOnline);
    window.addEventListener('offline', handleOffline);

    return () => {
      window.removeEventListener('online', handleOnline);
      window.removeEventListener('offline', handleOffline);
    };
  }, []);

  return isOffline;
};

// Example: Push notification registration
const registerPushNotifications = async () => {
  try {
    const permission = await Notification.requestPermission();
    if (permission === 'granted') {
      const token = await getMessagingToken();
      await saveUserToken(token);
    }
  } catch (error) {
    console.error('Error registering push notifications:', error);
  }
};

// Example: Register background sync
const registerSync = async () => {
  if ('serviceWorker' in navigator && 'SyncManager' in window) {
    const registration = await navigator.serviceWorker.ready;
    try {
      await registration.sync.register('syncUserData');
    } catch (error) {
      console.error('Background sync failed:', error);
    }
  }
};

// Example: Service worker debugging
if (process.env.NODE_ENV === 'development') {
  window.addEventListener('sw-state-change', (e) => {
    console.log('Service Worker state:', e.detail);
  });

  navigator.serviceWorker.addEventListener('message', (event) => {
    console.log('Message from Service Worker:', event.data);
  });
}