From eb92447b735520cc9ee06bd568f401d370ce9b43 Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Pasquier <contact@jbpasquier.eu>
Date: Mon, 10 May 2021 12:10:53 +0200
Subject: [PATCH] feature: sw cache all

---
 src/components/sw-toolbox.js |  2 +-
 src/scripts/sw-broadcast.js  | 21 ++++++++++++++++++
 src/service-worker.js        | 42 +++++++++++++++++++++++++++++-------
 3 files changed, 56 insertions(+), 9 deletions(-)
 create mode 100644 src/scripts/sw-broadcast.js

diff --git a/src/components/sw-toolbox.js b/src/components/sw-toolbox.js
index 4b11fd0..ccd1d43 100644
--- a/src/components/sw-toolbox.js
+++ b/src/components/sw-toolbox.js
@@ -10,7 +10,7 @@ if ('serviceWorker' in navigator) {
     let registration;
 
     const showSkipWaitingPrompt = (event) => {
-      if(hubl.intl.t('serviceWorker.newUpdate') != undefined) {
+      if (hubl.intl.t('serviceWorker.newUpdate') != undefined) {
         Swal.fire({
           position: 'bottom-end',
           backdrop: false,
diff --git a/src/scripts/sw-broadcast.js b/src/scripts/sw-broadcast.js
new file mode 100644
index 0000000..7cac9f1
--- /dev/null
+++ b/src/scripts/sw-broadcast.js
@@ -0,0 +1,21 @@
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.addEventListener('message', async (event) => {
+    if (event.data.meta === 'workbox-broadcast-update') {
+      const {
+        cacheName,
+        updatedURL
+      } = event.data.payload;
+
+      const cache = await caches.open(cacheName);
+      const updatedResponse = await cache.match(updatedURL);
+      try {
+        const updatedData = await updatedResponse.json();
+        if (sibStore && "setResource" in sibStore) {
+          sibStore.setResource(updatedURL, updatedData);
+        }
+      } catch (e) {
+        console.error(e);
+      }
+    }
+  });
+}
\ No newline at end of file
diff --git a/src/service-worker.js b/src/service-worker.js
index 3244688..4846f63 100644
--- a/src/service-worker.js
+++ b/src/service-worker.js
@@ -9,7 +9,13 @@ addEventListener('message', (event) => {
 });
 
 workbox.routing.registerRoute(
-  ({url}) => url.origin === 'https://fonts.gstatic.com',
+  ({
+    url
+  }) => [
+    'https://fonts.gstatic.com',
+    'https://fonts.googleapis.com',
+    'https://storage.googleapis.com'
+  ].includes(url.origin),
   new workbox.strategies.CacheFirst({
     cacheName: 'google-fonts-webfonts',
     plugins: [
@@ -25,21 +31,25 @@ workbox.routing.registerRoute(
 );
 
 workbox.routing.registerRoute(
-  ({url}) => [
+  ({
+    url
+  }) => [
     'https://cdn.jsdelivr.net',
     'https://unpkg.com',
     'https://cdn.skypack.dev',
     'https://jspm.dev',
     'https://fonts.googleapis.com',
     'https://cdn.startinblox.com'
-  ].includes(url.origin),
+  ].includes(url.origin) || url.origin.test(/cdn/),
   new workbox.strategies.StaleWhileRevalidate({
     cacheName: 'cdn',
   })
 );
 
 workbox.routing.registerRoute(
-  ({ request }) => request.destination === 'image',
+  ({
+    request
+  }) => request.destination === 'image',
   new workbox.strategies.CacheFirst({
     cacheName: 'images',
     plugins: [
@@ -55,9 +65,11 @@ workbox.routing.registerRoute(
 );
 
 workbox.routing.registerRoute(
-  ({ request }) =>
-    request.destination === 'style' ||
-    request.destination === 'script',
+  ({
+    request
+  }) =>
+  request.destination === 'style' ||
+  request.destination === 'script',
   new workbox.strategies.StaleWhileRevalidate({
     cacheName: 'assets',
     plugins: [
@@ -69,7 +81,9 @@ workbox.routing.registerRoute(
 );
 
 workbox.routing.registerRoute(
-  ({ request }) => request.mode === 'navigate',
+  ({
+    request
+  }) => request.mode === 'navigate',
   new workbox.strategies.NetworkFirst({
     cacheName: 'pages',
     plugins: [
@@ -79,3 +93,15 @@ workbox.routing.registerRoute(
     ],
   }),
 );
+
+workbox.routing.registerRoute(() => true,
+  new workbox.strategies.StaleWhileRevalidate({
+    cacheName: 'apis',
+    plugins: [
+      new workbox.broadcastUpdate.BroadcastUpdatePlugin(),
+      new workbox.expiration.ExpirationPlugin({
+        maxAgeSeconds: 60 * 60 * 24 * 30,
+      }),
+    ],
+  })
+);