@droppii-org/chat-sdk 0.6.55 → 0.6.56

package/dist/components/message/item/QuoteMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuoteMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/QuoteMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAO3D,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,QAAA,MAAM,gBAAgB,GAAI,mCAGvB,qBAAqB,mDAmDvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"QuoteMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/QuoteMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAS3D,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,QAAA,MAAM,gBAAgB,GAAI,mCAGvB,qBAAqB,mDA0EvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/message/item/QuoteMessage.js

@@ -4,6 +4,8 @@ import { useCallback, useMemo } from "react";
 import useAuthStore from "../../../store/auth";
 import useConversationStore from "../../../store/conversation";
 import ReplyQuoteContent from "../../../components/message/reply/ReplyQuoteContent";
+import { useUserUsername } from "../../../hooks/user/useUserUsername";
+import { isSupportSessionAgentView } from "../../../utils/conversation";
 const QuoteMessageItem = ({ message, onPressQuoteMessage, }) => {
     var _a, _b;
     const userID = useAuthStore((state) => state.userID);
@@ -19,7 +21,19 @@ const QuoteMessageItem = ({ message, onPressQuoteMessage, }) => {
             return false;
         }
     }, [conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex]);
+    const quoteMessage = ((_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage) || ((_b = message === null || message === void 0 ? void 0 : message.atTextElem) === null || _b === void 0 ? void 0 : _b.quoteMessage);
+    // Outside CRM, an agent identifies quoted senders by username; the session
+    // owner keeps seeing the thread's own name.
+    const isAgentView = !isCrm && isSupportSessionAgentView(conversationData, userID);
+    const quotedUsername = useUserUsername(isAgentView && (quoteMessage === null || quoteMessage === void 0 ? void 0 : quoteMessage.sendID) !== userID
+        ? quoteMessage === null || quoteMessage === void 0 ? void 0 : quoteMessage.sendID
+        : undefined);
     const getDisplayName = useCallback(({ name, id }) => {
+        if (isAgentView) {
+            if (id === userID)
+                return t("you");
+            return quotedUsername || name || "";
+        }
         if (!name)
             return "";
         if (!isCrm && isChatSupport) {
@@ -28,8 +42,15 @@ const QuoteMessageItem = ({ message, onPressQuoteMessage, }) => {
         if (id === userID)
             return t("you");
         return name;
-    }, [isCrm, isChatSupport, conversationData === null || conversationData === void 0 ? void 0 : conversationData.showName, userID, t]);
-    const quoteMessage = ((_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage) || ((_b = message === null || message === void 0 ? void 0 : message.atTextElem) === null || _b === void 0 ? void 0 : _b.quoteMessage);
+    }, [
+        isAgentView,
+        quotedUsername,
+        isCrm,
+        isChatSupport,
+        conversationData === null || conversationData === void 0 ? void 0 : conversationData.showName,
+        userID,
+        t,
+    ]);
     if (!quoteMessage)
         return null;
     const title = getDisplayName({

package/dist/components/message/item/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,IAAI,eAAe,EAG/B,MAAM,8BAA8B,CAAC;AA+CtC,UAAU,gBAAgB;IACxB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAClD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,2EAA2E;IAC3E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,uEAAuE;IACvE,kBAAkB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,gEAAgE;IAChE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAkCD,QAAA,MAAM,WAAW,GAAI,kSAkBlB,gBAAgB,mDAyYlB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,IAAI,eAAe,EAG/B,MAAM,8BAA8B,CAAC;AA+CtC,UAAU,gBAAgB;IACxB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAClD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,2EAA2E;IAC3E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,uEAAuE;IACvE,kBAAkB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,gEAAgE;IAChE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAkCD,QAAA,MAAM,WAAW,GAAI,kSAkBlB,gBAAgB,mDAsZlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/message/item/index.js

@@ -135,22 +135,35 @@ const MessageItem = ({ message, allMessages, isGroupChat = false, forceHideTip =
     ]);
     const bubbleWrapperRef = useRef(null);
     useLongPress(() => onContextMenuOpenChange === null || onContextMenuOpenChange === void 0 ? void 0 : onContextMenuOpenChange(true), enableLongPress ? bubbleWrapperRef : undefined, { delay: 500 });
+    // Agents outside CRM (e.g. PDP CS) also need to tell the owner apart from
+    // other supporters; only the session owner keeps the anonymous bot view.
+    const isSessionAgentView = isSupportSessionAgentView(conversationData, userID);
     const showSenderInfo = useMemo(() => {
         var _a, _b, _c;
+        if ((message === null || message === void 0 ? void 0 : message.sendID) === userID)
+            return false;
+        if (isSessionAgentView)
+            return true;
         try {
             const isChatSupport = (_c = (_b = (_a = JSON.parse((conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex) || "{}")) === null || _a === void 0 ? void 0 : _a.sessionInfo) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.botId;
-            return Boolean(isChatSupport && isCrm && (message === null || message === void 0 ? void 0 : message.sendID) !== userID);
+            return Boolean(isChatSupport && isCrm);
         }
         catch (_d) {
             console.log("Failed to parse conversationData.ex");
             return false;
         }
-    }, [conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex, isCrm, message === null || message === void 0 ? void 0 : message.sendID, userID]);
+    }, [
+        conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex,
+        isCrm,
+        isSessionAgentView,
+        message === null || message === void 0 ? void 0 : message.sendID,
+        userID,
+    ]);
     const isInternalMessage = Boolean(message === null || message === void 0 ? void 0 : message.isInternal);
     const isSystemLogMessage = isSystemLogMessageType(message === null || message === void 0 ? void 0 : message.contentType);
     const isGroupNotificationMessage = isGroupNotificationMessageType(message === null || message === void 0 ? void 0 : message.contentType);
     const isSessionEvent = isSessionEventMessage(message);
-    const showsSessionEvents = isCrm || isSupportSessionAgentView(conversationData, userID);
+    const showsSessionEvents = isCrm || isSessionAgentView;
     const isStickerMessage = (message === null || message === void 0 ? void 0 : message.contentType) === MessageType.StickerMessage;
     const hasContextMenu = contextMenuItems.length > 0;
     const isLatestMine = ((_a = allMessages.find((m) => m.sendID === userID)) === null || _a === void 0 ? void 0 : _a.clientMsgID) ===

package/dist/components/message/reply/ReplyPreviewBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReplyPreviewBar.d.ts","sourceRoot":"","sources":["../../../../src/components/message/reply/ReplyPreviewBar.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,eAAe,sDAwC3B,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ReplyPreviewBar.d.ts","sourceRoot":"","sources":["../../../../src/components/message/reply/ReplyPreviewBar.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,eAAe,sDAmD3B,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/message/reply/ReplyPreviewBar.js

@@ -3,21 +3,28 @@ import { useTranslation } from "react-i18next";
 import { Icon } from "../../../components/icon";
 import useAuthStore from "../../../store/auth";
 import useConversationStore from "../../../store/conversation";
+import { useUserUsername } from "../../../hooks/user/useUserUsername";
+import { isSupportSessionAgentView } from "../../../utils/conversation";
 import { ReplyQuoteContent } from "./ReplyQuoteContent";
 export const ReplyPreviewBar = () => {
     const { t } = useTranslation();
     const quotedMessage = useConversationStore((state) => state.quotedMessage);
     const setQuotedMessage = useConversationStore((state) => state.setQuotedMessage);
+    const conversationData = useConversationStore((state) => state.conversationData);
     const userID = useAuthStore((state) => state.userID);
+    const isCrm = useAuthStore((state) => state.isCrm);
+    const isMe = (quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.sendID) === userID;
+    // Matches the sent quote's title, which shows agents outside CRM the username.
+    const isAgentView = !isCrm && isSupportSessionAgentView(conversationData, userID);
+    const quotedUsername = useUserUsername(isAgentView && !isMe ? quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.sendID : undefined);
     const handleClearQuotedMessage = () => {
         setQuotedMessage(null);
     };
     if (!quotedMessage)
         return null;
-    const isMe = quotedMessage.sendID === userID;
     const senderName = isMe
         ? t("your_self")
-        : quotedMessage.senderNickname || "";
+        : quotedUsername || quotedMessage.senderNickname || "";
     return (_jsxs("div", { "data-testid": "reply-preview-bar", "data-cp-name": "ReplyPreviewBar", className: "flex h-[59px] w-full shrink-0 items-center bg-gray-200/10 px-2 py-1", children: [_jsx(ReplyQuoteContent, { message: quotedMessage, title: t("reply_to", { name: senderName }) }), _jsx("button", { type: "button", onClick: handleClearQuotedMessage, "aria-label": t("cancel"), "data-testid": "reply-preview-bar-close", className: "flex h-4 w-4 shrink-0 items-center justify-center", children: _jsx(Icon, { icon: "close-o", size: 16, className: "text-gray-600" }) })] }));
 };
 export default ReplyPreviewBar;

package/dist/hooks/user/useUserUsername.d.ts

@@ -0,0 +1,3 @@
+/** Username from the user's public info `ex`; undefined until known. */
+export declare const useUserUsername: (userId?: string) => string | undefined;
+//# sourceMappingURL=useUserUsername.d.ts.map

package/dist/hooks/user/useUserUsername.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUserUsername.d.ts","sourceRoot":"","sources":["../../../src/hooks/user/useUserUsername.ts"],"names":[],"mappings":"AA+BA,wEAAwE;AACxE,eAAO,MAAM,eAAe,GAAI,SAAS,MAAM,KAAG,MAAM,GAAG,SAoB1D,CAAC"}

package/dist/hooks/user/useUserUsername.js

@@ -0,0 +1,49 @@
+"use client";
+import { useEffect } from "react";
+import { DChatSDK } from "../../constants/sdk";
+import { useChatContext } from "../../context/ChatContext";
+import useUsersInfoStore from "../../store/usersInfo";
+import { ConnectStatus } from "../../types/chat";
+// Backoff for a failed/empty lookup, same as the header's owner lookup.
+const RETRY_DELAYS_MS = [2000, 5000, 10000];
+// Quotes of one sender mount together; only one lookup runs per user at a time.
+const pendingUserIds = new Set();
+const loadUserInfo = (userId, attempt = 0) => {
+    DChatSDK.getUsersInfo([userId])
+        .then(({ data }) => {
+        if (!(data === null || data === void 0 ? void 0 : data.length))
+            throw new Error("user not found");
+        useUsersInfoStore.getState().upsertUsers(data);
+        pendingUserIds.delete(userId);
+    })
+        .catch((error) => {
+        const delay = RETRY_DELAYS_MS[attempt];
+        if (delay === undefined) {
+            pendingUserIds.delete(userId);
+            console.error("Error fetching user info:", error);
+            return;
+        }
+        setTimeout(() => loadUserInfo(userId, attempt + 1), delay);
+    });
+};
+/** Username from the user's public info `ex`; undefined until known. */
+export const useUserUsername = (userId) => {
+    var _a, _b, _c;
+    const { connectStatus } = useChatContext();
+    const user = useUsersInfoStore((state) => userId ? state.usersInfo[userId] : undefined);
+    useEffect(() => {
+        if (!userId || user || pendingUserIds.has(userId))
+            return;
+        if (connectStatus !== ConnectStatus.Connected)
+            return;
+        pendingUserIds.add(userId);
+        loadUserInfo(userId);
+    }, [userId, user, connectStatus]);
+    try {
+        const ex = JSON.parse((user === null || user === void 0 ? void 0 : user.ex) || "{}");
+        return ((_c = (_b = (_a = ex === null || ex === void 0 ? void 0 : ex.userInfo) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.username) === null || _c === void 0 ? void 0 : _c.trim()) || undefined;
+    }
+    catch (_d) {
+        return undefined;
+    }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@droppii-org/chat-sdk",
-  "version": "0.6.55",
+  "version": "0.6.56",
   "description": "Droppii React Chat SDK",
   "repository": {
     "type": "git",