- add: perimssion and Send Notification to a Service Worker... -> and finally to the App

src-pwa/custom-service-worker.js

@@ -203,6 +203,12 @@ if (workbox) {
   );
 
 
+  workbox.routing.registerRoute(
+    new RegExp('/admin/'),
+    workbox.strategies.networkOnly()
+  );
+
+
 }
 
 if ('serviceWorker' in navigator) {
@@ -211,6 +217,13 @@ if ('serviceWorker' in navigator) {
 
 }
 
+self.addEventListener('fetch', (event) => {
+  if (event.request.url === '/') {
+    const staleWhileRevalidate = new workbox.strategies.StaleWhileRevalidate();
+    event.respondWith(staleWhileRevalidate.handle({event}));
+  }
+});
+
 // self.addEventListener('fetch', function (event) {
 //   console.log('[Service Worker] Fetching something ....', event);
 //   console.log('event.request.cache=', event.request.cache)
@@ -330,3 +343,61 @@ self.addEventListener('sync', event => {
   event.waitUntil(fetch(url, options))
 })
 */
+
+self.addEventListener('notificationclick', function(event) {
+  var notification = event.notification;
+  var action = event.action;
+
+  console.log(notification);
+
+  if (action === 'confirm') {
+    console.log('Confirm was chosen');
+    notification.close();
+  } else {
+    console.log(action);
+    event.waitUntil(
+      clients.matchAll()
+        .then(function(clis) {
+          var client = clis.find(function(c) {
+            return c.visibilityState === 'visible';
+          });
+
+          if (client !== undefined) {
+            client.navigate(notification.data.url);
+            client.focus();
+          } else {
+            clients.openWindow(notification.data.url);
+          }
+          notification.close();
+        })
+    );
+  }
+});
+
+self.addEventListener('notificationclose', function(event) {
+  console.log('Notification was closed', event);
+});
+
+self.addEventListener('push', function(event) {
+  console.log('Push Notification received', event);
+
+  var data = {title: 'New!', content: 'Something new happened!', openUrl: '/'};
+
+  if (event.data) {
+    data = JSON.parse(event.data.text());
+  }
+
+  var options = {
+    body: data.content,
+    icon: '/src/images/icons/app-icon-96x96.png',
+    badge: '/src/images/icons/app-icon-96x96.png',
+    data: {
+      url: data.openUrl
+    }
+  };
+
+  event.waitUntil(
+    self.registration.showNotification(data.title, options)
+  );
+});
+