From 5a0dd49e4e138ca571eb66b28f8996839fe599f4 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Wed, 22 Oct 2025 14:01:53 +0200
Subject: [PATCH] fix(sw): disable Service Worker in dev and register
 non-module SW only in production to avoid stale cached HTML causing
 mismatched content

---
 src/main.tsx | 67 +++++++++++++++++++++++++++++-----------------------
 1 file changed, 37 insertions(+), 30 deletions(-)

diff --git a/src/main.tsx b/src/main.tsx
index daed586e..5fd294de 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -5,38 +5,45 @@ import './styles/tailwind.css'
 import './index.css'
 import 'react-loading-skeleton/dist/skeleton.css'
 
-// Register Service Worker for PWA functionality
+// Service Worker behavior
 if ('serviceWorker' in navigator) {
-  window.addEventListener('load', () => {
-    navigator.serviceWorker
-      .register('/sw.js', { type: 'module' })
-      .then(registration => {
-        
-        // Check for updates periodically
-        setInterval(() => {
-          registration.update()
-        }, 60 * 60 * 1000) // Check every hour
-        
-        // Handle service worker updates
-        registration.addEventListener('updatefound', () => {
-          const newWorker = registration.installing
-          if (newWorker) {
-            newWorker.addEventListener('statechange', () => {
-              if (newWorker.state === 'installed' && navigator.serviceWorker.controller) {
-                // New service worker available
-                
-                // Optionally show a toast notification
-                const updateAvailable = new CustomEvent('sw-update-available')
-                window.dispatchEvent(updateAvailable)
-              }
-            })
-          }
+  // In dev, make sure no stale SW controls the page
+  if (import.meta.env.DEV) {
+    navigator.serviceWorker.getRegistrations().then(regs => {
+      regs.forEach(reg => reg.unregister())
+    })
+  }
+
+  // Register SW only in production builds
+  if (import.meta.env.PROD) {
+    window.addEventListener('load', () => {
+      navigator.serviceWorker
+        .register('/sw.js') // classic SW; built asset is not a module
+        .then(registration => {
+          // Check for updates periodically
+          setInterval(() => {
+            registration.update()
+          }, 60 * 60 * 1000) // Check every hour
+          
+          // Handle service worker updates
+          registration.addEventListener('updatefound', () => {
+            const newWorker = registration.installing
+            if (newWorker) {
+              newWorker.addEventListener('statechange', () => {
+                if (newWorker.state === 'installed' && navigator.serviceWorker.controller) {
+                  // New service worker available
+                  const updateAvailable = new CustomEvent('sw-update-available')
+                  window.dispatchEvent(updateAvailable)
+                }
+              })
+            }
+          })
         })
-      })
-      .catch(error => {
-        console.error('❌ Service Worker registration failed:', error)
-      })
-  })
+        .catch(error => {
+          console.error('❌ Service Worker registration failed:', error)
+        })
+    })
+  }
 }
 
 ReactDOM.createRoot(document.getElementById('root')!).render(