@droppii-org/chat-sdk 0.1.3 → 0.1.5

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

@@ -4,19 +4,65 @@ import { Icon } from "../../icon";
 import { useTranslation } from "react-i18next";
 import clsx from "clsx";
 import MediaPreviewIcon from "../MediaPreviewIcon";
+import useAuthStore from "../../../store/auth";
+import { useCallback } from "react";
+import useConversationStore from "../../../store/conversation";
 const QuoteMessageItem = ({ message, isMine, onPressQuoteMessage, }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f;
+    const userID = useAuthStore((state) => state.userID);
+    const isCrm = useAuthStore((state) => state.isCrm);
+    const conversationData = useConversationStore((state) => state.conversationData);
     const { t } = useTranslation();
-    const from = isMine ? t("you") : message === null || message === void 0 ? void 0 : message.senderNickname;
-    const to = isMine
-        ? t("your_self")
-        : (_b = (_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage) === null || _b === void 0 ? void 0 : _b.senderNickname;
-    return (_jsxs("div", { className: clsx("mb-[-4px] flex flex-col gap-1", isMine ? "items-end" : "items-start"), children: [_jsxs("div", { className: "flex flex-row items-center gap-2", children: [_jsx(Icon, { icon: "arrow-reply-b", size: 16, className: "text-blue-500" }), _jsx("span", { className: "text-xs text-gray-500", children: t("replied_to", {
-                            from: from,
-                            to: to,
-                        }) })] }), _jsxs("div", { className: "flex flex-row items-center gap-2 border border-gray-200 rounded-2xl min-w-0 px-3 py-2 bg-gray-100 cursor-pointer", onClick: () => {
+    const parseReplyText = useCallback(() => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        const quoteMsg = (_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage;
+        const senderID = message === null || message === void 0 ? void 0 : message.sendID;
+        const senderName = message === null || message === void 0 ? void 0 : message.senderNickname;
+        const targetID = quoteMsg === null || quoteMsg === void 0 ? void 0 : quoteMsg.sendID;
+        const targetName = quoteMsg === null || quoteMsg === void 0 ? void 0 : quoteMsg.senderNickname;
+        const isSelfReply = senderID && targetID && senderID === targetID;
+        const isFromMe = senderID === userID;
+        const isReplyToMe = targetID === userID;
+        const convoName = conversationData === null || conversationData === void 0 ? void 0 : conversationData.showName;
+        const isChatSupport = (_e = (_d = (_c = (_b = JSON === null || JSON === void 0 ? void 0 : JSON.parse) === null || _b === void 0 ? void 0 : _b.call(JSON, (conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex) || "{}")) === null || _c === void 0 ? void 0 : _c.sessionInfo) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.botId;
+        // format name theo role
+        const formatName = (name, isTarget = false) => {
+            if (!name)
+                return "";
+            // Customer view → luôn dùng tên conversation
+            if (!isCrm && isChatSupport) {
+                return convoName;
+            }
+            // CX view
+            if (isTarget && targetID === userID) {
+                return t("you");
+            }
+            if (!isTarget && isFromMe) {
+                return t("you");
+            }
+            return name;
+        };
+        // 1. self reply
+        if (isSelfReply) {
+            return isFromMe
+                ? ((_g = (_f = t("replied_yourself")) === null || _f === void 0 ? void 0 : _f.charAt(0)) === null || _g === void 0 ? void 0 : _g.toUpperCase()) +
+                    ((_h = t("replied_yourself")) === null || _h === void 0 ? void 0 : _h.slice(1)) // Đã trả lời chính mình
+                : `${formatName(senderName)} ${t("replied_yourself")}`;
+        }
+        // 2. mình reply người khác
+        if (isFromMe) {
+            return `${((_k = (_j = t("replied")) === null || _j === void 0 ? void 0 : _j.charAt(0)) === null || _k === void 0 ? void 0 : _k.toUpperCase()) + ((_l = t("replied")) === null || _l === void 0 ? void 0 : _l.slice(1))} ${formatName(targetName || "", true)}`;
+        }
+        // 3. người khác reply mình
+        if (isReplyToMe) {
+            return `${formatName(senderName || "")} ${t("replied_you")}`;
+        }
+        // 4. người khác ↔ người khác
+        return `${formatName(senderName || "")} ${t("replied")} ${formatName(targetName || "", true)}`;
+    }, [message, userID, isCrm, conversationData, t]);
+    return (_jsxs("div", { className: clsx("mb-[-4px] flex flex-col gap-1 flex-1 w-full", isMine ? "items-end" : "items-start"), children: [_jsxs("div", { className: "flex flex-row flex-1 items-center gap-2", children: [_jsx(Icon, { icon: "arrow-reply-b", size: 16, className: "text-blue-500" }), _jsx("span", { className: "text-xs text-gray-500", children: parseReplyText() })] }), _jsxs("div", { className: "flex flex-row flex-1 max-w-full items-center gap-2 border border-gray-200 rounded-2xl min-w-0 px-3 py-2 bg-gray-100 cursor-pointer", onClick: () => {
                     var _a, _b;
                     return onPressQuoteMessage === null || onPressQuoteMessage === void 0 ? void 0 : onPressQuoteMessage(((_b = (_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage) === null || _b === void 0 ? void 0 : _b.clientMsgID) || "");
-                }, children: [_jsx(MediaPreviewIcon, { message: (_c = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _c === void 0 ? void 0 : _c.quoteMessage }), _jsx("span", { className: "text-sm text-gray-500 truncate", children: generateContentBasedOnMessageType((_e = (_d = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _d === void 0 ? void 0 : _d.quoteMessage) === null || _e === void 0 ? void 0 : _e.contentType, ((_h = (_g = (_f = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _f === void 0 ? void 0 : _f.quoteMessage) === null || _g === void 0 ? void 0 : _g.textElem) === null || _h === void 0 ? void 0 : _h.content) || "") })] })] }));
+                }, children: [_jsx(MediaPreviewIcon, { message: (_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage }), _jsx("span", { className: "text-sm text-gray-500 truncate", children: generateContentBasedOnMessageType((_c = (_b = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _b === void 0 ? void 0 : _b.quoteMessage) === null || _c === void 0 ? void 0 : _c.contentType, ((_f = (_e = (_d = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _d === void 0 ? void 0 : _d.quoteMessage) === null || _e === void 0 ? void 0 : _e.textElem) === null || _f === void 0 ? void 0 : _f.content) || "") })] })] }));
 };
 export default QuoteMessageItem;

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

@@ -121,7 +121,7 @@ const MessageItem = ({ message, allMessages, contextMenuOpen, onContextMenuOpenC
     }
     return (_jsxs("div", { className: "flex flex-col gap-2 py-1 px-3 sm:px-4 min-w-0", id: `${MSG_ITEM_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`, children: [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",
-                    }) }) })), _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 flex-[0.8] 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", 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 ? "bg-blue-100" : "bg-white"), style: {
+                    }) }) })), _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 ? "bg-blue-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) => {

package/dist/hooks/cannedResponse/useFetchCannedCategories.d.ts

@@ -0,0 +1,3 @@
+import { ICannedCategoryResponse } from "../../types/dto";
+export declare const useFetchCannedCategories: (teamId?: string, enabled?: boolean) => import("@tanstack/react-query").UseQueryResult<ICannedCategoryResponse[], Error>;
+//# sourceMappingURL=useFetchCannedCategories.d.ts.map

package/dist/hooks/cannedResponse/useFetchCannedCategories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchCannedCategories.d.ts","sourceRoot":"","sources":["../../../src/hooks/cannedResponse/useFetchCannedCategories.ts"],"names":[],"mappings":"AAIA,OAAO,EAAgB,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAExE,eAAO,MAAM,wBAAwB,GAAI,SAAS,MAAM,EAAE,UAAU,OAAO,qFAUvE,CAAC"}

package/dist/hooks/cannedResponse/useFetchCannedCategories.js

@@ -0,0 +1,13 @@
+import { useQuery } from "@tanstack/react-query";
+import { QUERY_KEYS } from "../../services/query";
+import { apiInstance } from "../../services/api";
+import { ENDPOINTS } from "../../services/routes";
+export const useFetchCannedCategories = (teamId, enabled) => useQuery({
+    queryKey: [QUERY_KEYS.GET_CANNED_CATEGORIES, teamId],
+    queryFn: async () => {
+        var _a;
+        const res = await apiInstance.get(ENDPOINTS.chatService.getCannedCategories, { params: { teamId } });
+        return ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) || [];
+    },
+    enabled: !!enabled && !!teamId,
+});

package/dist/hooks/cannedResponse/useFetchCannedResponse.d.ts

@@ -0,0 +1,219 @@
+import { BaseResponse, ICannedResponseItem, IFetchCannedResponseRequest } from "../../types/dto";
+export declare const useFetchCannedResponse: (payload: IFetchCannedResponseRequest) => {
+    error: Error;
+    isError: true;
+    isPending: false;
+    isLoadingError: false;
+    isRefetchError: true;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "error";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchNextPageError: boolean;
+    isFetchPreviousPageError: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+} | {
+    error: null;
+    isError: false;
+    isPending: false;
+    isLoadingError: false;
+    isRefetchError: false;
+    isFetchNextPageError: false;
+    isFetchPreviousPageError: false;
+    isSuccess: true;
+    isPlaceholderData: false;
+    status: "success";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+} | {
+    error: Error;
+    isError: true;
+    isPending: false;
+    isLoadingError: true;
+    isRefetchError: false;
+    isFetchNextPageError: false;
+    isFetchPreviousPageError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "error";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+} | {
+    error: null;
+    isError: false;
+    isPending: true;
+    isLoadingError: false;
+    isRefetchError: false;
+    isFetchNextPageError: false;
+    isFetchPreviousPageError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "pending";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+} | {
+    error: null;
+    isError: false;
+    isPending: true;
+    isLoadingError: false;
+    isRefetchError: false;
+    isFetchNextPageError: false;
+    isFetchPreviousPageError: false;
+    isSuccess: false;
+    isPlaceholderData: false;
+    status: "pending";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+} | {
+    isError: false;
+    error: null;
+    isPending: false;
+    isLoadingError: false;
+    isRefetchError: false;
+    isSuccess: true;
+    isPlaceholderData: true;
+    isFetchNextPageError: false;
+    isFetchPreviousPageError: false;
+    status: "success";
+    fetchPreviousPage: (options?: import("@tanstack/react-query").FetchPreviousPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasPreviousPage: boolean;
+    isFetchingPreviousPage: boolean;
+    dataUpdatedAt: number;
+    errorUpdatedAt: number;
+    failureCount: number;
+    failureReason: Error | null;
+    errorUpdateCount: number;
+    isFetched: boolean;
+    isFetchedAfterMount: boolean;
+    isFetching: boolean;
+    isInitialLoading: boolean;
+    isPaused: boolean;
+    isRefetching: boolean;
+    isStale: boolean;
+    isEnabled: boolean;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
+    promise: Promise<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>>;
+    data: import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown> | undefined;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<BaseResponse<ICannedResponseItem[]>, unknown>, Error>>;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    isLoading: boolean;
+    dataFlatten: ICannedResponseItem[];
+};
+//# sourceMappingURL=useFetchCannedResponse.d.ts.map

package/dist/hooks/cannedResponse/useFetchCannedResponse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchCannedResponse.d.ts","sourceRoot":"","sources":["../../../src/hooks/cannedResponse/useFetchCannedResponse.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,2BAA2B,EAC5B,MAAM,iBAAiB,CAAC;AAMzB,eAAO,MAAM,sBAAsB,GACjC,SAAS,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDrC,CAAC"}

package/dist/hooks/cannedResponse/useFetchCannedResponse.js

@@ -0,0 +1,55 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { useInfiniteQuery } from "@tanstack/react-query";
+import { QUERY_KEYS } from "../../services/query";
+import { apiInstance } from "../../services/api";
+import { ENDPOINTS } from "../../services/routes";
+import { PAGE_SIZE } from "../../constants";
+import { useMemo } from "react";
+export const useFetchCannedResponse = (payload) => {
+    const _a = useInfiniteQuery({
+        initialPageParam: 1,
+        queryKey: [QUERY_KEYS.GET_CANNED_RESPONSES, payload],
+        queryFn: async ({ pageParam = 1 }) => {
+            const params = Object.assign(Object.assign({ pageSize: (payload === null || payload === void 0 ? void 0 : payload.pageSize) || PAGE_SIZE }, payload), { page: pageParam });
+            const res = await apiInstance.get(ENDPOINTS.chatService.getCannedResponses, {
+                params,
+            });
+            return res.data;
+        },
+        getNextPageParam: (lastPage) => {
+            var _a, _b;
+            const pageSize = (payload === null || payload === void 0 ? void 0 : payload.pageSize) || PAGE_SIZE;
+            const dataLength = ((_a = lastPage === null || lastPage === void 0 ? void 0 : lastPage.data) === null || _a === void 0 ? void 0 : _a.length) || 0;
+            const currentPage = ((_b = lastPage === null || lastPage === void 0 ? void 0 : lastPage.pageable) === null || _b === void 0 ? void 0 : _b.pageNumber) || 1;
+            return dataLength < pageSize ? undefined : currentPage + 1;
+        },
+        enabled: (payload === null || payload === void 0 ? void 0 : payload.visibilityScope) === "PRIVATE" || !!(payload === null || payload === void 0 ? void 0 : payload.teamId),
+    }), { data, fetchNextPage, hasNextPage, isFetchingNextPage, isLoading } = _a, rest = __rest(_a, ["data", "fetchNextPage", "hasNextPage", "isFetchingNextPage", "isLoading"]);
+    const { dataFlatten } = useMemo(() => {
+        var _a, _b;
+        if (!data)
+            return {
+                dataFlatten: [],
+            };
+        const allItems = ((_b = (_a = data === null || data === void 0 ? void 0 : data.pages) === null || _a === void 0 ? void 0 : _a.flatMap) === null || _b === void 0 ? void 0 : _b.call(_a, (page) => page.data)) || [];
+        return {
+            dataFlatten: allItems,
+        };
+    }, [data]);
+    return Object.assign({ data,
+        fetchNextPage,
+        hasNextPage,
+        isFetchingNextPage,
+        isLoading,
+        dataFlatten }, rest);
+};

package/dist/hooks/message/useMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useMessage.ts"],"names":[],"mappings":"AACA,OAAO,EAAY,WAAW,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAQ7E,eAAO,MAAM,kBAAkB,eAe9B,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,iBAAiB,MAAM,EACvB,oBAAoB,MAAM;;;;;qBAML,WAAW,EAAE;;;;;;qBAAb,WAAW,EAAE;;;;;;CAkNnC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,SAAS,WAAW,SACpB,CAAC;AAChC,eAAO,MAAM,gBAAgB,GAAI,SAAS,WAAW,SACpB,CAAC;AAClC,eAAO,MAAM,gBAAgB,GAAI,aAAa,MAAM,SACf,CAAC;AAEtC,eAAO,MAAM,kBAAkB,GAC7B,aAAa,WAAW,EAAE,EAC1B,SAAS,WAAW,EACpB,WAAW,MAAM,GAAG,MAAM,KACzB,WAAW,GAAG,SAkBhB,CAAC"}
+{"version":3,"file":"useMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useMessage.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,WAAW,EACX,WAAW,EAEZ,MAAM,yBAAyB,CAAC;AAQjC,eAAO,MAAM,kBAAkB,eAe9B,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,iBAAiB,MAAM,EACvB,oBAAoB,MAAM;;;;;qBAML,WAAW,EAAE;;;;;;qBAAb,WAAW,EAAE;;;;;;CAgPnC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,SAAS,WAAW,SACpB,CAAC;AAChC,eAAO,MAAM,gBAAgB,GAAI,SAAS,WAAW,SACpB,CAAC;AAClC,eAAO,MAAM,gBAAgB,GAAI,aAAa,MAAM,SACf,CAAC;AAEtC,eAAO,MAAM,kBAAkB,GAC7B,aAAa,WAAW,EAAE,EAC1B,SAAS,WAAW,EACpB,WAAW,MAAM,GAAG,MAAM,KACzB,WAAW,GAAG,SAkBhB,CAAC"}

package/dist/hooks/message/useMessage.js

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { ViewType, MessageType } from "@openim/wasm-client-sdk";
+import { ViewType, MessageType, } from "@openim/wasm-client-sdk";
 import { DChatSDK } from "../../constants/sdk";
 import { useLatest, useRequest } from "ahooks";
 import emitter, { emit } from "../../utils/events";
@@ -135,11 +135,27 @@ export const useMessage = (conversationId, searchClientMsgID) => {
         };
         const updateOneMessage = (message) => {
             setLoadState((preState) => {
+                var _a, _b, _c, _d;
                 const tmpList = [...preState.messageList];
                 const idx = tmpList.findIndex((msg) => msg.clientMsgID === message.clientMsgID);
                 if (idx < 0) {
                     return preState;
                 }
+                const isRevoked = message.contentType === MessageType.RevokeMessage;
+                if (isRevoked) {
+                    const relatedQuoteMessageIds = (_a = tmpList === null || tmpList === void 0 ? void 0 : tmpList.filter((msg) => {
+                        var _a, _b;
+                        return (msg === null || msg === void 0 ? void 0 : msg.contentType) === MessageType.QuoteMessage &&
+                            ((_b = (_a = msg === null || msg === void 0 ? void 0 : msg.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage) === null || _b === void 0 ? void 0 : _b.clientMsgID) ===
+                                (message === null || message === void 0 ? void 0 : message.clientMsgID);
+                    })) === null || _a === void 0 ? void 0 : _a.map((msg) => msg === null || msg === void 0 ? void 0 : msg.clientMsgID);
+                    for (const relatedQuoteMessageId of relatedQuoteMessageIds || []) {
+                        const relatedQuoteMessageIdx = tmpList.findIndex((msg) => msg.clientMsgID === relatedQuoteMessageId);
+                        if (relatedQuoteMessageIdx >= 0) {
+                            tmpList[relatedQuoteMessageIdx] = Object.assign(Object.assign({}, tmpList[relatedQuoteMessageIdx]), { quoteElem: Object.assign(Object.assign({}, (_b = tmpList[relatedQuoteMessageIdx]) === null || _b === void 0 ? void 0 : _b.quoteElem), { quoteMessage: Object.assign(Object.assign({}, (_d = (_c = tmpList[relatedQuoteMessageIdx]) === null || _c === void 0 ? void 0 : _c.quoteElem) === null || _d === void 0 ? void 0 : _d.quoteMessage), { contentType: MessageType.RevokeMessage }) }) });
+                        }
+                    }
+                }
                 tmpList[idx] = Object.assign(Object.assign({}, tmpList[idx]), message);
                 return Object.assign(Object.assign({}, preState), { messageList: tmpList });
             });

package/dist/hooks/team/useFetchMyTeam.d.ts

@@ -0,0 +1,3 @@
+import { IMyTeamResponse } from "../../types/dto";
+export declare const useFetchMyTeams: () => import("@tanstack/react-query").UseQueryResult<IMyTeamResponse[], Error>;
+//# sourceMappingURL=useFetchMyTeam.d.ts.map

package/dist/hooks/team/useFetchMyTeam.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchMyTeam.d.ts","sourceRoot":"","sources":["../../../src/hooks/team/useFetchMyTeam.ts"],"names":[],"mappings":"AAIA,OAAO,EAAgB,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEhE,eAAO,MAAM,eAAe,gFASxB,CAAC"}

package/dist/hooks/team/useFetchMyTeam.js

@@ -0,0 +1,12 @@
+import { useQuery } from "@tanstack/react-query";
+import { QUERY_KEYS } from "../../services/query";
+import { apiInstance } from "../../services/api";
+import { ENDPOINTS } from "../../services/routes";
+export const useFetchMyTeams = () => useQuery({
+    queryKey: [QUERY_KEYS.GET_MY_TEAMS],
+    queryFn: async () => {
+        var _a;
+        const res = await apiInstance.get(ENDPOINTS.chatService.getMyTeams);
+        return ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) || [];
+    },
+});

package/dist/locales/vi/common.json

@@ -90,5 +90,13 @@
   "sessions_heading": "PHIÊN HỖ TRỢ",
   "reply_to": "Đang trả lời {{name}}",
   "your_self": "chính mình",
-  "replied_to": "{{from}} đã trả lời {{to}}"
+  "canned_responses": "Câu trả lời nhanh",
+  "team": "Team",
+  "personal": "Cá nhân",
+  "no_canned_response": "Không tìm thấy kết quả phù hợp",
+  "add_canned_response": "Thêm câu trả lời nhanh",
+  "canned_response_quick_search_placeholder": "Câu trả lời nhanh phù hợp với",
+  "replied_yourself": "đã trả lời chính mình",
+  "replied_you": "đã trả lời bạn",
+  "replied": "đã trả lời"
 }

package/dist/screens/deskMessage/index.d.ts

@@ -1,3 +1,6 @@
-declare const DChatDeskMessage: () => import("react/jsx-runtime").JSX.Element;
+interface DChatDeskMessageProps {
+    openCreateCannedModal?: () => void;
+}
+declare const DChatDeskMessage: ({ openCreateCannedModal }: DChatDeskMessageProps) => import("react/jsx-runtime").JSX.Element;
 export default DChatDeskMessage;
 //# sourceMappingURL=index.d.ts.map

package/dist/screens/deskMessage/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/screens/deskMessage/index.tsx"],"names":[],"mappings":"AAWA,QAAA,MAAM,gBAAgB,+CA8BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/screens/deskMessage/index.tsx"],"names":[],"mappings":"AAWA,UAAU,qBAAqB;IAC7B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AAED,QAAA,MAAM,gBAAgB,GAAI,2BAA2B,qBAAqB,4CA+BzE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/screens/deskMessage/index.js

@@ -8,10 +8,10 @@ import { ConnectStatus, SyncStatus } from "../../types/chat";
 import useConversationStore from "../../store/conversation";
 import DeskAssignedSession from "../../components/session/DeskAssignedSession";
 import ThreadInfo from "../../components/thread/ThreadInfo";
-const DChatDeskMessage = () => {
+const DChatDeskMessage = ({ openCreateCannedModal }) => {
     const selectedConversationId = useConversationStore((state) => state.selectedConversationId);
     const searchClientMsgID = useConversationStore((state) => state.searchClientMsgID);
     const { connectStatus, syncStatus } = useChatContext();
-    return (_jsx(_Fragment, { children: connectStatus === ConnectStatus.Connected ? (_jsx(Spin, { spinning: syncStatus === SyncStatus.Loading, children: _jsxs("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: [_jsx(DeskAssignedSession, {}), _jsx(DeskConversationList, {}), _jsx(MessageList, { conversationId: selectedConversationId, searchClientMsgID: searchClientMsgID }), _jsx(ThreadInfo, {})] }) })) : (_jsx("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: connectStatus === ConnectStatus.Connecting && _jsx(Spin, { fullscreen: true }) })) }));
+    return (_jsx(_Fragment, { children: connectStatus === ConnectStatus.Connected ? (_jsx(Spin, { spinning: syncStatus === SyncStatus.Loading, children: _jsxs("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: [_jsx(DeskAssignedSession, {}), _jsx(DeskConversationList, {}), _jsx(MessageList, { conversationId: selectedConversationId, searchClientMsgID: searchClientMsgID, openCreateCannedModal: openCreateCannedModal }), _jsx(ThreadInfo, {})] }) })) : (_jsx("div", { className: "flex flex-1 flex-row h-screen bg-gray-50", children: connectStatus === ConnectStatus.Connecting && _jsx(Spin, { fullscreen: true }) })) }));
 };
 export default DChatDeskMessage;

package/dist/services/query.d.ts

@@ -14,5 +14,8 @@ export declare const QUERY_KEYS: {
     GET_LABEL_SESSION: string;
     GET_TEAM_SUPPORTERS: string;
     ASSIGN_SESSION: string;
+    GET_MY_TEAMS: string;
+    GET_CANNED_CATEGORIES: string;
+    GET_CANNED_RESPONSES: string;
 };
 //# sourceMappingURL=query.d.ts.map

package/dist/services/query.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"query.d.ts","sourceRoot":"","sources":["../../src/services/query.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;CAgBtB,CAAC"}
+{"version":3,"file":"query.d.ts","sourceRoot":"","sources":["../../src/services/query.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;CAmBtB,CAAC"}

package/dist/services/query.js

@@ -14,4 +14,7 @@ export const QUERY_KEYS = {
     GET_LABEL_SESSION: "GET_LABEL_SESSION",
     GET_TEAM_SUPPORTERS: "GET_TEAM_SUPPORTERS",
     ASSIGN_SESSION: "ASSIGN_SESSION",
+    GET_MY_TEAMS: "GET_MY_TEAMS_PACKAGE",
+    GET_CANNED_CATEGORIES: "GET_CANNED_CATEGORIES_PACKAGE",
+    GET_CANNED_RESPONSES: "GET_CANNED_RESPONSES_PACKAGE",
 };

package/dist/services/routes.d.ts

@@ -15,6 +15,9 @@ export declare const ENDPOINTS: {
         getLabelSession: string;
         getTeamSupporters: (teamId: string) => string;
         assignSession: (sessionId: string) => string;
+        getMyTeams: string;
+        getCannedCategories: string;
+        getCannedResponses: string;
     };
     identityService: {
         getToken: string;

package/dist/services/routes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"routes.d.ts","sourceRoot":"","sources":["../../src/services/routes.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;mCAMS,MAAM;;0CAGC,MAAM,UAAU,MAAM;6BAEnC,MAAM;;oDAEiB,MAAM;uCAEnB,MAAM;kCAEX,MAAM;;oCAGJ,MAAM;mCAEP,MAAM;;;;;;;;CASpC,CAAC"}
+{"version":3,"file":"routes.d.ts","sourceRoot":"","sources":["../../src/services/routes.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;;;;;mCAMS,MAAM;;0CAGC,MAAM,UAAU,MAAM;6BAEnC,MAAM;;oDAEiB,MAAM;uCAEnB,MAAM;kCAEX,MAAM;;oCAGJ,MAAM;mCAEP,MAAM;;;;;;;;;;;CAYpC,CAAC"}

package/dist/services/routes.js

@@ -15,6 +15,9 @@ export const ENDPOINTS = {
         getLabelSession: "chat-service/v1/labels",
         getTeamSupporters: (teamId) => `chat-service/v1/crm/teams/${teamId}/supporters`,
         assignSession: (sessionId) => `chat-service/v1/crm/sessions/${sessionId}/assign`,
+        getMyTeams: "/chat-service/v1/crm/teams/user/me",
+        getCannedCategories: "/chat-service/v1/crm/canned-responses/categories",
+        getCannedResponses: "chat-service/v1/crm/canned-responses/search",
     },
     identityService: {
         getToken: "/identity-service/v1/identity/get-token",