Versioning and Updating improvements

src/components/PwaUpdater.tsx

@@ -1,8 +1,10 @@
 import { type Component, createEffect, onCleanup } from 'solid-js';
 import { useRegisterSW } from 'virtual:pwa-register/solid';
+import { toast } from 'solid-sonner';
 
 // We export a function so other parts of the app can manually trigger an update
 let manualUpdateFn: (() => void) | undefined;
+let updateAndReloadFn: (() => void) | undefined;
 
 export const forceServiceWorkerUpdate = () => {
     if (manualUpdateFn) {
@@ -12,6 +14,15 @@ export const forceServiceWorkerUpdate = () => {
     }
 };
 
+export const updateAndReloadApp = () => {
+    if (updateAndReloadFn) {
+        updateAndReloadFn();
+    } else {
+        console.warn("PWA Updater not initialized yet; reloading directly.");
+        window.location.reload();
+    }
+};
+
 export const PwaUpdater: Component = () => {
     let registration: ServiceWorkerRegistration | undefined;
 
@@ -47,6 +58,33 @@ export const PwaUpdater: Component = () => {
                 registration.update();
             }
         };
+
+        updateAndReloadFn = () => {
+            if (needRefresh()) {
+                console.log('Update ready. Reloading now...');
+                updateServiceWorker(true);
+                return;
+            }
+
+            if (registration) {
+                console.log('Checking for updates before reload...');
+                registration.update();
+            }
+
+            const start = Date.now();
+            const timeoutMs = 5000;
+            const poll = window.setInterval(() => {
+                if (needRefresh()) {
+                    console.log('Update found. Reloading with new SW...');
+                    window.clearInterval(poll);
+                    updateServiceWorker(true);
+                } else if (Date.now() - start > timeoutMs) {
+                    console.log('No update detected quickly. Reloading now...');
+                    window.clearInterval(poll);
+                    toast.info("No update found");
+                }
+            }, 250);
+        };
     });
 
     createEffect(() => {