@realtimexsco/live-chat 1.4.8 → 1.4.10

package/dist/firebase-messaging-sw.js

@@ -4,15 +4,9 @@
  * /firebase-messaging-sw.js:
  *
  *   cp node_modules/@realtimexsco/live-chat/dist/firebase-messaging-sw.js public/
- *
- * Do NOT edit the Firebase config into this file — the chat package passes it
- * via the registration URL (?config=...), so the copy stays generic.
- *
- * If your app already has its own service worker at the root scope, merge the
- * contents of this file into it instead (two workers cannot share a scope).
  */
 
-/* global firebase, importScripts */
+/* global firebase, importScripts, BroadcastChannel, caches */
 
 importScripts(
   "https://www.gstatic.com/firebasejs/10.14.1/firebase-app-compat.js",
@@ -21,47 +15,37 @@ importScripts(
   "https://www.gstatic.com/firebasejs/10.14.1/firebase-messaging-compat.js",
 );
 
+var PUSH_BROADCAST_CHANNEL = "realtimex-push";
+var NOTIFICATION_CLICK_SW_TYPE = "realtimex:notification-click";
+var PUSH_DATA_CACHE = "realtimex-push-data-v1";
+var TAG_PREFIX = "realtimex-";
+
+/** In-memory fallback when Cache API or FCM click data is empty. */
+var pendingPushDataStore = {};
+
 var params = new URL(self.location.href).searchParams;
 var rawConfig = params.get("config");
 
-if (rawConfig) {
+function parseMaybeJson(value) {
+  if (typeof value !== "string") return value;
   try {
-    var firebaseConfig = JSON.parse(rawConfig);
-
-    firebase.initializeApp(firebaseConfig);
-
-    // Background messages that carry a `notification` payload are displayed
-    // by FCM automatically; initializing messaging here is what enables it.
-    var messaging = firebase.messaging();
-
-    // Log full backend payload when a push arrives in the background.
-    // Check this in DevTools → Application → Service Workers → console,
-    // or Chrome → chrome://serviceworker-internals
-    messaging.onBackgroundMessage(function (payload) {
-      console.log("[realtimex-push] FCM background payload (raw):", payload);
-      console.log("[realtimex-push] FCM background data:", payload && payload.data);
-      console.log(
-        "[realtimex-push] FCM background notification:",
-        payload && payload.notification,
-      );
-    });
-  } catch (error) {
-    console.error("[realtimex] Invalid firebase config in SW URL:", error);
+    return JSON.parse(value);
+  } catch (e) {
+    return value;
   }
-} else {
-  console.warn(
-    "[realtimex] firebase-messaging-sw.js registered without ?config= — " +
-      "push notifications will not be delivered",
-  );
+}
+
+function cacheRequest(path) {
+  return new Request(new URL(path, self.location.origin).toString());
 }
 
 function extractNotificationData(notification) {
   var raw = (notification && notification.data) || {};
+  var fcmMsg = parseMaybeJson(raw.FCM_MSG);
   var nested =
-    raw.FCM_MSG && raw.FCM_MSG.data && typeof raw.FCM_MSG.data === "object"
-      ? raw.FCM_MSG.data
-      : null;
+    fcmMsg && fcmMsg.data && typeof fcmMsg.data === "object" ? fcmMsg.data : null;
   var merged = {};
+
   if (nested) {
     for (var key in nested) {
       if (Object.prototype.hasOwnProperty.call(nested, key)) {
@@ -69,11 +53,13 @@ function extractNotificationData(notification) {
       }
     }
   }
+
   for (var key2 in raw) {
     if (Object.prototype.hasOwnProperty.call(raw, key2) && key2 !== "FCM_MSG") {
       merged[key2] = raw[key2];
     }
   }
+
   return merged;
 }
 
@@ -84,19 +70,29 @@ function resolveConversationId(data) {
       data.conversation_id ||
       data.conversationID ||
       "",
-  );
+  ).trim();
 }
 
-function buildTargetUrl(data, conversationId) {
-  if (data && data.link) return String(data.link);
-
-  if (conversationId) {
-    return "/chat?conversationId=" + encodeURIComponent(conversationId);
-  }
+function buildNotificationTag(data) {
+  return TAG_PREFIX + (data.conversationId || data.messageId || "push");
+}
 
+function buildTargetUrl(data) {
+  if (data && data.link) return String(data.link);
   return "/chat";
 }
 
+function cachePendingOpen(data) {
+  return caches.open(PUSH_DATA_CACHE).then(function (cache) {
+    return cache.put(
+      cacheRequest("pending-open"),
+      new Response(JSON.stringify(data), {
+        headers: { "Content-Type": "application/json" },
+      }),
+    );
+  });
+}
+
 function isChatClient(client) {
   try {
     var pathname = new URL(client.url).pathname || "";
@@ -106,49 +102,316 @@ function isChatClient(client) {
   }
 }
 
-// Focus (or open) the chat and tell the page which conversation to open.
-self.addEventListener("notificationclick", function (event) {
-  event.notification.close();
+function notifyPage(message) {
+  try {
+    var bc = new BroadcastChannel(PUSH_BROADCAST_CHANNEL);
+    bc.postMessage(message);
+    bc.close();
+  } catch (e) {
+    // ignore
+  }
+}
 
-  console.log(
-    "[realtimex-push] notificationclick raw notification.data:",
-    event.notification && event.notification.data,
+function rememberPushData(data) {
+  var messageId = String(data.messageId || data.message_id || "").trim();
+  var conversationId = String(data.conversationId || data.conversation_id || "").trim();
+
+  if (messageId) pendingPushDataStore["msg:" + messageId] = data;
+  if (conversationId) pendingPushDataStore["conv:" + conversationId] = data;
+
+  var keys = Object.keys(pendingPushDataStore);
+  if (keys.length > 40) {
+    keys.slice(0, keys.length - 20).forEach(function (key) {
+      delete pendingPushDataStore[key];
+    });
+  }
+
+  return cachePushData(data);
+}
+
+function recallPushData(data) {
+  var messageId = String(
+    data.messageId || data.message_id || data.messageID || "",
+  ).trim();
+  var conversationId = String(
+    data.conversationId || data.conversation_id || "",
+  ).trim();
+
+  if (messageId && pendingPushDataStore["msg:" + messageId]) {
+    return pendingPushDataStore["msg:" + messageId];
+  }
+  if (conversationId && pendingPushDataStore["conv:" + conversationId]) {
+    return pendingPushDataStore["conv:" + conversationId];
+  }
+  return null;
+}
+
+function cachePushData(data) {
+  var messageId = String(data.messageId || data.message_id || "").trim();
+  var conversationId = String(data.conversationId || data.conversation_id || "").trim();
+  var entries = [];
+  if (messageId) entries.push("push-data/" + messageId);
+  if (conversationId) entries.push("push-data/conv/" + conversationId);
+  if (!entries.length) return Promise.resolve();
+
+  var body = JSON.stringify(data);
+
+  return caches.open(PUSH_DATA_CACHE).then(function (cache) {
+    return Promise.all(
+      entries.map(function (path) {
+        return cache.put(
+          cacheRequest(path),
+          new Response(body, {
+            headers: { "Content-Type": "application/json" },
+          }),
+        );
+      }),
+    );
+  });
+}
+
+function loadCachedPushData(messageId) {
+  var key = String(messageId || "").trim();
+  if (!key) return Promise.resolve(null);
+  return caches
+    .open(PUSH_DATA_CACHE)
+    .then(function (cache) {
+      return cache.match(cacheRequest("push-data/" + key));
+    })
+    .then(function (res) {
+      return res ? res.json() : null;
+    })
+    .catch(function () {
+      return null;
+    });
+}
+
+function loadCachedPushDataByConversationId(conversationId) {
+  var key = String(conversationId || "").trim();
+  if (!key) return Promise.resolve(null);
+  return caches
+    .open(PUSH_DATA_CACHE)
+    .then(function (cache) {
+      return cache.match(cacheRequest("push-data/conv/" + key));
+    })
+    .then(function (res) {
+      return res ? res.json() : null;
+    })
+    .catch(function () {
+      return null;
+    });
+}
+
+function resolveFromNotificationTag(tag) {
+  if (!tag || tag.indexOf(TAG_PREFIX) !== 0) return Promise.resolve(null);
+  var id = tag.slice(TAG_PREFIX.length);
+  if (!id || id === "push") return Promise.resolve(null);
+
+  return loadCachedPushData(id).then(function (cached) {
+    if (cached) return cached;
+    return loadCachedPushDataByConversationId(id);
+  });
+}
+
+function resolveNotificationClickData(data, notification) {
+  var merged = Object.assign({}, data);
+  if (resolveConversationId(merged)) return Promise.resolve(merged);
+
+  var recalled = recallPushData(merged);
+  if (recalled) merged = Object.assign({}, recalled, merged);
+  if (resolveConversationId(merged)) return Promise.resolve(merged);
+
+  var messageId = String(
+    merged.messageId || merged.message_id || merged.messageID || "",
+  ).trim();
+
+  return resolveFromNotificationTag(notification && notification.tag)
+    .then(function (fromTag) {
+      if (fromTag) merged = Object.assign({}, fromTag, merged);
+      if (resolveConversationId(merged)) return merged;
+
+      return loadCachedPushData(messageId).then(function (cached) {
+        if (cached) merged = Object.assign({}, cached, merged);
+        if (resolveConversationId(merged)) return merged;
+
+        return loadCachedPushDataByConversationId(
+          merged.conversationId || merged.conversation_id,
+        ).then(function (byConv) {
+          if (byConv) merged = Object.assign({}, byConv, merged);
+          return merged;
+        });
+      });
+    });
+}
+
+/** Keep only our tagged notification that carries redirect data. */
+function pruneDuplicateNotifications(keepTag) {
+  return self.registration.getNotifications().then(function (notifications) {
+    notifications.forEach(function (n) {
+      var cid = resolveConversationId(extractNotificationData(n));
+      if (n.tag === keepTag && cid) return;
+      if (!cid || n.tag !== keepTag) n.close();
+    });
+  });
+}
+
+/**
+ * One background OS notification with redirect `data`.
+ * Closes FCM auto duplicates that lack click data.
+ */
+function showSingleBackgroundNotification(title, body, data) {
+  var tag = buildNotificationTag(data);
+
+  return rememberPushData(data)
+    .then(function () {
+      return self.registration.getNotifications();
+    })
+    .then(function (notifications) {
+      notifications.forEach(function (n) {
+        n.close();
+      });
+      return self.registration.showNotification(title, {
+        body: body,
+        data: data,
+        tag: tag,
+      });
+    })
+    .then(function () {
+      var delays = [80, 250, 600, 1200];
+      return delays.reduce(function (chain, ms) {
+        return chain.then(function () {
+          return new Promise(function (resolve) {
+            setTimeout(function () {
+              pruneDuplicateNotifications(tag).then(resolve);
+            }, ms);
+          });
+        });
+      }, Promise.resolve());
+    });
+}
+
+if (rawConfig) {
+  try {
+    var firebaseConfig = JSON.parse(rawConfig);
+    firebase.initializeApp(firebaseConfig);
+    var messaging = firebase.messaging();
+
+    messaging.onBackgroundMessage(function (payload) {
+      console.log("[realtimex-push] FCM background payload (raw):", payload);
+      console.log("[realtimex-push] FCM background data:", payload && payload.data);
+
+      return clients
+        .matchAll({ type: "window", includeUncontrolled: true })
+        .then(function (windowClients) {
+          var hasVisibleClient = windowClients.some(function (client) {
+            return client.visibilityState === "visible";
+          });
+          if (hasVisibleClient) {
+            console.log(
+              "[realtimex-push] app visible — skip OS notification (use in-app toast)",
+            );
+            return;
+          }
+
+          var data = payload.data || {};
+          var title =
+            (payload.notification && payload.notification.title) ||
+            data.title ||
+            "New message";
+          var body =
+            (payload.notification && payload.notification.body) ||
+            data.body ||
+            "";
+
+          console.log(
+            "[realtimex-push] single background notification:",
+            data,
+          );
+
+          return showSingleBackgroundNotification(title, body, data);
+        });
+    });
+  } catch (error) {
+    console.error("[realtimex] Invalid firebase config in SW URL:", error);
+  }
+} else {
+  console.warn(
+    "[realtimex] firebase-messaging-sw.js registered without ?config= — " +
+      "push notifications will not be delivered",
   );
+}
 
-  var data = extractNotificationData(event.notification);
+function deliverNotificationClick(data) {
   var conversationId = resolveConversationId(data);
-  var targetUrl = buildTargetUrl(data, conversationId);
+  var targetUrl = buildTargetUrl(data);
   var message = {
-    type: "realtimex:notification-click",
+    type: NOTIFICATION_CLICK_SW_TYPE,
     conversationId: conversationId,
+    data: data,
   };
 
   console.log("[realtimex-push] notificationclick extracted data:", data);
   console.log("[realtimex-push] notificationclick conversationId:", conversationId);
   console.log("[realtimex-push] notificationclick targetUrl:", targetUrl);
 
-  event.waitUntil(
-    clients
-      .matchAll({ type: "window", includeUncontrolled: true })
-      .then(function (windowClients) {
-        var chatClient = null;
-        var anyClient = null;
-
-        for (var i = 0; i < windowClients.length; i++) {
-          var client = windowClients[i];
-          if (!anyClient) anyClient = client;
-          if (!chatClient && isChatClient(client)) chatClient = client;
-        }
-
-        var target = chatClient || anyClient;
-        if (target && "focus" in target) {
-          return target.focus().then(function () {
-            if (target.postMessage) target.postMessage(message);
-          });
-        }
+  if (!conversationId) {
+    console.warn(
+      "[realtimex-push] notificationclick missing conversationId — redirect skipped",
+    );
+    return Promise.resolve();
+  }
 
-        if (clients.openWindow) return clients.openWindow(targetUrl);
-        return undefined;
-      }),
+  return clients
+    .matchAll({ type: "window", includeUncontrolled: true })
+    .then(function (windowClients) {
+      var chatClient = null;
+      var anyClient = null;
+
+      for (var i = 0; i < windowClients.length; i++) {
+        var client = windowClients[i];
+        if (!anyClient) anyClient = client;
+        if (!chatClient && isChatClient(client)) chatClient = client;
+      }
+
+      var target = chatClient || anyClient;
+
+      if (target && "focus" in target) {
+        return target.focus().then(function () {
+          notifyPage(message);
+          if (target.postMessage) target.postMessage(message);
+
+          if (conversationId && !isChatClient(target) && clients.openWindow) {
+            return cachePendingOpen(data).then(function () {
+              return clients.openWindow(targetUrl);
+            });
+          }
+          return undefined;
+        });
+      }
+
+      notifyPage(message);
+      if (clients.openWindow) {
+        return cachePendingOpen(data).then(function () {
+          return clients.openWindow(targetUrl);
+        });
+      }
+      return undefined;
+    });
+}
+
+self.addEventListener("notificationclick", function (event) {
+  event.notification.close();
+
+  console.log(
+    "[realtimex-push] notificationclick raw notification.data:",
+    event.notification && event.notification.data,
+  );
+
+  var rawData = extractNotificationData(event.notification);
+
+  event.waitUntil(
+    resolveNotificationClickData(rawData, event.notification).then(function (data) {
+      return deliverNotificationClick(data);
+    }),
   );
 });