@droppii-org/chat-sdk 0.1.15 → 0.1.17

package/dist/assets/svg/cannedResponse.tsx

@@ -1,48 +1,48 @@
-interface ISvgProps {
-  size?: number;
-  className?: string;
-}
-
-const CannedResponseIcon = (props: ISvgProps) => (
-  <svg
-    width={props.size || 18}
-    height={props.size || 18}
-    viewBox={`${0} ${0} ${props.size || 18} ${props.size || 18}`}
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={props?.className}
-  >
-    <g clipPath="url(#clip0_4070_70030)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M6.66732 0.833374C7.12755 0.833374 7.50065 1.20647 7.50065 1.66671L5.00065 18.3334C5.00065 18.7936 4.62755 19.1667 4.16732 19.1667C3.70708 19.1667 3.33398 18.7936 3.33398 18.3334L5.83398 1.66671C5.83398 1.20647 6.20708 0.833374 6.66732 0.833374Z"
-        fill="currentColor"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M14.9993 0.833374C15.4596 0.833374 15.8327 1.20647 15.8327 1.66671L13.3327 18.3334C13.3327 18.7936 12.9596 19.1667 12.4993 19.1667C12.0391 19.1667 11.666 18.7936 11.666 18.3334L14.166 1.66671C14.166 1.20647 14.5391 0.833374 14.9993 0.833374Z"
-        fill="currentColor"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M19.1673 5.83333C19.1673 6.29357 18.7942 6.66667 18.334 6.66667H1.66732C1.20708 6.66667 0.833984 6.29357 0.833984 5.83333C0.833984 5.37309 1.20708 5 1.66732 5H18.334C18.7942 5 19.1673 5.3731 19.1673 5.83333Z"
-        fill="currentColor"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M19.1673 14.1667C19.1673 14.627 18.7942 15 18.334 15H1.66732C1.20708 15 0.833984 14.627 0.833984 14.1667C0.833984 13.7065 1.20708 13.3334 1.66732 13.3334H18.334C18.7942 13.3334 19.1673 13.7065 19.1673 14.1667Z"
-        fill="currentColor"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_4070_70030">
-        <rect width={props.size || 18} height={props.size || 18} fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
-export default CannedResponseIcon;
+interface ISvgProps {
+  size?: number;
+  className?: string;
+}
+
+const CannedResponseIcon = (props: ISvgProps) => (
+  <svg
+    width={props.size || 18}
+    height={props.size || 18}
+    viewBox={`${0} ${0} ${props.size || 18} ${props.size || 18}`}
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    className={props?.className}
+  >
+    <g clipPath="url(#clip0_4070_70030)">
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6.66732 0.833374C7.12755 0.833374 7.50065 1.20647 7.50065 1.66671L5.00065 18.3334C5.00065 18.7936 4.62755 19.1667 4.16732 19.1667C3.70708 19.1667 3.33398 18.7936 3.33398 18.3334L5.83398 1.66671C5.83398 1.20647 6.20708 0.833374 6.66732 0.833374Z"
+        fill="currentColor"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M14.9993 0.833374C15.4596 0.833374 15.8327 1.20647 15.8327 1.66671L13.3327 18.3334C13.3327 18.7936 12.9596 19.1667 12.4993 19.1667C12.0391 19.1667 11.666 18.7936 11.666 18.3334L14.166 1.66671C14.166 1.20647 14.5391 0.833374 14.9993 0.833374Z"
+        fill="currentColor"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M19.1673 5.83333C19.1673 6.29357 18.7942 6.66667 18.334 6.66667H1.66732C1.20708 6.66667 0.833984 6.29357 0.833984 5.83333C0.833984 5.37309 1.20708 5 1.66732 5H18.334C18.7942 5 19.1673 5.3731 19.1673 5.83333Z"
+        fill="currentColor"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M19.1673 14.1667C19.1673 14.627 18.7942 15 18.334 15H1.66732C1.20708 15 0.833984 14.627 0.833984 14.1667C0.833984 13.7065 1.20708 13.3334 1.66732 13.3334H18.334C18.7942 13.3334 19.1673 13.7065 19.1673 14.1667Z"
+        fill="currentColor"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_4070_70030">
+        <rect width={props.size || 18} height={props.size || 18} fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+export default CannedResponseIcon;

package/dist/assets/svg/document.tsx

@@ -1,37 +1,37 @@
-export const documentIcon = (
-  <svg
-    width="40"
-    height="40"
-    viewBox="0 0 40 40"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      d="M10.1923 5.83301L23.4363 5.83301L34.1656 14.2054V29.8639C34.1656 31.8997 32.5286 34.1663 29.8068 34.1663C27.0849 34.1663 10.1923 34.1663 10.1923 34.1663C7.4704 34.1663 5.8335 31.8997 5.8335 29.8639V10.0305C5.8335 7.99475 7.4704 5.83301 10.1923 5.83301Z"
-      fill="#24B0FF"
-    ></path>
-    <path
-      d="M10.8335 28.1394V20.833H16.0309V22.4222H12.7026V23.5916H15.3612V25.1708H12.7026V28.1394H10.8335Z"
-      fill="#edf6ff"
-    ></path>
-    <path
-      d="M19.0073 28.0885V20.833H20.8613V26.5118H24.0146V28.0885L19.0073 28.0885Z"
-      fill="#edf6ff"
-    ></path>
-    <path
-      d="M16.5918 28.1001V20.833H18.4485V28.1001H16.5918Z"
-      fill="#edf6ff"
-    ></path>
-    <path
-      d="M24.5737 20.833V28.1393H29.7723V26.5573H26.439L26.4422 25.1708H29.1017V23.5916H26.4422V22.4222H29.7723V20.833H24.5737Z"
-      fill="#edf6ff"
-    ></path>
-    <path
-      opacity="0.302"
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M23.2686 5.83301V14.2281H34.1655L23.2686 5.83301Z"
-      fill="#edf6ff"
-    ></path>
-  </svg>
-);
+export const documentIcon = (
+  <svg
+    width="40"
+    height="40"
+    viewBox="0 0 40 40"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M10.1923 5.83301L23.4363 5.83301L34.1656 14.2054V29.8639C34.1656 31.8997 32.5286 34.1663 29.8068 34.1663C27.0849 34.1663 10.1923 34.1663 10.1923 34.1663C7.4704 34.1663 5.8335 31.8997 5.8335 29.8639V10.0305C5.8335 7.99475 7.4704 5.83301 10.1923 5.83301Z"
+      fill="#24B0FF"
+    ></path>
+    <path
+      d="M10.8335 28.1394V20.833H16.0309V22.4222H12.7026V23.5916H15.3612V25.1708H12.7026V28.1394H10.8335Z"
+      fill="#edf6ff"
+    ></path>
+    <path
+      d="M19.0073 28.0885V20.833H20.8613V26.5118H24.0146V28.0885L19.0073 28.0885Z"
+      fill="#edf6ff"
+    ></path>
+    <path
+      d="M16.5918 28.1001V20.833H18.4485V28.1001H16.5918Z"
+      fill="#edf6ff"
+    ></path>
+    <path
+      d="M24.5737 20.833V28.1393H29.7723V26.5573H26.439L26.4422 25.1708H29.1017V23.5916H26.4422V22.4222H29.7723V20.833H24.5737Z"
+      fill="#edf6ff"
+    ></path>
+    <path
+      opacity="0.302"
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M23.2686 5.83301V14.2281H34.1655L23.2686 5.83301Z"
+      fill="#edf6ff"
+    ></path>
+  </svg>
+);

package/dist/assets/svg/index.ts

@@ -1,2 +1,2 @@
-export * from "./document";
-export * from "./cannedResponse";
+export * from "./document";
+export * from "./cannedResponse";

package/dist/components/message/GroupMembersDrawer.d.ts

@@ -0,0 +1,7 @@
+interface GroupMembersDrawerProps {
+    groupID?: string;
+    disabled?: boolean;
+}
+declare const GroupMembersDrawer: ({ groupID, disabled, }: GroupMembersDrawerProps) => import("react/jsx-runtime").JSX.Element;
+export default GroupMembersDrawer;
+//# sourceMappingURL=GroupMembersDrawer.d.ts.map

package/dist/components/message/GroupMembersDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupMembersDrawer.d.ts","sourceRoot":"","sources":["../../../src/components/message/GroupMembersDrawer.tsx"],"names":[],"mappings":"AAUA,UAAU,uBAAuB;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAsCD,QAAA,MAAM,kBAAkB,GAAI,wBAGzB,uBAAuB,4CAwLzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/message/GroupMembersDrawer.js

@@ -0,0 +1,104 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { GroupMemberRole } from "@openim/wasm-client-sdk";
+import { Avatar, Button, Drawer, Dropdown, Empty, Spin } from "antd";
+import { useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import useAuthStore from "../../store/auth";
+import useConversationStore from "../../store/conversation";
+import { useGroupMembers } from "../../hooks/group/useGroupMembers";
+import { Icon } from "../icon";
+const getMemberDisplayName = (member) => {
+    return member.nickname || member.userID || "";
+};
+const getMemberRoleLabel = ({ member, customerUserID, t, }) => {
+    if (member.userID === customerUserID ||
+        member.roleLevel === GroupMemberRole.Owner) {
+        return t("group_creator");
+    }
+    if (member.roleLevel === GroupMemberRole.Admin) {
+        return t("group_admin");
+    }
+    return t("group_member");
+};
+const GroupMembersDrawer = ({ groupID, disabled = false, }) => {
+    var _a, _b;
+    const { t } = useTranslation();
+    const [isOpen, setIsOpen] = useState(false);
+    const authUserID = useAuthStore((state) => state.userID);
+    const conversationData = useConversationStore((state) => state.conversationData);
+    const { members, isLoading, error } = useGroupMembers(groupID);
+    let customerUserID = "";
+    try {
+        const exConversationInfo = JSON.parse((conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex) || "{}");
+        customerUserID = ((_b = (_a = exConversationInfo === null || exConversationInfo === void 0 ? void 0 : exConversationInfo.sessionInfo) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.ownerId) || "";
+    }
+    catch (error) {
+        console.error("Error parsing conversation extra info:", error);
+    }
+    const sortedMembers = useMemo(() => {
+        return [...members]
+            .map((member) => ({
+            userID: member.userID,
+            nickname: getMemberDisplayName(member),
+            faceURL: member.faceURL,
+            isCustomer: Boolean(customerUserID) && member.userID === customerUserID,
+            isCurrentUser: member.userID === authUserID,
+            roleLabel: getMemberRoleLabel({
+                member,
+                customerUserID,
+                t,
+            }),
+        }))
+            .sort((memberA, memberB) => {
+            if (memberA.isCustomer !== memberB.isCustomer) {
+                return memberA.isCustomer ? -1 : 1;
+            }
+            return memberA.nickname.localeCompare(memberB.nickname, "vi", {
+                sensitivity: "base",
+            });
+        });
+    }, [authUserID, members, customerUserID, t]);
+    const handleOpenDrawer = () => {
+        if (!groupID || disabled) {
+            return;
+        }
+        setIsOpen(true);
+    };
+    const handleCloseDrawer = () => {
+        setIsOpen(false);
+    };
+    const handleLeaveGroup = () => { };
+    useEffect(() => {
+        setIsOpen(false);
+    }, [groupID]);
+    const renderContent = () => {
+        if (isLoading) {
+            return (_jsx("div", { className: "flex items-center justify-center h-full min-h-40", children: _jsx(Spin, {}) }));
+        }
+        if (error) {
+            return (_jsx("div", { className: "flex items-center justify-center h-full min-h-40 px-6 text-center text-sm text-gray-500", children: t(error) }));
+        }
+        if (!sortedMembers.length) {
+            return _jsx(Empty, { description: t("no_group_members") });
+        }
+        return (_jsx("div", { className: "flex flex-col", children: sortedMembers.map((member) => {
+                const menuItems = [
+                    {
+                        key: "leave-group",
+                        label: t("leave_group"),
+                        icon: _jsx(Icon, { icon: "logout-b", size: 16 }),
+                        onClick: handleLeaveGroup,
+                        danger: true,
+                    },
+                ];
+                return (_jsxs("div", { className: "flex items-center gap-3 px-4 py-3 border-b border-gray-100", children: [_jsx(Avatar, { src: member.faceURL, size: 40, className: "shrink-0", children: member.nickname.charAt(0) || "A" }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx("p", { className: "text-sm font-medium text-gray-900 truncate", children: member.nickname }), member.isCurrentUser && (_jsx("span", { className: "text-xs text-blue-500 shrink-0", children: t("current_account") }))] }), _jsx("p", { className: "text-sm text-gray-500 truncate", children: member.roleLabel })] }), member.isCurrentUser && (_jsx(Dropdown, { menu: { items: menuItems }, trigger: ["click"], placement: "bottomRight", children: _jsx("button", { type: "button", className: "flex items-center justify-center w-8 h-8 rounded-full text-gray-500 hover:bg-gray-100", onClick: (event) => event.stopPropagation(), children: _jsx(Icon, { icon: "more-horizontal-b", size: 18 }) }) }))] }, member.userID));
+            }) }));
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleOpenDrawer, disabled: disabled || !groupID, children: _jsx(Icon, { icon: "user-two-check-b", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: handleCloseDrawer, mask: false, closeIcon: false, styles: {
+                    body: {
+                        padding: 0,
+                        height: "100%",
+                    },
+                }, getContainer: false, width: 360, children: _jsxs("div", { className: "flex flex-col h-full bg-white", children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-100", children: [_jsx("span", { className: "text-lg font-medium", children: t("members") }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleCloseDrawer, children: _jsx(Icon, { icon: "close-b", size: 22 }) })] }), _jsx("div", { className: "flex-1 overflow-y-auto", children: renderContent() })] }) })] }));
+};
+export default GroupMembersDrawer;

package/dist/components/message/MessageHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAKnD,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,gBAAgB,CAAC;CACnC;AAED,KAAK,sBAAsB,GAAG,aAAa,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,sBAAsB,CAAC;IAC9B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED,QAAA,MAAM,aAAa,GAAI,6BAA6B,kBAAkB,4CAoMrE,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAOnD,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,gBAAgB,CAAC;CACnC;AAED,KAAK,sBAAsB,GAAG,aAAa,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,sBAAsB,CAAC;IAC9B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED,QAAA,MAAM,aAAa,GAAI,6BAA6B,kBAAkB,4CA0MrE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/message/MessageHeader.js

@@ -12,7 +12,9 @@ import SelectSession from "./SelectSession";
 import { useUpdateSession } from "../../hooks/session/useUpdateSession";
 import useAuthStore from "../../store/auth";
 import SearchDrawer from "../searchConversation/SearchDrawer";
+import { useIsJoinedGroup } from "../../hooks/session/useIsJoinedGroup";
 import { isGroupSession } from "../../utils/imCommon";
+import GroupMembersDrawer from "./GroupMembersDrawer";
 const MessageHeader = ({ onClose, currentSession }) => {
     var _a, _b;
     const { t } = useTranslation();
@@ -22,6 +24,7 @@ const MessageHeader = ({ onClose, currentSession }) => {
     const { mutate: updateSession } = useUpdateSession();
     const { avatar, displayName } = useConversationDisplayData(conversationData);
     const shouldShowMemberCount = isGroupSession(conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationType);
+    const { isJoined } = useIsJoinedGroup(conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID);
     const [currentSessionStatus, setCurrentSessionStatus] = useState(SessionStatus.UNASSIGNED);
     const [currentSessionTag, setCurrentSessionTag] = useState(SessionTag.NONE);
     const statusOptions = useMemo(() => {
@@ -125,6 +128,6 @@ const MessageHeader = ({ onClose, currentSession }) => {
             setCurrentSessionStatus(currentSession.status);
         }
     }, [currentSession]);
-    return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3 bg-white flex-wrap", children: [_jsx(Avatar, { src: avatar, size: "large", className: "min-w-10 min-h-10", children: ((_a = displayName === null || displayName === void 0 ? void 0 : displayName.charAt) === null || _a === void 0 ? void 0 : _a.call(displayName, 0)) || "A" }), _jsxs("div", { className: "flex flex-col overflow-hidden flex-1", children: [_jsx("p", { className: "text-base truncate", children: displayName || "" }), shouldShowMemberCount && (_jsx("p", { className: "text-xs text-gray-500 truncate", children: t("member_count", { count: (_b = currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.memberCount) !== null && _b !== void 0 ? _b : 0 }) }))] }), _jsxs("div", { className: "flex items-center gap-2 justify-end overflow-hidden", children: [isCx && (_jsx(SelectSession, { placeholder: t("select_tag"), options: tagOptions, value: currentSessionTag, onChange: (value) => handleUpdateSession(value, "tag", value === currentSessionTag), excludeOptions: [SessionTag.SLOW_PROCESSING, SessionTag.NONE] })), isCx && (_jsx(SelectSession, { placeholder: t("select_status"), options: statusOptions, value: currentSessionStatus, onChange: (value) => handleUpdateSession(value, "status", value === currentSessionStatus) })), _jsx(SearchDrawer, {}), _jsx(MediaCollection, {}), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", children: _jsx(Icon, { icon: "align-justify-o", size: 22 }) }), !!onClose && (_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onClose, children: _jsx(Icon, { icon: "close-b", size: 22 }) }))] })] }));
+    return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3 bg-white flex-wrap", children: [_jsx(Avatar, { src: avatar, size: "large", className: "min-w-10 min-h-10", children: ((_a = displayName === null || displayName === void 0 ? void 0 : displayName.charAt) === null || _a === void 0 ? void 0 : _a.call(displayName, 0)) || "A" }), _jsxs("div", { className: "flex flex-col overflow-hidden flex-1", children: [_jsx("p", { className: "text-base truncate", children: displayName || "" }), shouldShowMemberCount && (_jsx("p", { className: "text-xs text-gray-500 truncate", children: t("member_count", { count: (_b = currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.memberCount) !== null && _b !== void 0 ? _b : 0 }) }))] }), _jsxs("div", { className: "flex items-center gap-2 justify-end overflow-hidden", children: [isCx && (_jsx(SelectSession, { placeholder: t("select_tag"), options: tagOptions, value: currentSessionTag, onChange: (value) => handleUpdateSession(value, "tag", value === currentSessionTag), excludeOptions: [SessionTag.SLOW_PROCESSING, SessionTag.NONE] })), isCx && (_jsx(SelectSession, { placeholder: t("select_status"), options: statusOptions, value: currentSessionStatus, onChange: (value) => handleUpdateSession(value, "status", value === currentSessionStatus) })), _jsx(SearchDrawer, {}), shouldShowMemberCount && isJoined === true && (_jsx(GroupMembersDrawer, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID })), _jsx(MediaCollection, {}), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", children: _jsx(Icon, { icon: "align-justify-o", size: 22 }) }), !!onClose && (_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onClose, children: _jsx(Icon, { icon: "close-b", size: 22 }) }))] })] }));
 };
 export default MessageHeader;

package/dist/components/message/MessageList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AA2BA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AAGD,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CA4U3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AA2BA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AAGD,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CA6U3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/message/MessageList.js

@@ -43,18 +43,19 @@ const MessageList = (props) => {
         groupId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID,
         userID: user === null || user === void 0 ? void 0 : user.userID,
     });
-    const { getMoreOldMessages, moreOldLoading, loadState, getMoreNewMessages, moreNewLoading, latestLoadState, } = useConversationMessages({
-        conversationId,
-        searchClientMsgID,
-        restrictToLastSession: isNotGroupMember,
-        customerUserID,
-    });
     const { handleJoinGroup, isJoining } = useJoinGroupFlow({
         groupId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID,
         latestConversationSessionId: latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.id,
         refetchConversationSessions,
         refetchIsJoined,
     });
+    const shouldRestrictToLastSession = isNotGroupMember || isJoining;
+    const { getMoreOldMessages, moreOldLoading, loadState, getMoreNewMessages, moreNewLoading, latestLoadState, } = useConversationMessages({
+        conversationId,
+        searchClientMsgID,
+        restrictToLastSession: shouldRestrictToLastSession,
+        customerUserID,
+    });
     const handleOpenRevoke = useCallback((clientMsgID) => {
         setSelectedItem(clientMsgID);
         openConfirmRevoke();
@@ -202,6 +203,6 @@ const MessageList = (props) => {
                             handleMarkConversationMessageAsRead();
                             loadMoreNewMessage();
                         }
-                    }, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage }, message.clientMsgID))) }) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), isNotGroupMember ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: handleJoinGroup, loading: isJoining, children: t("join_group") })] })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(Modal, { centered: true, open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, getContainer: false, forceRender: true, children: _jsx("p", { children: t("revoke_message_confirm_message") }) })] }));
+                    }, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage }, message.clientMsgID))) }) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), shouldRestrictToLastSession ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: handleJoinGroup, loading: isJoining, children: t("join_group") })] })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(Modal, { centered: true, open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, getContainer: false, forceRender: true, children: _jsx("p", { children: t("revoke_message_confirm_message") }) })] }));
 };
 export default MessageList;

package/dist/components/message/footer/ComposerTabs.d.ts

@@ -2,8 +2,9 @@ interface ComposerTabsProps {
     canUseInternal: boolean;
     hintText: string;
     isInternal: boolean;
+    lockToInternal: boolean;
     setIsInternal: (isInternal: boolean) => void;
 }
-declare const ComposerTabs: ({ canUseInternal, hintText, isInternal, setIsInternal, }: ComposerTabsProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const ComposerTabs: ({ canUseInternal, hintText, isInternal, lockToInternal, setIsInternal, }: ComposerTabsProps) => import("react/jsx-runtime").JSX.Element | null;
 export default ComposerTabs;
 //# sourceMappingURL=ComposerTabs.d.ts.map

package/dist/components/message/footer/ComposerTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComposerTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ComposerTabs.tsx"],"names":[],"mappings":"AAOA,UAAU,iBAAiB;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAeD,QAAA,MAAM,YAAY,GAAI,0DAKnB,iBAAiB,mDA2CnB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ComposerTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ComposerTabs.tsx"],"names":[],"mappings":"AAOA,UAAU,iBAAiB;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAeD,QAAA,MAAM,YAAY,GAAI,0EAMnB,iBAAiB,mDAoDnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/message/footer/ComposerTabs.js

@@ -16,19 +16,27 @@ const COMPOSER_TABS = [
         labelKey: "internal",
     },
 ];
-const ComposerTabs = ({ canUseInternal, hintText, isInternal, setIsInternal, }) => {
+const ComposerTabs = ({ canUseInternal, hintText, isInternal, lockToInternal, setIsInternal, }) => {
     const { t } = useTranslation();
     const items = useMemo(() => COMPOSER_TABS.map((tab) => ({
         key: String(tab.isInternal),
+        disabled: lockToInternal && !tab.isInternal,
         label: (_jsx("span", { className: clsx("text-sm font-semibold", isInternal === tab.isInternal
                 ? tab.activeClassName
-                : "text-gray-500"), children: t(tab.labelKey) })),
+                : lockToInternal && !tab.isInternal
+                    ? "text-gray-300"
+                    : "text-gray-500"), children: t(tab.labelKey) })),
         children: null,
-    })), [isInternal, t]);
+    })), [isInternal, lockToInternal, t]);
     if (!canUseInternal) {
         return null;
     }
-    return (_jsx(Tabs, { activeKey: String(isInternal), items: items, onChange: (value) => setIsInternal(value === "true"), tabBarExtraContent: {
+    return (_jsx(Tabs, { activeKey: String(isInternal), items: items, onChange: (value) => {
+            if (lockToInternal && value !== "true") {
+                return;
+            }
+            setIsInternal(value === "true");
+        }, tabBarExtraContent: {
             left: _jsx("p", { className: "pr-4 text-sm text-gray-500", children: hintText }),
         }, className: clsx("[&_.ant-tabs-content-holder]:hidden [&_.ant-tabs-ink-bar]:hidden [&_.ant-tabs-nav]:mb-0 [&_.ant-tabs-nav]:px-4 [&_.ant-tabs-nav]:pt-0 [&_.ant-tabs-nav]:before:border-b-0 [&_.ant-tabs-nav-wrap]:justify-end [&_.ant-tabs-extra-content]:flex [&_.ant-tabs-extra-content]:items-center [&_.ant-tabs-extra-content]:overflow-hidden [&_.ant-tabs-extra-content]:text-ellipsis [&_.ant-tabs-tab]:mb-0 [&_.ant-tabs-tab]:rounded-t-[16px] [&_.ant-tabs-tab]:border [&_.ant-tabs-tab]:border-b-0 [&_.ant-tabs-tab]:border-transparent [&_.ant-tabs-tab]:px-3 [&_.ant-tabs-tab]:py-1.5 [&_.ant-tabs-tab]:leading-5 [&_.ant-tabs-tab-btn]:leading-5", isInternal
             ? "[&_.ant-tabs-tab-active]:border-orange-200 [&_.ant-tabs-tab-active]:bg-orange-50"

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAEL,wBAAwB,EACzB,MAAM,qBAAqB,CAAC;AAK7B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAWtD,UAAU,kBAAkB;IAC1B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AASD,eAAO,MAAM,oBAAoB,mDAY/B,CAAC;AAEH,eAAO,MAAM,uBAAuB,gCAAyC,CAAC;AAE9E,QAAA,MAAM,qBAAqB,GAAI,4CAG5B,kBAAkB,4CAkJpB,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAe,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAK5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAYtD,UAAU,kBAAkB;IAC1B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AASD,eAAO,MAAM,oBAAoB,mDAY/B,CAAC;AAEH,eAAO,MAAM,uBAAuB,gCAAyC,CAAC;AAE9E,QAAA,MAAM,qBAAqB,GAAI,4CAG5B,kBAAkB,4CA+JpB,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

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

@@ -8,7 +8,7 @@ import { editorTheme, editorNodes, editorOnError } from "./editorConfig";
 import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from "react";
 import EnterHandler from "./EnterHandler";
 import ActionBar from "./ActionBar";
-import { AccountType, } from "../../../types/chat";
+import { AccountType } from "../../../types/chat";
 import { useSendMessage } from "../../../hooks/message/useSendMessage";
 import { Popover } from "antd";
 import FilePreview from "./FilePreview";
@@ -19,6 +19,7 @@ import CannedResponse from "../../cannedResponse";
 import { CannedResponseTriggerPlugin } from "./CannedResponsePlugin";
 import { useBoolean } from "ahooks";
 import useAuthStore from "../../../store/auth";
+import useConversationStore from "../../../store/conversation";
 import { useCurrentUserAccountType } from "../../../hooks/user/useCurrentUserAccountType";
 import ComposerTabs from "./ComposerTabs";
 import ComposerEditor from "./ComposerEditor";
@@ -47,22 +48,30 @@ const MessageFooterProvider = ({ currentSession, openCreateCannedModal, }) => {
     const { sendTextMessage, sendMergeMessage } = useSendMessage();
     const accountType = useCurrentUserAccountType();
     const [listUploadFiles, setListUploadFiles] = useState([]);
-    const [isOpenCanned, { setTrue: openCanned, setFalse: closeCanned },] = useBoolean(false);
+    const [isOpenCanned, { setTrue: openCanned, setFalse: closeCanned }] = useBoolean(false);
     const isCrm = useAuthStore((state) => state.isCrm);
     const [cannedQuery, setCannedQuery] = useState("");
     const [activeCannedIndex, setActiveCannedIndex] = useState(0);
     const [maxActiveCannedIndex, setMaxActiveCannedIndex] = useState(0);
     const [isInternal, setIsInternal] = useState(false);
     const canUseInternal = isCrm && accountType === AccountType.Staff;
+    const quotedMessage = useConversationStore((state) => state.quotedMessage);
+    const lockToInternal = Boolean((quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID) && (quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.isInternal));
     useEffect(() => {
         if (!canUseInternal && isInternal) {
             setIsInternal(false);
         }
     }, [canUseInternal, isInternal]);
+    useEffect(() => {
+        if (!canUseInternal ||
+            !(quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID) ||
+            !quotedMessage.isInternal) {
+            return;
+        }
+        setIsInternal(true);
+    }, [canUseInternal, quotedMessage]);
     const placeholderText = useMemo(() => {
-        return isInternal
-            ? t("enter_internal_message")
-            : t("enter_message");
+        return isInternal ? t("enter_internal_message") : t("enter_message");
     }, [isInternal, t]);
     const onSendMessage = useCallback(async ({ plainText, richText, type, isInternal, }) => {
         if (type === "text") {
@@ -108,6 +117,6 @@ const MessageFooterProvider = ({ currentSession, openCreateCannedModal, }) => {
             setMaxActiveCannedIndex,
         }, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsx(Popover, { open: isOpenCanned, content: _jsx(CannedResponse, { onClose: closeCanned, openCreateCannedModal: onOpenCreateCannedModal, cannedQuery: cannedQuery }), placement: "topLeft", trigger: "click", arrow: false, classNames: {
                         body: "mx-1 !p-0",
-                    }, destroyOnHidden: true, children: _jsxs("div", { className: "border-t pb-2 flex flex-col gap-1 bg-white", children: [_jsx(QuotedMessageFooter, {}), listUploadFiles.length > 0 && _jsx(FilePreview, {}), _jsx(ToolbarPlugin, {}), _jsxs("div", { children: [_jsx(ComposerTabs, { canUseInternal: canUseInternal, hintText: t("canned_response_hint"), isInternal: isInternal, setIsInternal: setIsInternal }), _jsx(ComposerEditor, { isInternal: isInternal, placeholderText: placeholderText })] }), _jsx(ActionBar, {})] }) }), _jsx(LinkPlugin, {}), _jsx(ListPlugin, {}), _jsx(EnterHandler, {}), _jsx(PasteAndDropPlugin, {}), isCrm && (_jsx(CannedResponseTriggerPlugin, { onClose: closeCanned, onOpen: onOpenCanned }))] }) }));
+                    }, destroyOnHidden: true, children: _jsxs("div", { className: "border-t pb-2 flex flex-col gap-1 bg-white", children: [_jsx(QuotedMessageFooter, {}), listUploadFiles.length > 0 && _jsx(FilePreview, {}), _jsx(ToolbarPlugin, {}), _jsxs("div", { children: [_jsx(ComposerTabs, { canUseInternal: canUseInternal, hintText: t("canned_response_hint"), isInternal: isInternal, lockToInternal: lockToInternal, setIsInternal: setIsInternal }), _jsx(ComposerEditor, { isInternal: isInternal, placeholderText: placeholderText })] }), _jsx(ActionBar, {})] }) }), _jsx(LinkPlugin, {}), _jsx(ListPlugin, {}), _jsx(EnterHandler, {}), _jsx(PasteAndDropPlugin, {}), isCrm && (_jsx(CannedResponseTriggerPlugin, { onClose: closeCanned, onOpen: onOpenCanned }))] }) }));
 };
 export default MessageFooterProvider;

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

@@ -1,3 +1,4 @@
+import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import dayjs from "dayjs";
 import clsx from "clsx";
@@ -54,11 +55,11 @@ const MessageItem = ({ message, allMessages, contextMenuOpen, onContextMenuOpenC
     const { isReplyable, isRevocable, isMine } = useMemo(() => {
         const isMyMessage = (message === null || message === void 0 ? void 0 : message.sendID) === userID;
         const isOlderThanOneDay = dayjs().diff(dayjs(message === null || message === void 0 ? void 0 : message.sendTime), "days", true) >= 1;
+        const status = message.status;
+        const isDeliveredForUi = status !== MessageStatus.Sending && status !== MessageStatus.Failed;
         return {
-            isReplyable: message.status === MessageStatus.Succeed,
-            isRevocable: isMyMessage &&
-                message.status === MessageStatus.Succeed &&
-                !isOlderThanOneDay,
+            isReplyable: isDeliveredForUi,
+            isRevocable: isMyMessage && isDeliveredForUi && !isOlderThanOneDay,
             isMine: isMyMessage,
         };
     }, [userID, message]);
@@ -133,28 +134,31 @@ const MessageItem = ({ message, allMessages, contextMenuOpen, onContextMenuOpenC
     }
     const messageContainerProps = {
         className: "flex flex-col gap-2 py-1 px-3 sm:px-4 min-w-0",
-        key: message === null || message === void 0 ? void 0 : message.clientMsgID,
         id: `${MSG_ITEM_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`,
     };
     const timeBreakNode = showTimeBreak ? (_jsx("div", { className: "flex justify-center", children: _jsx("span", { className: "text-xs text-gray-600 text-center bg-neutral-100 px-2 py-1 rounded-full", children: formatTimestamp(message.sendTime, {
                 dateMonthFormat: "DD MMMM",
             }) }) })) : null;
     if (isSystemLogMessage) {
-        return (_jsxs("div", Object.assign({}, messageContainerProps, { children: [timeBreakNode, _jsx(SystemLogMessageItem, { message: message })] })));
+        return (_createElement("div", Object.assign({}, messageContainerProps, { key: message === null || message === void 0 ? void 0 : message.clientMsgID }),
+            timeBreakNode,
+            _jsx(SystemLogMessageItem, { message: message })));
     }
-    return (_jsxs("div", Object.assign({}, messageContainerProps, { children: [timeBreakNode, _jsx("div", { className: clsx("flex min-w-0", isMine ? "justify-end" : "justify-start"), children: _jsxs("div", { className: clsx("flex flex-1 items-end gap-2 min-w-0", isMine ? "justify-end" : "justify-start"), children: [showSenderInfo && (_jsx("div", { className: "flex items-center justify-center w-[32px] h-[32px]", children: showSenderAvatar && (_jsx(Avatar, { src: message === null || message === void 0 ? void 0 : message.senderFaceUrl, children: ((_c = (_b = message === null || message === void 0 ? void 0 : message.senderNickname) === null || _b === void 0 ? void 0 : _b.charAt) === null || _c === void 0 ? void 0 : _c.call(_b, 0)) || "A" })) })), _jsxs("div", { className: clsx("flex flex-col max-w-[75%] min-w-0", isMine ? "items-end" : "items-start"), children: [showSenderName && showSenderInfo && (_jsx("span", { className: "text-xs font-bold mb-1 px-3 mt-2", children: message === null || message === void 0 ? void 0 : message.senderNickname })), _jsxs("div", { className: clsx("flex flex-col flex-1 w-full", isMine ? "items-end" : "items-start"), children: [(message === null || message === void 0 ? void 0 : message.quoteElem) && (_jsx(QuoteMessageItem, { message: message, isMine: isMine, onPressQuoteMessage: onPressQuoteMessage })), _jsxs("div", { className: "flex items-end gap-1.5", children: [isMine && (_jsx(MessageStatusIndicator, { message: message, isLatest: isLatestMine })), _jsx(Dropdown, { menu: { items: contextMenuItems }, trigger: hasContextMenu ? ["contextMenu"] : [], open: contextMenuOpen, onOpenChange: onContextMenuOpenChange, children: _jsxs("div", { className: clsx("px-3 py-2 rounded-2xl max-w-full min-w-0 break-normal flex flex-col flex-1 text-gray-900 gap-1 w-fit", isMine
-                                                            ? isInternalMessage
-                                                                ? "bg-orange-100"
-                                                                : "bg-blue-100"
-                                                            : isInternalMessage
-                                                                ? "bg-orange-100"
-                                                                : "bg-white"), style: {
-                                                            wordBreak: "break-word",
-                                                            overflowWrap: "anywhere",
-                                                        }, id: `${MSG_ITEM_CONTENT_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`, children: [(message === null || message === void 0 ? void 0 : message.contentType) === MessageType.MergeMessage ? (_jsxs("div", { children: [(_e = (_d = message === null || message === void 0 ? void 0 : message.mergeElem) === null || _d === void 0 ? void 0 : _d.multiMessage) === null || _e === void 0 ? void 0 : _e.map((item) => {
-                                                                        return renderMessageByType(item);
-                                                                    }), (message === null || message === void 0 ? void 0 : message.textElem) && (_jsx(TextMessageItem, { message: message }))] })) : (renderMessageByType(message)), _jsx("span", { className: clsx("text-xs text-gray-500 text-right"), children: dayjs(message === null || message === void 0 ? void 0 : message.sendTime).format("HH:mm") })] }) })] })] }), isMine && message.status === MessageStatus.Failed && (_jsx("span", { className: "text-red-500 text-xs mt-1", children: isMediaResendable(message) ? (_jsx(Trans, { i18nKey: "message_send_failed", components: {
-                                            bold: (_jsx("strong", { className: "cursor-pointer", onClick: () => resendMessage(message) })),
-                                        } })) : (t("message_send_failed_no_retry")) }))] })] }) })] })));
+    return (_createElement("div", Object.assign({}, messageContainerProps, { key: message === null || message === void 0 ? void 0 : message.clientMsgID }),
+        timeBreakNode,
+        _jsx("div", { className: clsx("flex min-w-0", isMine ? "justify-end" : "justify-start"), children: _jsxs("div", { className: clsx("flex flex-1 items-end gap-2 min-w-0", isMine ? "justify-end" : "justify-start"), children: [showSenderInfo && (_jsx("div", { className: "flex items-center justify-center w-[32px] h-[32px]", children: showSenderAvatar && (_jsx(Avatar, { src: message === null || message === void 0 ? void 0 : message.senderFaceUrl, children: ((_c = (_b = message === null || message === void 0 ? void 0 : message.senderNickname) === null || _b === void 0 ? void 0 : _b.charAt) === null || _c === void 0 ? void 0 : _c.call(_b, 0)) || "A" })) })), _jsxs("div", { className: clsx("flex flex-col max-w-[75%] min-w-0", isMine ? "items-end" : "items-start"), children: [showSenderName && showSenderInfo && (_jsx("span", { className: "text-xs font-bold mb-1 px-3 mt-2", children: message === null || message === void 0 ? void 0 : message.senderNickname })), _jsxs("div", { className: clsx("flex flex-col flex-1 w-full", isMine ? "items-end" : "items-start"), children: [(message === null || message === void 0 ? void 0 : message.quoteElem) && (_jsx(QuoteMessageItem, { message: message, isMine: isMine, onPressQuoteMessage: onPressQuoteMessage })), _jsxs("div", { className: "flex items-end gap-1.5", children: [isMine && (_jsx(MessageStatusIndicator, { message: message, isLatest: isLatestMine })), _jsx(Dropdown, { menu: { items: contextMenuItems }, trigger: hasContextMenu ? ["contextMenu"] : [], open: contextMenuOpen, onOpenChange: onContextMenuOpenChange, children: _jsxs("div", { className: clsx("px-3 py-2 rounded-2xl max-w-full min-w-0 break-normal flex flex-col flex-1 text-gray-900 gap-1 w-fit", isMine
+                                                        ? isInternalMessage
+                                                            ? "bg-orange-100"
+                                                            : "bg-blue-100"
+                                                        : isInternalMessage
+                                                            ? "bg-orange-100"
+                                                            : "bg-white"), style: {
+                                                        wordBreak: "break-word",
+                                                        overflowWrap: "anywhere",
+                                                    }, id: `${MSG_ITEM_CONTENT_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`, children: [(message === null || message === void 0 ? void 0 : message.contentType) === MessageType.MergeMessage ? (_jsxs("div", { children: [(_e = (_d = message === null || message === void 0 ? void 0 : message.mergeElem) === null || _d === void 0 ? void 0 : _d.multiMessage) === null || _e === void 0 ? void 0 : _e.map((item) => {
+                                                                    return renderMessageByType(item);
+                                                                }), (message === null || message === void 0 ? void 0 : message.textElem) && (_jsx(TextMessageItem, { message: message }))] })) : (renderMessageByType(message)), _jsx("span", { className: clsx("text-xs text-gray-500 text-right"), children: dayjs(message === null || message === void 0 ? void 0 : message.sendTime).format("HH:mm") })] }) })] })] }), isMine && message.status === MessageStatus.Failed && (_jsx("span", { className: "text-red-500 text-xs mt-1", children: isMediaResendable(message) ? (_jsx(Trans, { i18nKey: "message_send_failed", components: {
+                                        bold: (_jsx("strong", { className: "cursor-pointer", onClick: () => resendMessage(message) })),
+                                    } })) : (t("message_send_failed_no_retry")) }))] })] }) })));
 };
 export default MessageItem;

package/dist/components/thread/ManualAssignPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ManualAssignPopover.d.ts","sourceRoot":"","sources":["../../../src/components/thread/ManualAssignPopover.tsx"],"names":[],"mappings":"AAgBA,UAAU,aAAa;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,UAAU,wBAAwB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AA0CD,QAAA,MAAM,mBAAmB,GAAI,+CAI1B,wBAAwB,4CA8J1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"ManualAssignPopover.d.ts","sourceRoot":"","sources":["../../../src/components/thread/ManualAssignPopover.tsx"],"names":[],"mappings":"AAiBA,UAAU,aAAa;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,UAAU,wBAAwB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,aAAa,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAqDD,QAAA,MAAM,mBAAmB,GAAI,+CAI1B,wBAAwB,4CAmL1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}