@droppii-org/chat-sdk 0.1.73 → 0.1.74

package/dist/src/components/message/MessageHeader.js

@@ -1,132 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Avatar, Button, message } from "antd";
-import { Icon } from "../../components/icon";
-import { useConversationDisplayData } from "../../hooks/conversation/useConversation";
-import useConversationStore from "../../store/conversation";
-import MediaCollection from "../../components/media-collection";
-import { useEffect, useMemo, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { SessionStatus, SessionTag } from "../../types/chat";
-import SelectSession from "./SelectSession";
-import { useUpdateSession } from "../../hooks/session/useUpdateSession";
-import useAuthStore from "../../store/auth";
-import SearchDrawer from "../../components/search-conversation/SearchDrawer";
-import { isGroupSession } from "../../utils/imCommon";
-import GroupMembersDrawer from "./GroupMembersDrawer";
-const MessageHeader = ({ onClose, currentSession, isJoined, }) => {
-    var _a, _b;
-    const { t } = useTranslation();
-    const isCx = useAuthStore((state) => state.isCx);
-    const isCrm = useAuthStore((state) => state.isCrm);
-    const conversationData = useConversationStore((state) => state.conversationData);
-    const currentGroupInfo = useConversationStore((state) => state.currentGroupInfo);
-    const { mutate: updateSession } = useUpdateSession();
-    const { avatar, displayName } = useConversationDisplayData(conversationData);
-    const shouldShowMemberCount = isGroupSession(conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationType);
-    const [currentSessionStatus, setCurrentSessionStatus] = useState(SessionStatus.UNASSIGNED);
-    const [currentSessionTag, setCurrentSessionTag] = useState(SessionTag.NONE);
-    const statusOptions = useMemo(() => {
-        return [
-            {
-                label: t("unassigned"),
-                value: SessionStatus.UNASSIGNED,
-                tintColorClassname: "!text-amber-500",
-                tintColorClassnameBg: "!bg-amber-500",
-                bgTintColorClassname: "!bg-amber-100",
-            },
-            {
-                label: t("waiting_process"),
-                value: SessionStatus.WAITING_PROCESS,
-                tintColorClassname: "!text-orange-500",
-                tintColorClassnameBg: "!bg-orange-500",
-                bgTintColorClassname: "!bg-orange-100",
-            },
-            {
-                label: t("in_process"),
-                value: SessionStatus.IN_PROCESS,
-                tintColorClassname: "!text-blue-500",
-                tintColorClassnameBg: "!bg-blue-500",
-                bgTintColorClassname: "!bg-blue-100",
-            },
-            {
-                label: t("completed"),
-                value: SessionStatus.COMPLETED,
-                tintColorClassname: "!text-green-500",
-                tintColorClassnameBg: "!bg-green-500",
-                bgTintColorClassname: "!bg-green-100",
-            },
-        ];
-    }, [t]);
-    const tagOptions = useMemo(() => {
-        return [
-            {
-                label: t("select_tag"),
-                value: SessionTag.NONE,
-                tintColorClassname: "!text-gray-500",
-                tintColorClassnameBg: "!bg-gray-500",
-                bgTintColorClassname: "!bg-gray-100",
-            },
-            {
-                label: t("awaiting_reply"),
-                value: SessionTag.AWAITING_REPLY,
-                tintColorClassname: "!text-purple-500",
-                tintColorClassnameBg: "!bg-purple-500",
-                bgTintColorClassname: "!bg-purple-100",
-            },
-            {
-                label: t("slow_processing"),
-                value: SessionTag.SLOW_PROCESSING,
-                tintColorClassname: "!text-red-500",
-                tintColorClassnameBg: "!bg-red-500",
-                bgTintColorClassname: "!bg-red-100",
-            },
-            {
-                label: t("temporarily_paused"),
-                value: SessionTag.TEMPORARILY_PAUSED,
-                tintColorClassname: "!text-gray-500",
-                tintColorClassnameBg: "!bg-gray-500",
-                bgTintColorClassname: "!bg-gray-100",
-            },
-        ];
-    }, [t]);
-    const handleUpdateSession = (value, type, isSameValue) => {
-        let newValue = value;
-        if (type === "tag" &&
-            value === SessionTag.TEMPORARILY_PAUSED &&
-            isSameValue) {
-            newValue = SessionTag.NONE;
-        }
-        if (currentSession) {
-            if (!isSameValue ||
-                (type === "tag" && value === SessionTag.TEMPORARILY_PAUSED)) {
-                updateSession({
-                    sessionId: currentSession.id,
-                    [type]: newValue,
-                }, {
-                    onError(error) {
-                        var _a, _b;
-                        message.error(((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) ||
-                            t(`update_session_${type}_failed`));
-                    },
-                    onSuccess() {
-                        if (type === "status") {
-                            setCurrentSessionStatus(newValue);
-                        }
-                        else {
-                            setCurrentSessionTag(newValue);
-                        }
-                    },
-                });
-            }
-        }
-    };
-    useEffect(() => {
-        if (currentSession) {
-            setCurrentSessionTag(currentSession.tag);
-            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, {}), shouldShowMemberCount && isJoined === true && isCrm && (_jsx(GroupMembersDrawer, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID, conversationId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID, currentSession: currentSession })), _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/src/components/message/MessageInfiniteScroll.d.ts

@@ -1,16 +0,0 @@
-import { ReactNode, Ref } from "react";
-import type { MessageListLoadState } from "../../hooks/message/useMessageListScroll";
-export interface MessageInfiniteScrollProps {
-    scrollRef: Ref<HTMLDivElement>;
-    scrollableTargetId: string;
-    loadState: MessageListLoadState;
-    moreOldLoading?: boolean;
-    onLoadMoreOld: () => void;
-    onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
-    children: ReactNode;
-    empty?: ReactNode;
-    containerClassName?: string;
-}
-declare const MessageInfiniteScroll: ({ scrollRef, scrollableTargetId, loadState, moreOldLoading, onLoadMoreOld, onScroll, children, empty, containerClassName, }: MessageInfiniteScrollProps) => import("react/jsx-runtime").JSX.Element;
-export default MessageInfiniteScroll;
-//# sourceMappingURL=MessageInfiniteScroll.d.ts.map

package/dist/src/components/message/MessageInfiniteScroll.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MessageInfiniteScroll.d.ts","sourceRoot":"","sources":["../../../../src/components/message/MessageInfiniteScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAEjF,MAAM,WAAW,0BAA0B;IACzC,SAAS,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC/B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,oBAAoB,CAAC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,QAAA,MAAM,qBAAqB,GAAI,6HAU5B,0BAA0B,4CAoC5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/src/components/message/MessageInfiniteScroll.js

@@ -1,7 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Spin } from "antd";
-import clsx from "clsx";
-import InfiniteScroll from "react-infinite-scroll-component";
-const MessageInfiniteScroll = ({ scrollRef, scrollableTargetId, loadState, moreOldLoading = false, onLoadMoreOld, onScroll, children, empty, containerClassName, }) => (_jsx("div", { id: scrollableTargetId, ref: scrollRef, className: clsx("flex h-full flex-col-reverse overflow-x-hidden overflow-y-auto pb-3", containerClassName), children: empty && loadState.messageList.length === 0 ? (empty) : (_jsx(InfiniteScroll, { dataLength: loadState.messageList.length, next: onLoadMoreOld, className: "flex w-full min-w-0 flex-col-reverse", inverse: true, hasMore: loadState.hasMoreOld, loader: moreOldLoading ? (_jsx("div", { className: "flex w-full items-center justify-center py-2", children: _jsx(Spin, { size: "small" }) })) : (_jsx("span", { className: "sr-only" })), scrollableTarget: scrollableTargetId, onScroll: (e) => onScroll(e), children: children })) }));
-export default MessageInfiniteScroll;

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

@@ -1,10 +0,0 @@
-interface MessageListProps {
-    conversationId: string;
-    searchClientMsgID?: string;
-    className?: string;
-    onClose?: () => void;
-    openCreateCannedModal?: () => void;
-}
-declare const MessageList: (props: MessageListProps) => import("react/jsx-runtime").JSX.Element;
-export default MessageList;
-//# sourceMappingURL=MessageList.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AAyBA,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;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAgO3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/src/components/message/MessageList.js

@@ -1,112 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useConversationMessages } from "../../hooks/message/useConversationMessages";
-import { Button, Empty, Modal, Spin } from "antd";
-import { useCallback, useEffect, useState } from "react";
-import dayjs from "dayjs";
-import isToday from "dayjs/plugin/isToday";
-import emitter from "../../utils/events";
-import MessageItem from "./item";
-import MessageInfiniteScroll from "./MessageInfiniteScroll";
-import MessageHeader from "./MessageHeader";
-import MessageFooter from "./footer";
-import UnassignedSessionFooter from "./UnassignedSessionFooter";
-import { useTranslation } from "react-i18next";
-import useConversationStore from "../../store/conversation";
-import { useBoolean } from "ahooks";
-import { useMessageListScroll } from "../../hooks/message/useMessageListScroll";
-import { useChatContext } from "../../context/ChatContext";
-import { useRevokeMessage } from "../../hooks/message/useRevokeMessage";
-import { useConversationSessionState } from "../../hooks/session/useConversationSessionState";
-import { useJoinGroupFlow } from "../../hooks/session/useJoinGroupFlow";
-import { ConnectStatus, SessionStatus } from "../../types/chat";
-dayjs.extend(isToday);
-const MessageList = (props) => {
-    const { t } = useTranslation();
-    const { user, connectStatus } = useChatContext();
-    const { onClose, conversationId, searchClientMsgID, openCreateCannedModal } = props;
-    const conversationData = useConversationStore((state) => state.conversationData);
-    const setQuotedMessage = useConversationStore((state) => state.setQuotedMessage);
-    const setSearchClientMsgID = useConversationStore((state) => state.setSearchClientMsgID);
-    const [openMenuId, setOpenMenuId] = useState(null);
-    const [selectedItem, setSelectedItem] = useState(null);
-    const [showConfirmRevoke, { setTrue: openConfirmRevoke, setFalse: closeConfirmRevoke },] = useBoolean(false);
-    const { revokeMessage, loading: isRevoking } = useRevokeMessage();
-    const { groupId, latestConversationSession, customerUserID, refetchConversationSessions, } = useConversationSessionState({
-        conversationId,
-        conversationType: conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationType,
-        groupId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID,
-    });
-    const { isJoined, isCheckingMembership, shouldRestrictToLastSession, joinGroup, isJoining, } = useJoinGroupFlow({
-        groupId,
-        sessionId: latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.id,
-    });
-    const messageController = useConversationMessages({
-        conversationId,
-        searchClientMsgID,
-        restrictToLastSession: shouldRestrictToLastSession,
-        customerUserID,
-    });
-    const { loadState, moreOldLoading, moreNewLoading } = messageController;
-    const { scrollRef, loadMoreOldMessage, handleInfiniteScroll, scrollToBottom, scrollToMessage, } = useMessageListScroll(Object.assign({ conversationId, userId: user === null || user === void 0 ? void 0 : user.userID }, messageController));
-    const handleOpenRevoke = useCallback((clientMsgID) => {
-        setSelectedItem(clientMsgID);
-        openConfirmRevoke();
-    }, [openConfirmRevoke]);
-    const handleCloseRevoke = useCallback(() => {
-        setSelectedItem(null);
-        closeConfirmRevoke();
-    }, [closeConfirmRevoke]);
-    const onRevokeMessage = useCallback(async () => {
-        await revokeMessage((conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID) || "", selectedItem || "");
-        handleCloseRevoke();
-    }, [
-        conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID,
-        selectedItem,
-        revokeMessage,
-        handleCloseRevoke,
-    ]);
-    const onPressQuoteMessage = useCallback((clientMsgID) => {
-        const hasMessage = loadState.messageList.some((msg) => msg.clientMsgID === clientMsgID);
-        if (hasMessage) {
-            scrollToMessage(clientMsgID);
-        }
-        else {
-            setSearchClientMsgID(clientMsgID);
-        }
-    }, [scrollToMessage, loadState.messageList, setSearchClientMsgID]);
-    useEffect(() => {
-        emitter.on("CHAT_LIST_SCROLL_TO_BOTTOM", scrollToBottom);
-        emitter.on("CHAT_LIST_SCROLL_TO_MESSAGE", scrollToMessage);
-        return () => {
-            emitter.off("CHAT_LIST_SCROLL_TO_BOTTOM", scrollToBottom);
-            emitter.off("CHAT_LIST_SCROLL_TO_MESSAGE", scrollToMessage);
-        };
-    }, []);
-    useEffect(() => {
-        const handler = (sessionUpdated) => {
-            if (sessionUpdated.conversationId === conversationId) {
-                refetchConversationSessions();
-            }
-        };
-        emitter.on("UPDATE_SESSION", handler);
-        return () => {
-            emitter.off("UPDATE_SESSION", handler);
-        };
-    }, [conversationId, refetchConversationSessions]);
-    useEffect(() => {
-        if (!openMenuId)
-            return;
-        const scrollContainer = scrollRef.current;
-        if (!scrollContainer)
-            return;
-        const close = () => setOpenMenuId(null);
-        scrollContainer.addEventListener("scroll", close);
-        return () => scrollContainer.removeEventListener("scroll", close);
-    }, [openMenuId]);
-    if (!conversationData) {
-        return (_jsx("div", { className: "flex flex-1 items-center justify-center h-full", children: connectStatus !== ConnectStatus.Connected ? (_jsx(Spin, {})) : (_jsx(Empty, { description: t("no_conversation_data") })) }));
-    }
-    return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full min-w-0 bg-white", style: { overflowX: "hidden" }, children: [_jsx(MessageHeader, { onClose: onClose, currentSession: latestConversationSession, isJoined: isJoined }), _jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, 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, {}) })), isCheckingMembership ? (_jsx("div", { className: "border-t bg-white py-4 flex items-center justify-center", children: _jsx(Spin, {}) })) : (latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.status) === SessionStatus.UNASSIGNED ? (_jsx(UnassignedSessionFooter, { sessionId: latestConversationSession.id, teamId: latestConversationSession.teamId })) : 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: joinGroup, 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/src/components/message/SelectSession.d.ts

@@ -1,11 +0,0 @@
-import type { SelectSessionOption } from "./MessageHeader";
-interface SelectSessionProps {
-    options: SelectSessionOption[];
-    value: SelectSessionOption["value"];
-    onChange: (value: SelectSessionOption["value"]) => void;
-    excludeOptions?: SelectSessionOption["value"][];
-    placeholder?: string;
-}
-declare const SelectSession: ({ options, value, onChange, excludeOptions, placeholder, }: SelectSessionProps) => import("react/jsx-runtime").JSX.Element;
-export default SelectSession;
-//# sourceMappingURL=SelectSession.d.ts.map

package/dist/src/components/message/SelectSession.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectSession.d.ts","sourceRoot":"","sources":["../../../../src/components/message/SelectSession.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,UAAU,kBAAkB;IAC1B,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;IACpC,QAAQ,EAAE,CAAC,KAAK,EAAE,mBAAmB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IACxD,cAAc,CAAC,EAAE,mBAAmB,CAAC,OAAO,CAAC,EAAE,CAAC;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,GAAI,4DAMpB,kBAAkB,4CAwDpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/src/components/message/SelectSession.js

@@ -1,23 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Select } from "antd";
-import { Icon } from "../../components/icon";
-import clsx from "clsx";
-const SelectSession = ({ options, value, onChange, excludeOptions, placeholder, }) => {
-    const selectedOption = options.find((option) => option.value === value);
-    const renderOptionLabel = (option) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: clsx("w-2 h-2 rounded-full", option.tintColorClassnameBg) }), _jsx("span", { className: clsx("text-xs truncate flex-1", option.tintColorClassname), children: option.label })] }));
-    const filteredOptions = options.filter((option) => option.value === value || !(excludeOptions === null || excludeOptions === void 0 ? void 0 : excludeOptions.includes(option.value)));
-    const selectOptions = filteredOptions.map((option) => ({
-        label: renderOptionLabel(option),
-        value: option.value,
-    }));
-    const handleSelect = (val) => {
-        onChange(val);
-    };
-    return (_jsx("div", { className: "relative", children: _jsx(Select, { className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.bgTintColorClassname} custom-select min-w-[100px]`, placement: "bottomLeft", placeholder: placeholder, options: selectOptions, value: selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value, onSelect: handleSelect, suffixIcon: _jsx(Icon, { icon: "angle-down-o", className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.tintColorClassname} mt-[2px]`, size: 14 }), menuItemSelectedIcon: null, labelRender: () => ["NONE", ""].includes(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value)
-                ? placeholder
-                : selectedOption
-                    ? renderOptionLabel(selectedOption)
-                    : undefined }) }));
-};
-export default SelectSession;

package/dist/src/components/message/UnassignedSessionFooter.d.ts

@@ -1,7 +0,0 @@
-interface UnassignedSessionFooterProps {
-    sessionId: string;
-    teamId?: string;
-}
-declare const UnassignedSessionFooter: ({ sessionId, teamId, }: UnassignedSessionFooterProps) => import("react/jsx-runtime").JSX.Element | null;
-export default UnassignedSessionFooter;
-//# sourceMappingURL=UnassignedSessionFooter.d.ts.map

package/dist/src/components/message/UnassignedSessionFooter.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"UnassignedSessionFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/message/UnassignedSessionFooter.tsx"],"names":[],"mappings":"AASA,UAAU,4BAA4B;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,uBAAuB,GAAI,wBAG9B,4BAA4B,mDA2C9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/src/components/message/UnassignedSessionFooter.js

@@ -1,26 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, message as antdMessage } from "antd";
-import { useTranslation } from "react-i18next";
-import { useAssignSession } from "../../hooks/session/useAssignSession";
-import useAuthStore from "../../store/auth";
-import ManualAssignPopover from "../../components/thread/ManualAssignPopover";
-import { Icon } from "../../components/icon";
-const UnassignedSessionFooter = ({ sessionId, teamId, }) => {
-    const { t } = useTranslation();
-    const userID = useAuthStore((state) => state.userID);
-    const isCrm = useAuthStore((state) => state.isCrm);
-    const { mutateAsync: assignSession, isPending: isAssigning } = useAssignSession();
-    if (!isCrm)
-        return null;
-    const handleAssignToMe = async () => {
-        try {
-            await assignSession({ sessionId, supporterId: userID });
-        }
-        catch (_a) {
-            antdMessage.error(t("manual_assign_failed"));
-        }
-    };
-    return (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-amber-500", children: [_jsx(Icon, { icon: "user-del-o", size: 16 }), _jsx("p", { className: "text-sm text-gray-500", children: t("unassigned_thread_notice") })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "primary", onClick: handleAssignToMe, loading: isAssigning, disabled: isAssigning, children: t("assign_to_me") }), _jsx(ManualAssignPopover, { sessionId: sessionId, teamId: teamId, excludeCurrentUser: true, children: _jsx(Button, { disabled: isAssigning, children: t("assign_to_others") }) })] })] }));
-};
-export default UnassignedSessionFooter;

package/dist/src/components/message/footer/ActionBar.d.ts

@@ -1,3 +0,0 @@
-declare const ActionBar: () => import("react/jsx-runtime").JSX.Element;
-export default ActionBar;
-//# sourceMappingURL=ActionBar.d.ts.map

package/dist/src/components/message/footer/ActionBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/footer/ActionBar.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,SAAS,+CA+Gd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/src/components/message/footer/ActionBar.js

@@ -1,90 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useState } from "react";
-import { Button } from "antd";
-import { Icon } from "../../../components/icon";
-import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
-import { $createParagraphNode, $getRoot, $getSelection, $isRangeSelection, } from "lexical";
-import { $generateHtmlFromNodes } from "@lexical/html";
-import { $isListNode, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, } from "@lexical/list";
-import { $isQuoteNode } from "@lexical/rich-text";
-import { useMessageFooterContext } from ".";
-import MediaActions from "./MediaActions";
-import useConversationStore from "../../../store/conversation";
-const ActionBar = () => {
-    const [editor] = useLexicalComposerContext();
-    const { onSendMessage, isInternal, listUploadFiles, setListUploadFiles } = useMessageFooterContext();
-    const quotedMessage = useConversationStore((state) => state.quotedMessage);
-    const [isEmptyInput, setIsEmptyInput] = useState(true);
-    const canSend = useMemo(() => {
-        const hasQuote = !!(quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID);
-        return hasQuote
-            ? !isEmptyInput
-            : !isEmptyInput || listUploadFiles.length > 0;
-    }, [isEmptyInput, listUploadFiles === null || listUploadFiles === void 0 ? void 0 : listUploadFiles.length, quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID]);
-    const handleSend = useCallback(() => {
-        let plainText = "";
-        let richText = "";
-        editor.getEditorState().read(() => {
-            plainText = $getRoot().getTextContent();
-            richText = $generateHtmlFromNodes(editor);
-        });
-        if (canSend) {
-            const sent = onSendMessage({
-                plainText,
-                richText,
-                type: listUploadFiles.length > 0 ? "file" : "text",
-                isInternal,
-            });
-            if (!sent) {
-                return;
-            }
-        }
-        editor.update(() => {
-            const root = $getRoot();
-            root.clear();
-            const paragraph = $createParagraphNode();
-            root.append(paragraph);
-            paragraph.select();
-            const selection = $getSelection();
-            if ($isRangeSelection(selection)) {
-                const anchorNode = selection.anchor.getNode();
-                const topLevelNode = anchorNode.getTopLevelElementOrThrow();
-                const isListNode = $isListNode(topLevelNode);
-                const isQuoteNode = $isQuoteNode(topLevelNode);
-                const listType = isListNode ? topLevelNode.getListType() : undefined;
-                if (selection.hasFormat("bold")) {
-                    selection.formatText("bold");
-                }
-                if (selection.hasFormat("italic")) {
-                    selection.formatText("italic");
-                }
-                if (selection.hasFormat("strikethrough")) {
-                    selection.formatText("strikethrough");
-                }
-                if (isQuoteNode) {
-                    const paragraph = $createParagraphNode();
-                    const children = topLevelNode.getChildren();
-                    children.forEach((child) => paragraph.append(child));
-                    topLevelNode.replace(paragraph);
-                }
-                if (isListNode && listType) {
-                    editor.dispatchCommand(listType === "number"
-                        ? INSERT_ORDERED_LIST_COMMAND
-                        : INSERT_UNORDERED_LIST_COMMAND, undefined);
-                }
-            }
-        });
-    }, [editor, onSendMessage, canSend, isInternal, listUploadFiles.length]);
-    useEffect(() => {
-        return editor.registerUpdateListener(({ editorState }) => {
-            editorState.read(() => {
-                const root = $getRoot();
-                const textContent = root.getTextContent().trim();
-                setIsEmptyInput(textContent.length <= 0);
-            });
-        });
-    }, [editor]);
-    return (_jsxs("div", { className: "flex items-center justify-between px-4", children: [_jsx(MediaActions, { listUploadFiles: listUploadFiles, onFilesChange: setListUploadFiles, buttonClassName: "text-gray-500 w-8 h-8 p-0" }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleSend, disabled: !canSend, children: _jsx(Icon, { icon: "send-b", size: 28, className: `${canSend ? "text-blue-500" : "text-gray-400"}` }) })] }));
-};
-export default ActionBar;

package/dist/src/components/message/footer/CannedResponsePlugin.d.ts

@@ -1,7 +0,0 @@
-type Props = {
-    onOpen: (query: string) => void;
-    onClose: () => void;
-};
-export declare function CannedResponseTriggerPlugin({ onOpen, onClose }: Props): null;
-export {};
-//# sourceMappingURL=CannedResponsePlugin.d.ts.map

package/dist/src/components/message/footer/CannedResponsePlugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CannedResponsePlugin.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/footer/CannedResponsePlugin.tsx"],"names":[],"mappings":"AAWA,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,2BAA2B,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,KAAK,QAsFrE"}

package/dist/src/components/message/footer/CannedResponsePlugin.js

@@ -1,67 +0,0 @@
-import { useEffect } from "react";
-import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
-import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_LOW, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, } from "lexical";
-import { useMessageFooterContext } from ".";
-export function CannedResponseTriggerPlugin({ onOpen, onClose }) {
-    const [editor] = useLexicalComposerContext();
-    const { activeCannedIndex, setActiveCannedIndex, isOpenCanned, maxActiveCannedIndex, } = useMessageFooterContext();
-    useEffect(() => {
-        return editor.registerUpdateListener(({ editorState }) => {
-            editorState.read(() => {
-                const selection = $getSelection();
-                if (!$isRangeSelection(selection) || !selection.isCollapsed()) {
-                    onClose();
-                    return;
-                }
-                const anchor = selection.anchor;
-                const node = anchor.getNode();
-                const text = node.getTextContent();
-                const offset = anchor.offset;
-                const before = text.slice(0, offset);
-                // match #abc (KHÔNG có space phía sau)
-                const match = before.match(/(^|\s)#(\w*)$/);
-                if (match) {
-                    onOpen(match[2] || "");
-                }
-                else {
-                    onClose();
-                }
-            });
-        });
-    }, [editor, onOpen, onClose]);
-    useEffect(() => {
-        const unregisterUp = editor.registerCommand(KEY_ARROW_UP_COMMAND, (e) => {
-            if (!isOpenCanned)
-                return false;
-            e.preventDefault();
-            setActiveCannedIndex(activeCannedIndex === null
-                ? null
-                : activeCannedIndex - 1 < 0
-                    ? 0
-                    : activeCannedIndex - 1);
-            return true;
-        }, COMMAND_PRIORITY_LOW);
-        const unregisterDown = editor.registerCommand(KEY_ARROW_DOWN_COMMAND, (e) => {
-            if (!isOpenCanned)
-                return false;
-            e.preventDefault();
-            setActiveCannedIndex(activeCannedIndex === null
-                ? 0
-                : activeCannedIndex + 1 > maxActiveCannedIndex
-                    ? maxActiveCannedIndex
-                    : activeCannedIndex + 1);
-            return true;
-        }, COMMAND_PRIORITY_LOW);
-        return () => {
-            unregisterUp();
-            unregisterDown();
-        };
-    }, [
-        editor,
-        isOpenCanned,
-        activeCannedIndex,
-        setActiveCannedIndex,
-        maxActiveCannedIndex,
-    ]);
-    return null;
-}

package/dist/src/components/message/footer/ComposerEditor.d.ts

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

package/dist/src/components/message/footer/ComposerEditor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ComposerEditor.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/footer/ComposerEditor.tsx"],"names":[],"mappings":"AAOA,UAAU,mBAAmB;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,cAAc,GAAI,kCAGrB,mBAAmB,4CAwBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/src/components/message/footer/ComposerEditor.js

@@ -1,13 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
-import { ContentEditable } from "@lexical/react/LexicalContentEditable";
-import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
-import clsx from "clsx";
-const ComposerEditor = ({ isInternal, placeholderText, }) => {
-    const editorClasses = clsx("min-h-[64px] max-h-[140px] overflow-y-auto rounded-md border px-3 py-2 text-sm", isInternal
-        ? "border-orange-300 bg-orange-50"
-        : "border-indigo-500 bg-blue-100");
-    return (_jsx("div", { className: "px-4", children: _jsx("div", { className: "relative", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: editorClasses }), ErrorBoundary: LexicalErrorBoundary, "aria-placeholder": placeholderText, placeholder: _jsx("div", { className: "absolute left-3 top-2 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: placeholderText }) }) }) }) }));
-};
-export default ComposerEditor;

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

@@ -1,10 +0,0 @@
-interface ComposerTabsProps {
-    canUseInternal: boolean;
-    hintText: string;
-    isInternal: boolean;
-    lockToInternal: boolean;
-    setIsInternal: (isInternal: boolean) => void;
-}
-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/src/components/message/footer/ComposerTabs.d.ts.map

@@ -1 +0,0 @@
-{"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"}