@realtimexsco/live-chat 1.4.6 → 1.4.8

package/dist/firebase-messaging-sw.js

@@ -32,7 +32,19 @@ if (rawConfig) {
 
     // Background messages that carry a `notification` payload are displayed
     // by FCM automatically; initializing messaging here is what enables it.
-    firebase.messaging();
+    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);
   }
@@ -43,24 +55,98 @@ if (rawConfig) {
   );
 }
 
-// Focus (or open) the chat when a notification is clicked.
+function extractNotificationData(notification) {
+  var raw = (notification && notification.data) || {};
+  var nested =
+    raw.FCM_MSG && raw.FCM_MSG.data && typeof raw.FCM_MSG.data === "object"
+      ? raw.FCM_MSG.data
+      : null;
+  var merged = {};
+  if (nested) {
+    for (var key in nested) {
+      if (Object.prototype.hasOwnProperty.call(nested, key)) {
+        merged[key] = nested[key];
+      }
+    }
+  }
+  for (var key2 in raw) {
+    if (Object.prototype.hasOwnProperty.call(raw, key2) && key2 !== "FCM_MSG") {
+      merged[key2] = raw[key2];
+    }
+  }
+  return merged;
+}
+
+function resolveConversationId(data) {
+  if (!data) return "";
+  return String(
+    data.conversationId ||
+      data.conversation_id ||
+      data.conversationID ||
+      "",
+  );
+}
+
+function buildTargetUrl(data, conversationId) {
+  if (data && data.link) return String(data.link);
+
+  if (conversationId) {
+    return "/chat?conversationId=" + encodeURIComponent(conversationId);
+  }
+
+  return "/chat";
+}
+
+function isChatClient(client) {
+  try {
+    var pathname = new URL(client.url).pathname || "";
+    return pathname === "/chat" || pathname.indexOf("/chat/") === 0;
+  } catch (e) {
+    return false;
+  }
+}
+
+// Focus (or open) the chat and tell the page which conversation to open.
 self.addEventListener("notificationclick", function (event) {
   event.notification.close();
 
-  var targetUrl =
-    (event.notification.data &&
-      event.notification.data.FCM_MSG &&
-      event.notification.data.FCM_MSG.data &&
-      event.notification.data.FCM_MSG.data.link) ||
-    "/";
+  console.log(
+    "[realtimex-push] notificationclick raw notification.data:",
+    event.notification && event.notification.data,
+  );
+
+  var data = extractNotificationData(event.notification);
+  var conversationId = resolveConversationId(data);
+  var targetUrl = buildTargetUrl(data, conversationId);
+  var message = {
+    type: "realtimex:notification-click",
+    conversationId: conversationId,
+  };
+
+  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++) {
-          if ("focus" in windowClients[i]) return windowClients[i].focus();
+          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 (clients.openWindow) return clients.openWindow(targetUrl);
         return undefined;
       }),

package/dist/index.cjs

@@ -16,7 +16,7 @@ var lucideReact = require('lucide-react');
 var classVarianceAuthority = require('class-variance-authority');
 var EmojiPicker = require('emoji-picker-react');
 var reactDayPicker = require('react-day-picker');
-var reactHotToast = require('react-hot-toast');
+var toast2 = require('react-hot-toast');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -41,6 +41,7 @@ function _interopNamespace(e) {
 var axios__default = /*#__PURE__*/_interopDefault(axios);
 var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
 var EmojiPicker__default = /*#__PURE__*/_interopDefault(EmojiPicker);
+var toast2__default = /*#__PURE__*/_interopDefault(toast2);
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -4653,6 +4654,127 @@ var Chat = ({
 // src/hooks/useChatController.ts
 init_useStore();
 init_store_helpers();
+
+// src/notifications/open-conversation.ts
+init_store_helpers();
+var OPEN_CONVERSATION_EVENT = "realtimex:open-conversation";
+var NOTIFICATION_CLICK_SW_TYPE = "realtimex:notification-click";
+var PENDING_STORAGE_KEY = "realtimex:pending-open-conversation";
+var resolveConversationIdFromPushData = (data) => {
+  if (!data || typeof data !== "object") return "";
+  const nested = data.FCM_MSG && typeof data.FCM_MSG === "object" ? data.FCM_MSG.data : void 0;
+  const source = { ...nested || {}, ...data };
+  return String(
+    source.conversationId || source.conversation_id || source.conversationID || ""
+  );
+};
+var peekPendingOpenConversation = () => {
+  try {
+    return sessionStorage.getItem(PENDING_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+};
+var consumePendingOpenConversation = () => {
+  const id = peekPendingOpenConversation();
+  try {
+    sessionStorage.removeItem(PENDING_STORAGE_KEY);
+  } catch {
+  }
+  return id;
+};
+var requestOpenConversation = (conversationId) => {
+  const id = String(conversationId || "").trim();
+  if (!id) return;
+  try {
+    sessionStorage.setItem(PENDING_STORAGE_KEY, id);
+  } catch {
+  }
+  try {
+    window.dispatchEvent(
+      new CustomEvent(OPEN_CONVERSATION_EVENT, {
+        detail: { conversationId: id }
+      })
+    );
+  } catch {
+  }
+};
+var mapConversationToChannel = (conversation, loggedUserId, allUsers) => {
+  const conversationId = String(conversation?._id || conversation?.id || "");
+  const isGroup = isGroupConversation(conversation);
+  if (isGroup) {
+    const rawName2 = conversation.groupName || conversation.name || "Group Chat";
+    return {
+      id: conversationId,
+      conversationId,
+      name: rawName2.charAt(0).toUpperCase() + rawName2.slice(1),
+      image: resolveGroupImage(conversation),
+      isGroup: true,
+      isLeft: !!conversation.isLeft,
+      isBlocked: !!conversation.isBlocked,
+      pinnedCount: conversation.pinnedCount,
+      starredCount: conversation.starredCount
+    };
+  }
+  const { id: otherId, user } = resolveOtherParticipant(
+    conversation,
+    loggedUserId,
+    allUsers
+  );
+  const rawName = user?.name || "Unknown User";
+  return {
+    id: otherId || conversationId,
+    conversationId,
+    name: rawName.charAt(0).toUpperCase() + rawName.slice(1),
+    image: user?.image || void 0,
+    email: user?.email,
+    isGroup: false,
+    isLeft: !!conversation.isLeft,
+    isBlocked: !!conversation.isBlocked,
+    pinnedCount: conversation.pinnedCount,
+    starredCount: conversation.starredCount
+  };
+};
+var readConversationIdFromLocation = () => {
+  try {
+    return new URLSearchParams(window.location.search).get("conversationId") || "";
+  } catch {
+    return "";
+  }
+};
+var consumedUrlConversationIds = /* @__PURE__ */ new Set();
+var installNotificationClickBridge = (options = {}) => {
+  if (typeof window === "undefined") return () => void 0;
+  const chatPath = options.chatPath || "/chat";
+  const handleOpen = (conversationId) => {
+    const id = String(conversationId || "").trim();
+    if (!id) return;
+    requestOpenConversation(id);
+    const pathWithQuery = `${chatPath}?conversationId=${encodeURIComponent(id)}`;
+    options.onNavigate?.(id, pathWithQuery);
+  };
+  const onSwMessage = (event) => {
+    const data = event.data;
+    console.log("[realtimex-push] SW \u2192 page message:", data);
+    if (!data || data.type !== NOTIFICATION_CLICK_SW_TYPE) return;
+    console.log(
+      "[realtimex-push] notification click conversationId:",
+      data.conversationId
+    );
+    handleOpen(String(data.conversationId || ""));
+  };
+  navigator.serviceWorker?.addEventListener("message", onSwMessage);
+  const fromUrl = readConversationIdFromLocation();
+  if (fromUrl && !consumedUrlConversationIds.has(fromUrl)) {
+    consumedUrlConversationIds.add(fromUrl);
+    handleOpen(fromUrl);
+  }
+  return () => {
+    navigator.serviceWorker?.removeEventListener("message", onSwMessage);
+  };
+};
+
+// src/hooks/useChatController.ts
 function resolveMessageType(content, attachments) {
   if (attachments.length === 0) return "text";
   if (!content.trim() && attachments.length === 1) {
@@ -4725,6 +4847,10 @@ var useChatController = () => {
   const lastDM = exports.useChatStore((s) => s.lastDM);
   const loggedUserDetails = exports.useChatStore((s) => s.loggedUserDetails);
   const rateLimitResetAt2 = exports.useChatStore((s) => s.rateLimitResetAt);
+  const allUsers = exports.useChatStore((s) => s.allUsers);
+  const isFetchingConversations = exports.useChatStore((s) => s.isFetchingConversations);
+  const conversations = exports.useChatStore((s) => s.conversations);
+  const [pendingOpenConversationId, setPendingOpenConversationId] = React2.useState(() => peekPendingOpenConversation());
   const conversationsLength = exports.useChatStore(
     (s) => state.activeChannel?.conversationId ? 0 : s.conversations.length
   );
@@ -4753,6 +4879,73 @@ var useChatController = () => {
       isGroupConversation(latestInfo)
     ].join("|");
   });
+  React2.useEffect(() => {
+    const onOpen = (event) => {
+      const id = String(
+        event.detail?.conversationId || ""
+      ).trim();
+      if (id) setPendingOpenConversationId(id);
+    };
+    window.addEventListener(OPEN_CONVERSATION_EVENT, onOpen);
+    return () => window.removeEventListener(OPEN_CONVERSATION_EVENT, onOpen);
+  }, []);
+  React2.useEffect(() => {
+    if (!pendingOpenConversationId || !loggedUserDetails) return;
+    let cancelled = false;
+    const openPending = async () => {
+      const targetId = String(pendingOpenConversationId);
+      let conversation = conversations.find(
+        (c) => String(c._id || c.id) === targetId
+      ) || null;
+      if (!conversation) {
+        const fromInfo = conversationInfos[targetId];
+        if (fromInfo) conversation = fromInfo;
+      }
+      if (!conversation) {
+        if (isFetchingConversations) return;
+        try {
+          await fetchConversationInfo2(targetId);
+        } catch {
+          return;
+        }
+        if (cancelled) return;
+        const stateNow = exports.useChatStore.getState();
+        conversation = stateNow.conversations.find(
+          (c) => String(c._id || c.id) === targetId
+        ) || stateNow.conversationInfos[targetId] || null;
+      }
+      if (!conversation || cancelled) return;
+      const channel = mapConversationToChannel(
+        conversation,
+        loggedUserDetails._id,
+        allUsers
+      );
+      setState((prev) => {
+        if (prev.activeChannel?.conversationId && String(prev.activeChannel.conversationId) === targetId) {
+          return prev;
+        }
+        return {
+          ...prev,
+          activeChannel: channel,
+          activeConversationId: targetId
+        };
+      });
+      consumePendingOpenConversation();
+      setPendingOpenConversationId(null);
+    };
+    void openPending();
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    pendingOpenConversationId,
+    loggedUserDetails,
+    conversations,
+    conversationInfos,
+    isFetchingConversations,
+    allUsers,
+    fetchConversationInfo2
+  ]);
   React2.useEffect(() => {
     const handler = setTimeout(() => {
       updateState({ debouncedSearch: state.searchQuery });
@@ -17389,19 +17582,19 @@ var showNotification = (message, type = "info", icon, duration) => {
   };
   switch (type) {
     case "success":
-      reactHotToast.toast.success(message, options);
+      toast2.toast.success(message, options);
       break;
     case "error":
-      reactHotToast.toast.error(message, options);
+      toast2.toast.error(message, options);
       break;
     case "info":
-      reactHotToast.toast(message, options);
+      toast2.toast(message, options);
       break;
     case "warning":
-      reactHotToast.toast(message, { ...options, icon: "\u26A0\uFE0F" });
+      toast2.toast(message, { ...options, icon: "\u26A0\uFE0F" });
       break;
     default:
-      reactHotToast.toast(message, options);
+      toast2.toast(message, options);
   }
 };
 var downloadFile = async (src, name) => {
@@ -17610,6 +17803,9 @@ var onForegroundPush = async (callback) => {
   }
   const { fb, messaging } = await getFirebaseMessaging(config.firebaseConfig);
   return fb.onMessage(messaging, (payload) => {
+    console.log("[realtimex-push] FCM foreground payload (raw):", payload);
+    console.log("[realtimex-push] FCM foreground data:", payload?.data);
+    console.log("[realtimex-push] FCM foreground notification:", payload?.notification);
     callback({
       title: payload?.notification?.title,
       body: payload?.notification?.body,
@@ -17630,9 +17826,6 @@ var rememberToastId = (id) => {
   }
   return true;
 };
-var resolveIncomingConversationId = (data) => String(
-  data?.conversationId || data?.conversation_id || data?.conversationID || ""
-);
 var resolveToastText = (title, body) => {
   if (title && body) return `${title}: ${body}`;
   return title || body || "";
@@ -17642,7 +17835,39 @@ var emitToast = (payload, onPush) => {
   const title = payload.title || payload.data?.title;
   const body = payload.body || payload.data?.body || payload.data?.message;
   const text = resolveToastText(title, body);
-  if (text) showNotification(text, "info");
+  const conversationId = resolveConversationIdFromPushData(payload.data);
+  if (!text) return;
+  if (conversationId) {
+    toast2__default.default.custom(
+      (t) => /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            toast2__default.default.dismiss(t.id);
+            requestOpenConversation(conversationId);
+          },
+          style: {
+            display: "block",
+            width: "100%",
+            textAlign: "left",
+            cursor: "pointer",
+            background: "var(--background, #fff)",
+            color: "var(--foreground, #111)",
+            border: "1px solid rgba(0,0,0,0.08)",
+            borderRadius: 8,
+            padding: "10px 14px",
+            boxShadow: "0 4px 12px rgba(0,0,0,0.12)",
+            font: "inherit"
+          },
+          children: text
+        }
+      ),
+      { duration: 5e3 }
+    );
+    return;
+  }
+  showNotification(text, "info");
 };
 var ForegroundPushBridge = ({ onPush }) => {
   const lastDM = exports.useChatStore((s) => s.lastDM);
@@ -17693,22 +17918,29 @@ var ForegroundPushBridge = ({ onPush }) => {
     let retryTimer = null;
     let cancelled = false;
     const handlePayload = (payload) => {
-      const incoming = resolveIncomingConversationId(payload.data);
+      console.log("[realtimex-push] ForegroundPushBridge payload:", payload);
+      console.log("[realtimex-push] ForegroundPushBridge data keys:", payload.data);
+      const incoming = resolveConversationIdFromPushData(payload.data);
       const activeId = String(
         exports.useChatStore.getState().activeConversationId || ""
       );
       const messageId2 = String(
         payload.data?.messageId || payload.data?.message_id || payload.data?.messageID || ""
       );
+      console.log("[realtimex-push] resolved from backend data:", {
+        conversationId: incoming,
+        messageId: messageId2,
+        activeConversationId: activeId
+      });
       if (incoming && activeId && incoming === activeId) {
-        console.debug(
+        console.log(
           "[realtimex-push] foreground push suppressed (conversation open):",
           incoming
         );
         return;
       }
       if (!rememberToastId(messageId2)) return;
-      console.debug("[realtimex-push] foreground push \u2192 toast:", {
+      console.log("[realtimex-push] foreground push \u2192 toast:", {
         title: payload.title,
         conversationId: incoming,
         activeConversationId: activeId
@@ -17757,8 +17989,20 @@ var ForegroundPushBridge = ({ onPush }) => {
       window.removeEventListener(PUSH_CHANGED_EVENT, onPushChanged);
     };
   }, []);
+  React2.useEffect(() => {
+    const onOpen = (event) => {
+      const id = String(
+        event.detail?.conversationId || ""
+      );
+      if (id) {
+        console.debug("[realtimex-push] open-conversation event:", id);
+      }
+    };
+    window.addEventListener(OPEN_CONVERSATION_EVENT, onOpen);
+    return () => window.removeEventListener(OPEN_CONVERSATION_EVENT, onOpen);
+  }, []);
   return /* @__PURE__ */ jsxRuntime.jsx(
-    reactHotToast.Toaster,
+    toast2.Toaster,
     {
       position: "top-right",
       toastOptions: { duration: 4e3 },
@@ -18251,6 +18495,8 @@ exports.LoggedUserDetails = LoggedUserDetails_default;
 exports.MessageInput = ChannelMessageBoxView_default;
 exports.MessageItem = MessageItemView;
 exports.MessageList = ActiveChannelMessagesView_default;
+exports.NOTIFICATION_CLICK_SW_TYPE = NOTIFICATION_CLICK_SW_TYPE;
+exports.OPEN_CONVERSATION_EVENT = OPEN_CONVERSATION_EVENT;
 exports.PUSH_CHANGED_EVENT = PUSH_CHANGED_EVENT;
 exports.PushNotificationToggle = PushNotificationToggle;
 exports.apiGetPushConfig = apiGetPushConfig;
@@ -18260,6 +18506,7 @@ exports.apiRemovePushToken = apiRemovePushToken;
 exports.apiUpdatePushPreference = apiUpdatePushPreference;
 exports.capitalizeFirst = capitalizeFirst;
 exports.clampJumpDate = clampJumpDate;
+exports.consumePendingOpenConversation = consumePendingOpenConversation;
 exports.default = index_default;
 exports.defaultChatClassNames = defaultChatClassNames;
 exports.defaultChatComponents = defaultChatComponents;
@@ -18272,14 +18519,18 @@ exports.getFirstAndLastNameOneCharacter = getFirstAndLastNameOneCharacter;
 exports.getResponsiveWidth = getResponsiveWidth;
 exports.getSocketConfig = getSocketConfig;
 exports.getStoredPushToken = getStoredPushToken;
+exports.installNotificationClickBridge = installNotificationClickBridge;
 exports.isEmpty = isEmpty;
 exports.isPushSupported = isPushSupported;
 exports.mergeChatCustomization = mergeChatCustomization;
 exports.mergeChatLayoutConfig = mergeChatLayoutConfig;
 exports.onForegroundPush = onForegroundPush;
 exports.packageDefaultComponents = packageDefaultComponents;
+exports.peekPendingOpenConversation = peekPendingOpenConversation;
+exports.requestOpenConversation = requestOpenConversation;
 exports.resolveApiUrl = resolveApiUrl;
 exports.resolveChatApiKey = resolveChatApiKey;
+exports.resolveConversationIdFromPushData = resolveConversationIdFromPushData;
 exports.resolveJumpDateBounds = resolveJumpDateBounds;
 exports.resolveJumpPreset = resolveJumpPreset;
 exports.resolveJumpStep = resolveJumpStep;