Invalidate Service Worker Cache during update

flojud · May 17, 2024 · 83c3038 · 83c3038
1 parent c84f797
commit 83c3038
Showing 1 changed file with 22 additions and 6 deletions.
diff --git a/src/components/menu/FlyoutMenuList.tsx b/src/components/menu/FlyoutMenuList.tsx
@@ -33,12 +33,28 @@ const FlyoutMenuList = () => {
     if ('serviceWorker' in navigator) {
       navigator.serviceWorker.ready
         .then((registration) => {
-          registration.unregister().then(() => {
-            notifyContext.addNotification('Deine App wurde aktualisiert', 'success');
-            setTimeout(() => {
-              window.location.reload();
-            }, 2000);
-          });
+          // first try to clear the cache
+          caches
+            .keys()
+            .then((cacheNames) => {
+              return Promise.all(
+                cacheNames.map((cacheName) => {
+                  return caches.delete(cacheName);
+                })
+              );
+            })
+            .catch((error) => {
+              console.error('Error clearing service worker cache:', error);
+            })
+            .finally(() => {
+              // then update the service worker and reload the page
+              registration.unregister().then(() => {
+                notifyContext.addNotification('Deine App wurde aktualisiert', 'success');
+                setTimeout(() => {
+                  window.location.reload();
+                }, 2000);
+              });
+            });
         })
         .catch((error) => {
           notifyContext.addNotification('Ops da hat was nicht geklappt!', 'error');