Implement push subscription management and enhance service worker notifications

Author: gvbvdxxalt2

src/accounthelper/index.js

@@ -164,6 +164,17 @@ async function uploadPushSubscription(subscription) {
       }
 }
 
+async function uploadRemovePushSubscription(subscription) {
+  var response = await fetch(getServerURL() + '/webpush/unsubscribe', {
+        method: 'POST',
+        body: JSON.stringify(subscription),
+        headers: { 'Content-Type': 'application/json' }
+      });
+      if (!response.ok) {
+        throw new Error("Issue when sending to remove subscription. Error: " +  await response.text());
+      }
+}
+
 pushNotificationHelper.subscribe = async function (retry = false) {
   var subscription = await pushNotificationHelper.getSubscription();
   if (subscription && !retry) {
@@ -174,6 +185,15 @@ pushNotificationHelper.subscribe = async function (retry = false) {
   await uploadPushSubscription(subscription);
 };
 
+pushNotificationHelper.unsubscribe = async function () {
+  var subscription = await pushNotificationHelper.getSubscription();
+  if (!subscription) {
+    return; //No subscription
+  }
+  await pushNotificationHelper.__unsubscribe();
+  await uploadRemovePushSubscription(subscription);
+};
+
 module.exports = {
   cookieManager,
   getServerURL,

src/accounthelper/pushhelper.js

@@ -1,3 +1,5 @@
+//This file goes along with accounthelper.js
+//Use accounthelper to get the full functions.
 var pushNotificationHelper = {};
 var _registerResolves = [];
 var _registerRejects = [];
@@ -68,4 +70,17 @@ pushNotificationHelper.__subscribe = async function (publicKey) {
 
 pushNotificationHelper.subscribe = async () => {window.alert("pushNotificationHelper.subscribe needs to be overriden by accounthelper.");};
 
+pushNotificationHelper.__unsubscribe = async function () {
+    var registration = pushNotificationHelper.registration;
+    if (!registration) {
+        return;
+    }
+    var successful = await subscription.unsubscribe();
+    if (!successful) {
+        throw new Error("Unsubscribe was unsuccessful");
+    }
+};
+
+pushNotificationHelper.unsubscribe = async () => {window.alert("pushNotificationHelper.unsubscribe needs to be overriden by accounthelper.");};
+
 module.exports = pushNotificationHelper;

src/chat/interface/notifications/index.js

@@ -208,6 +208,13 @@ class RealTimeNotifications {
         "/notifications",
       this.onMessage.bind(this),
     );
+
+    if ('serviceWorker' in navigator && navigator.serviceWorker.controller) {
+      navigator.serviceWorker.controller.postMessage({
+        type: 'HEARTBEAT',
+        username: accountHelper.getCurrentValidationState()
+      });
+    }
   }
   onMessage(e) {
     var data = e.data;

src/serviceworker/index.js

@@ -18,28 +18,7 @@ async function sendPushNotification({title = APP_NAME, body = "", icon = "/image
   });
 }
 
-async function handlePush(event) {
-  const clientList = await clients.matchAll({ type: 'window', includeUncontrolled: true });
-
-  const isInsideChat = clientList.some(client => {
-    const url = new URL(client.url);
-    return url.pathname.startsWith('/chat') && client.visibilityState === 'visible';
-  });
-
-  var origin = ""+self.location.origin;
-  origin = origin.trim();
-  if (origin.endsWith("/")) {
-    origin = origin.slice(0,origin.length-1); //remove the ending slash.
-  }
-
-  // Parse the data sent from your Node.js server
-  var json = null;
-  if (event.data) {
-    json = event.data.json();
-  } else {
-    return;
-  }
-
+async function handleNotification(json) {
   if (json.type == "test") {
     sendPushNotification({
         body: "This is test notification"
@@ -65,6 +44,37 @@ async function handlePush(event) {
   }
 }
 
+async function handlePush(event) {
+  const clientList = await clients.matchAll({ type: 'window', includeUncontrolled: true });
+
+  const isInsideChat = clientList.some(client => {
+    const url = new URL(client.url);
+    return url.pathname.startsWith('/chat') && client.visibilityState === 'visible';
+  });
+
+  var origin = ""+self.location.origin;
+  origin = origin.trim();
+  if (origin.endsWith("/")) {
+    origin = origin.slice(0,origin.length-1); //remove the ending slash.
+  }
+
+  // Parse the data sent from your Node.js server
+  var json = null;
+  if (event.data) {
+    json = event.data.json();
+  } else {
+    return;
+  }
+
+  await handleNotification(json);
+}
+
+function buildWsNotifyURL() {
+  var protocol = self.location.protocol === "https:" ? "wss://" : "ws://";
+  var wsUrl = `${protocol}${self.location.host}/notifications`;
+  return wsUrl;
+}
+
 // 2. Handle Notification Clicks
 self.addEventListener('notificationclick', (event) => {
   event.notification.close();
@@ -98,4 +108,71 @@ self.addEventListener('install', (event) => {
 
 self.addEventListener('activate', (event) => {
   event.waitUntil(clients.claim());
+});
+
+async function sendInitialNotifcations() {
+  var ws = new WebSocket(wsUrl);
+
+  setTimeout(() => {
+    try{
+      
+    }catch(e){
+      ws.close();
+    }
+  },2000);
+
+  ws.onmessage = async function (event) {
+    var json = JSON.parse(event.data);
+
+    if (json.type == "current") {
+      for (const notif of json.notifications) {
+        await handleNotification(notif);
+      }
+    }
+  };
+}
+
+self.addEventListener('message', async (event) => {
+  if (event.data && event.data.type === 'HEARTBEAT') {
+    var cache = await caches.open('rr-meta');
+    // Save the current timestamp
+    await cache.put('last-seen-online', new Response(Date.now().toString()));
+  }
+});
+
+async function checkReEngagement() {
+  var THREE_DAYS = 3 * 24 * 60 * 60 * 1000;
+  var now = Date.now();
+  
+  var cache = await caches.open('rr-meta');
+  var lastSeenResponse = await cache.match('last-seen-online');
+  
+  if (lastSeenResponse) {
+    var lastSeen = parseInt(await lastSeenResponse.text());
+    
+    // If it's been more than 3 days since the last HEARTBEAT
+    if (now - lastSeen > THREE_DAYS) {
+      await sendPushNotification({
+        title: "Missing the chaos?",
+        body: "Your friends haven't seen you in a while! Jump back into the rants.",
+        tag: "re-engage",
+        data: { targetURL: "/chat" }
+      });
+      
+      // Update timestamp so we don't nag them again for another 3 days
+      await cache.put('last-seen-online', new Response(now.toString()));
+    }
+  }
+}
+
+var hasRunStartupCheck = false;
+
+self.addEventListener('activate', (event) => {
+  event.waitUntil((async () => {
+    if (hasRunStartupCheck) return; // Skip if already done this session
+    hasRunStartupCheck = true;
+
+    await sendInitialNotifcations();
+    await checkReEngagement();
+  }));
 });

wpstatic/version.json

@@ -1 +1 @@
-{"timestamp":"1770734341854"}
+{"timestamp":"1770736094584"}