@droppii-org/chat-sdk 0.1.5 → 0.1.7

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

@@ -1 +1 @@
-{"version":3,"file":"EnterHandler.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/EnterHandler.tsx"],"names":[],"mappings":"AAuBA,MAAM,CAAC,OAAO,UAAU,YAAY,SAmGnC"}
+{"version":3,"file":"EnterHandler.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/EnterHandler.tsx"],"names":[],"mappings":"AAuBA,MAAM,CAAC,OAAO,UAAU,YAAY,SAiHnC"}

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

@@ -7,9 +7,10 @@ import { $isListNode, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND
 import { $isQuoteNode } from "@lexical/rich-text";
 import { useMessageFooterContext } from ".";
 import useConversationStore from "../../../store/conversation";
+import { emit } from "../../../utils/events";
 export default function EnterHandler() {
     const [editor] = useLexicalComposerContext();
-    const { onSendMessage, listUploadFiles } = useMessageFooterContext();
+    const { onSendMessage, isInternal, listUploadFiles, isOpenCanned, activeCannedIndex, } = useMessageFooterContext();
     const shiftEnterCount = useRef(0);
     const quotedMessage = useConversationStore((state) => state.quotedMessage);
     useEffect(() => {
@@ -18,6 +19,10 @@ export default function EnterHandler() {
             if (!event.shiftKey) {
                 event.preventDefault();
                 shiftEnterCount.current = 0;
+                if (isOpenCanned) {
+                    emit("CANNED_RESPONSE_SELECT", activeCannedIndex);
+                    return true;
+                }
                 let plainText = "";
                 let richText = "";
                 // lấy plain text & html
@@ -34,6 +39,7 @@ export default function EnterHandler() {
                         plainText,
                         richText,
                         type: hasFiles ? "file" : "text",
+                        isInternal,
                     });
                 }
                 editor.update(() => {
@@ -85,6 +91,9 @@ export default function EnterHandler() {
         listUploadFiles,
         quotedMessage,
         quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID,
+        isInternal,
+        isOpenCanned,
+        activeCannedIndex,
     ]);
     return null;
 }

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

@@ -1,7 +1,7 @@
 import { MessageFooterContextType } from "../../../types/chat";
-import { ISessionByStatus } from "../../../store/type";
+import { ISessionResponse } from "../../../types/dto";
 interface MessageFooterProps {
-    currentSession?: ISessionByStatus;
+    currentSession?: ISessionResponse;
     openCreateCannedModal?: () => void;
 }
 export declare const MessageFooterContext: import("react").Context<MessageFooterContextType>;

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":"AAYA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAK/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAQvD,UAAU,kBAAkB;IAC1B,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AASD,eAAO,MAAM,oBAAoB,mDAM/B,CAAC;AAEH,eAAO,MAAM,uBAAuB,gCAAyC,CAAC;AAE9E,QAAA,MAAM,qBAAqB,GAAI,4CAG5B,kBAAkB,4CAiHpB,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"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"}

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

@@ -1,16 +1,14 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { LexicalComposer } from "@lexical/react/LexicalComposer";
-import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
-import { ContentEditable } from "@lexical/react/LexicalContentEditable";
-import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
 import { ToolbarPlugin } from "./ToolbarPlugin";
 import { LinkPlugin } from "@lexical/react/LexicalLinkPlugin";
 import { ListPlugin } from "@lexical/react/LexicalListPlugin";
 import { editorTheme, editorNodes, editorOnError } from "./editorConfig";
-import { createContext, useCallback, useContext, useState } from "react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useState, } from "react";
 import EnterHandler from "./EnterHandler";
 import ActionBar from "./ActionBar";
+import { AccountType, } from "../../../types/chat";
 import { useSendMessage } from "../../../hooks/message/useSendMessage";
 import { Popover } from "antd";
 import FilePreview from "./FilePreview";
@@ -21,6 +19,9 @@ import CannedResponse from "../../cannedResponse";
 import { CannedResponseTriggerPlugin } from "./CannedResponsePlugin";
 import { useBoolean } from "ahooks";
 import useAuthStore from "../../../store/auth";
+import { useCurrentUserAccountType } from "../../../hooks/user/useCurrentUserAccountType";
+import ComposerTabs from "./ComposerTabs";
+import ComposerEditor from "./ComposerEditor";
 const initialConfig = {
     namespace: "ChatInput",
     theme: editorTheme,
@@ -29,22 +30,43 @@ const initialConfig = {
 };
 export const MessageFooterContext = createContext({
     onSendMessage: () => { },
+    isInternal: false,
+    setIsInternal: () => { },
     listUploadFiles: [],
     setListUploadFiles: () => { },
     isOpenCanned: false,
     setIsOpenCanned: () => { },
+    activeCannedIndex: 0,
+    setActiveCannedIndex: () => { },
+    maxActiveCannedIndex: 0,
+    setMaxActiveCannedIndex: () => { },
 });
 export const useMessageFooterContext = () => useContext(MessageFooterContext);
 const MessageFooterProvider = ({ currentSession, openCreateCannedModal, }) => {
     const { t } = useTranslation();
     const { sendTextMessage, sendMergeMessage } = useSendMessage();
+    const accountType = useCurrentUserAccountType();
     const [listUploadFiles, setListUploadFiles] = useState([]);
-    const [isOpenCanned, { setTrue: openCanned, setFalse: closeCanned, toggle: toggleCanned },] = useBoolean(false);
+    const [isOpenCanned, { setTrue: openCanned, setFalse: closeCanned },] = useBoolean(false);
     const isCrm = useAuthStore((state) => state.isCrm);
     const [cannedQuery, setCannedQuery] = useState("");
-    const onSendMessage = useCallback(async ({ plainText, richText, type, }) => {
+    const [activeCannedIndex, setActiveCannedIndex] = useState(0);
+    const [maxActiveCannedIndex, setMaxActiveCannedIndex] = useState(0);
+    const [isInternal, setIsInternal] = useState(false);
+    const canUseInternal = accountType === AccountType.Staff;
+    useEffect(() => {
+        if (!canUseInternal && isInternal) {
+            setIsInternal(false);
+        }
+    }, [canUseInternal, isInternal]);
+    const placeholderText = useMemo(() => {
+        return isInternal
+            ? t("enter_internal_message")
+            : t("enter_message");
+    }, [isInternal, t]);
+    const onSendMessage = useCallback(async ({ plainText, richText, type, isInternal, }) => {
         if (type === "text") {
-            sendTextMessage({ plainText, richText, currentSession });
+            sendTextMessage({ plainText, richText, currentSession, isInternal });
         }
         else {
             sendMergeMessage({
@@ -52,6 +74,7 @@ const MessageFooterProvider = ({ currentSession, openCreateCannedModal, }) => {
                 richText,
                 files: listUploadFiles,
                 currentSession,
+                isInternal,
             });
         }
         setListUploadFiles([]);
@@ -64,14 +87,27 @@ const MessageFooterProvider = ({ currentSession, openCreateCannedModal, }) => {
         setCannedQuery(query);
         openCanned();
     }, [openCanned]);
+    const setIsOpenCanned = useCallback((open) => {
+        if (open) {
+            openCanned();
+            return;
+        }
+        closeCanned();
+    }, [closeCanned, openCanned]);
     return (_jsx(MessageFooterContext.Provider, { value: {
             onSendMessage,
+            isInternal,
+            setIsInternal,
             listUploadFiles,
             setListUploadFiles,
             isOpenCanned,
-            setIsOpenCanned: toggleCanned,
+            setIsOpenCanned,
+            activeCannedIndex,
+            setActiveCannedIndex,
+            maxActiveCannedIndex,
+            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, {}), _jsx("div", { className: "relative px-4", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: "border border-indigo-500 rounded-md bg-blue-100 min-h-[64px] max-h-[140px] overflow-y-auto px-3 py-2 text-sm" }), ErrorBoundary: LexicalErrorBoundary, "aria-placeholder": t("enter_message"), placeholder: _jsx("div", { className: "absolute top-2 left-7 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: t("enter_message") }) }) }) }), _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, 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/QuoteMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuoteMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/QuoteMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAe,MAAM,yBAAyB,CAAC;AAUnE,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,QAAA,MAAM,gBAAgB,GAAI,2CAIvB,qBAAqB,4CAuGvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"QuoteMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/QuoteMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAe,MAAM,yBAAyB,CAAC;AAUnE,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAKD,QAAA,MAAM,gBAAgB,GAAI,2CAIvB,qBAAqB,4CA0GvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -5,62 +5,71 @@ import { useTranslation } from "react-i18next";
 import clsx from "clsx";
 import MediaPreviewIcon from "../MediaPreviewIcon";
 import useAuthStore from "../../../store/auth";
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 import useConversationStore from "../../../store/conversation";
+const capitalize = (text) => text ? text.charAt(0).toUpperCase() + text.slice(1) : "";
 const QuoteMessageItem = ({ message, isMine, onPressQuoteMessage, }) => {
     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 isChatSupport = useMemo(() => {
+        var _a, _b, _c;
+        try {
+            return (_c = (_b = (_a = JSON.parse((conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex) || "{}")) === null || _a === void 0 ? void 0 : _a.sessionInfo) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.botId;
+        }
+        catch (_d) {
+            return false;
+        }
+    }, [conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex]);
+    const getDisplayName = useCallback(({ name, id }) => {
+        if (!name)
+            return "";
+        if (!isCrm && isChatSupport) {
+            return conversationData === null || conversationData === void 0 ? void 0 : conversationData.showName;
+        }
+        if (id === userID)
+            return t("you");
+        return name;
+    }, [isCrm, isChatSupport, conversationData === null || conversationData === void 0 ? void 0 : conversationData.showName, userID, t]);
     const parseReplyText = useCallback(() => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        var _a;
         const quoteMsg = (_a = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _a === void 0 ? void 0 : _a.quoteMessage;
+        if (!quoteMsg)
+            return "";
         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 senderName = message === null || message === void 0 ? void 0 : message.senderNickname;
         const targetName = quoteMsg === null || quoteMsg === void 0 ? void 0 : quoteMsg.senderNickname;
-        const isSelfReply = senderID && targetID && senderID === targetID;
+        const isSelfReply = 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
+        const senderDisplay = getDisplayName({ name: senderName, id: senderID });
+        const targetDisplay = getDisplayName({ name: targetName, id: targetID });
         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")}`;
+                ? capitalize(t("replied_yourself"))
+                : `${senderDisplay} ${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)}`;
+            return `${capitalize(t("replied"))} ${targetDisplay}`;
         }
-        // 3. người khác reply mình
         if (isReplyToMe) {
-            return `${formatName(senderName || "")} ${t("replied_you")}`;
+            return `${senderDisplay} ${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: () => {
+        return `${senderDisplay} ${t("replied")} ${targetDisplay}`;
+    }, [
+        message,
+        userID,
+        isCrm,
+        isChatSupport,
+        conversationData,
+        t,
+        getDisplayName,
+    ]);
+    const replyText = useMemo(() => parseReplyText(), [parseReplyText]);
+    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: replyText })] }), _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: (_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) || "") })] })] }));

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,IAAI,eAAe,EAG/B,MAAM,yBAAyB,CAAC;AA2BjC,UAAU,gBAAgB;IACxB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,QAAA,MAAM,WAAW,GAAI,2HAQlB,gBAAgB,mDA0PlB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,WAAW,IAAI,eAAe,EAG/B,MAAM,yBAAyB,CAAC;AA2BjC,UAAU,gBAAgB;IACxB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED,QAAA,MAAM,WAAW,GAAI,2HAQlB,gBAAgB,mDAsQlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

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

@@ -102,6 +102,7 @@ const MessageItem = ({ message, allMessages, contextMenuOpen, onContextMenuOpenC
             console.log("Failed to parse conversationData.ex");
         }
     }, [conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex, isCrm, isMine]);
+    const isInternalMessage = Boolean(message === null || message === void 0 ? void 0 : message.isInternal);
     const hasContextMenu = contextMenuItems.length > 0;
     const isLatestMine = ((_a = allMessages.find((m) => m.sendID === userID)) === null || _a === void 0 ? void 0 : _a.clientMsgID) ===
         message.clientMsgID;
@@ -114,6 +115,9 @@ const MessageItem = ({ message, allMessages, contextMenuOpen, onContextMenuOpenC
     const showTimeBreak = prevTimeBreak;
     const showSenderAvatar = !nextSameUser;
     const showSenderName = !prevSameUser && !isMine;
+    if (!isCrm && isInternalMessage) {
+        return null;
+    }
     if (!isCrm &&
         (MessageType.CustomMessage === (message === null || message === void 0 ? void 0 : message.contentType) ||
             !visibleTypeMessage.includes(message === null || message === void 0 ? void 0 : message.contentType))) {
@@ -121,7 +125,13 @@ 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 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: {
+                    }) }) })), _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) => {

package/dist/components/session/DeskAssignedSession.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DeskAssignedSession.d.ts","sourceRoot":"","sources":["../../../src/components/session/DeskAssignedSession.tsx"],"names":[],"mappings":"AAgBA,QAAA,MAAM,mBAAmB,+CA+NxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"DeskAssignedSession.d.ts","sourceRoot":"","sources":["../../../src/components/session/DeskAssignedSession.tsx"],"names":[],"mappings":"AAeA,QAAA,MAAM,mBAAmB,+CA2ExB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/session/DeskAssignedSession.js

@@ -1,128 +1,33 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useBoolean } from "ahooks";
-import { Button, Layout, Menu } from "antd";
-import { useEffect, useMemo } from "react";
+import { Button, Layout } from "antd";
+import { useCallback, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { Icon } from "../icon";
 import { useGetSessionSummary } from "../../hooks/session/useGetSessionSummary";
 import useSessionStore from "../../store/session";
-import clsx from "clsx";
-import { SessionStatus, SessionTag } from "../../types/chat";
 import emitter from "../../utils/events";
+import DeskTeamInbox from "./DeskTeamInbox";
+import SessionFilterMenu from "./SessionFilterMenu";
 const { Sider } = Layout;
 const DeskAssignedSession = () => {
     const { t } = useTranslation();
     const [collapsed, { toggle }] = useBoolean(false);
     const setFilterSummary = useSessionStore((state) => state.setFilterSummary);
+    const filterSummary = useSessionStore((state) => state.filterSummary);
     const { data: sessionSummary, refetch } = useGetSessionSummary();
-    const menuItems = useMemo(() => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-        return [
-            {
-                label: t("active_sessions"),
-                key: "ACTIVE_SESSIONS",
-                icon: _jsx(Icon, { icon: "chat-dot-o", size: 20 }),
-                children: [
-                    {
-                        label: t("unassigned"),
-                        key: SessionStatus.UNASSIGNED,
-                        icon: (_jsx(Icon, { icon: "user-del-o", size: 18, className: "!text-amber-500" })),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: SessionStatus.UNASSIGNED,
-                                tag: undefined,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500 ", children: ((_b = (_a = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _a === void 0 ? void 0 : _a.find((s) => s.type === SessionStatus.UNASSIGNED)) === null || _b === void 0 ? void 0 : _b.count) || "" })),
-                    },
-                    {
-                        label: t("slow_processing"),
-                        key: SessionTag.SLOW_PROCESSING,
-                        icon: (_jsx(Icon, { icon: "warning-square-o", size: 18, className: "!text-red-500" })),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: undefined,
-                                tag: SessionTag.SLOW_PROCESSING,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_d = (_c = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.tagCounts) === null || _c === void 0 ? void 0 : _c.find((s) => s.type === SessionTag.SLOW_PROCESSING)) === null || _d === void 0 ? void 0 : _d.count) || "" })),
-                    },
-                    {
-                        label: t("waiting_process"),
-                        key: SessionStatus.WAITING_PROCESS,
-                        icon: (_jsx(Icon, { icon: "time-circle-o", size: 18, className: "!text-orange-400" })),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: SessionStatus.WAITING_PROCESS,
-                                tag: undefined,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_f = (_e = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _e === void 0 ? void 0 : _e.find((s) => s.type === SessionStatus.WAITING_PROCESS)) === null || _f === void 0 ? void 0 : _f.count) || "" })),
-                    },
-                    {
-                        label: t("awaiting_reply"),
-                        key: SessionTag.AWAITING_REPLY,
-                        icon: (_jsx(Icon, { icon: "arrow-reply-o", size: 18, className: "!text-purple-500" })),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: undefined,
-                                tag: SessionTag.AWAITING_REPLY,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_h = (_g = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.tagCounts) === null || _g === void 0 ? void 0 : _g.find((s) => s.type === SessionTag.AWAITING_REPLY)) === null || _h === void 0 ? void 0 : _h.count) || "" })),
-                    },
-                    {
-                        label: t("in_process"),
-                        key: SessionStatus.IN_PROCESS,
-                        icon: _jsx(Icon, { icon: "play-circle-o", size: 18 }),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: SessionStatus.IN_PROCESS,
-                                tag: undefined,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_k = (_j = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _j === void 0 ? void 0 : _j.find((s) => s.type === SessionStatus.IN_PROCESS)) === null || _k === void 0 ? void 0 : _k.count) || "" })),
-                    },
-                    {
-                        label: t("temporarily_paused"),
-                        key: SessionTag.TEMPORARILY_PAUSED,
-                        icon: _jsx(Icon, { icon: "pause-o", size: 18 }),
-                        onClick: () => {
-                            setFilterSummary({
-                                status: undefined,
-                                tag: SessionTag.TEMPORARILY_PAUSED,
-                            });
-                        },
-                        itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_m = (_l = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.tagCounts) === null || _l === void 0 ? void 0 : _l.find((s) => s.type === SessionTag.TEMPORARILY_PAUSED)) === null || _m === void 0 ? void 0 : _m.count) || "" })),
-                    },
-                ],
-                itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: ((_p = (_o = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _o === void 0 ? void 0 : _o.find((s) => s.type === SessionStatus.IN_PROCESS)) === null || _p === void 0 ? void 0 : _p.count) || "" })),
-            },
-            {
-                label: t("closed_sessions"),
-                key: "CLOSED_SESSIONS",
-                icon: _jsx(Icon, { icon: "check-square-o", size: 20 }),
-                onClick: () => {
-                    setFilterSummary({
-                        status: SessionStatus.COMPLETED,
-                        tag: undefined,
-                    });
-                },
-                itemIcon: !collapsed && (_jsx("span", { className: "text-xs text-gray-500", children: (sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.completedSessionCount) || "" })),
-            },
-        ];
-    }, [sessionSummary, t, collapsed]);
+    const onFilterSelect = useCallback((filter) => setFilterSummary(filter), [setFilterSummary]);
     useEffect(() => {
-        emitter.on("UPDATE_SESSION", () => {
-            refetch();
-        });
+        const handler = () => refetch();
+        emitter.on("UPDATE_SESSION", handler);
         return () => {
-            emitter.off("UPDATE_SESSION", () => {
-                refetch();
-            });
+            emitter.off("UPDATE_SESSION", handler);
         };
-    }, []);
-    return (_jsxs(Sider, { collapsible: true, collapsed: collapsed, onCollapse: toggle, width: 220, className: "bg-white h-full border-r border-gray-200", trigger: null, children: [_jsxs("div", { className: clsx("flex items-center p-4 border-b", collapsed ? "justify-center" : "justify-between"), children: [!collapsed && (_jsx("span", { className: "text-md font-semibold flex-1 truncate", children: "Droppii Livechat" })), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: collapsed ? "angle-right-o" : "angle-left-o", size: 22 }) })] }), _jsx(Menu, { defaultSelectedKeys: [SessionStatus.IN_PROCESS], defaultOpenKeys: ["ACTIVE_SESSIONS"], mode: "inline", items: menuItems, inlineIndent: 12, expandIcon: _jsx("span", { className: "text-xs text-gray-500", children: sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.activeSessionCount }) })] }));
+    }, [refetch]);
+    if (collapsed) {
+        return (_jsx("div", { className: "flex flex-col items-center pt-4 border-r border-gray-200 bg-white", children: _jsx(Button, { type: "text", shape: "circle", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "angle-right-o", size: 22 }) }) }));
+    }
+    return (_jsx(Sider, { collapsible: true, collapsed: false, width: 220, className: "bg-white h-full border-r border-gray-200", trigger: null, children: _jsxs("div", { className: "flex flex-col h-full", children: [_jsxs("div", { className: "flex items-center justify-between p-4 border-b shrink-0", children: [_jsx("span", { className: "text-md font-semibold flex-1 truncate", children: "Droppii Livechat" }), _jsx(Button, { type: "text", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "angle-left-o", size: 22 }) })] }), _jsxs("div", { className: "flex-1 overflow-y-auto min-h-0", children: [_jsx("div", { className: "px-4 pt-4 pb-2 text-xs font-semibold text-gray-400 tracking-wider", children: t("my_messages") }), sessionSummary && (_jsx(SessionFilterMenu, { summary: sessionSummary, isActive: !filterSummary.teamId, filterSummary: filterSummary, onFilterSelect: onFilterSelect, activeCount: sessionSummary.activeSessionCount })), _jsx(DeskTeamInbox, {})] })] }) }));
 };
 export default DeskAssignedSession;

package/dist/components/session/DeskTeamInbox.d.ts

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

package/dist/components/session/DeskTeamInbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeskTeamInbox.d.ts","sourceRoot":"","sources":["../../../src/components/session/DeskTeamInbox.tsx"],"names":[],"mappings":"AAuDA,QAAA,MAAM,aAAa,sDAyElB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/session/DeskTeamInbox.js

@@ -0,0 +1,56 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../icon";
+import { useGetTeamSessionSummary } from "../../hooks/session/useGetTeamSessionSummary";
+import useSessionStore from "../../store/session";
+import emitter from "../../utils/events";
+import SessionFilterMenu from "./SessionFilterMenu";
+const TeamGroup = memo(({ team, isExpanded, isSelected, selectedFilter, onToggle, onFilterSelect, }) => (_jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-2 cursor-pointer hover:bg-gray-50", onClick: onToggle, children: [_jsx("span", { className: "text-sm font-semibold text-blue-500 truncate flex-1", children: team.teamName }), _jsx(Icon, { icon: isExpanded ? "angle-up-o" : "angle-down-o", size: 16, className: "text-gray-400 shrink-0" })] }), isExpanded && (_jsx(SessionFilterMenu, { summary: team.summary, isActive: isSelected, filterSummary: selectedFilter, onFilterSelect: onFilterSelect, includeUnassigned: true, activeCount: team.summary.activeSessionCount }))] })));
+const DeskTeamInbox = () => {
+    const { t } = useTranslation();
+    const { data: teamSummaries, refetch } = useGetTeamSessionSummary();
+    const filterSummary = useSessionStore((s) => s.filterSummary);
+    const setFilterSummary = useSessionStore((s) => s.setFilterSummary);
+    const [expandedTeamIds, setExpandedTeamIds] = useState([]);
+    const initializedRef = useRef(false);
+    useEffect(() => {
+        if ((teamSummaries === null || teamSummaries === void 0 ? void 0 : teamSummaries.length) && !initializedRef.current) {
+            setExpandedTeamIds([teamSummaries[0].teamId]);
+            initializedRef.current = true;
+        }
+    }, [teamSummaries]);
+    useEffect(() => {
+        const handler = () => refetch();
+        emitter.on("UPDATE_SESSION", handler);
+        return () => {
+            emitter.off("UPDATE_SESSION", handler);
+        };
+    }, [refetch]);
+    const toggleTeam = useCallback((teamId) => {
+        setExpandedTeamIds((prev) => prev.includes(teamId)
+            ? prev.filter((id) => id !== teamId)
+            : [...prev, teamId]);
+    }, []);
+    const toggleHandlers = useMemo(() => {
+        if (!teamSummaries)
+            return {};
+        return Object.fromEntries(teamSummaries.map((team) => [
+            team.teamId,
+            () => toggleTeam(team.teamId),
+        ]));
+    }, [teamSummaries, toggleTeam]);
+    const filterHandlers = useMemo(() => {
+        if (!teamSummaries)
+            return {};
+        return Object.fromEntries(teamSummaries.map((team) => [
+            team.teamId,
+            (filter) => setFilterSummary(Object.assign(Object.assign({}, filter), { teamId: team.teamId })),
+        ]));
+    }, [teamSummaries, setFilterSummary]);
+    if (!(teamSummaries === null || teamSummaries === void 0 ? void 0 : teamSummaries.length))
+        return null;
+    return (_jsxs("div", { children: [_jsx("div", { className: "px-4 pt-4 pb-2 text-xs font-semibold text-gray-400 tracking-wider", children: t("team_messages") }), teamSummaries.map((team) => (_jsx(TeamGroup, { team: team, isExpanded: expandedTeamIds.includes(team.teamId), isSelected: filterSummary.teamId === team.teamId, selectedFilter: filterSummary, onToggle: toggleHandlers[team.teamId], onFilterSelect: filterHandlers[team.teamId] }, team.teamId)))] }));
+};
+export default DeskTeamInbox;

package/dist/components/session/SessionFilterMenu.d.ts

@@ -0,0 +1,13 @@
+import { IFilterSummary } from "../../store/type";
+import { ISessionSummaryResponse } from "../../types/dto";
+interface SessionFilterMenuProps {
+    summary: ISessionSummaryResponse;
+    isActive: boolean;
+    filterSummary: IFilterSummary;
+    onFilterSelect: (filter: IFilterSummary) => void;
+    includeUnassigned?: boolean;
+    activeCount?: number;
+}
+declare const SessionFilterMenu: ({ summary, isActive, filterSummary, onFilterSelect, includeUnassigned, activeCount, }: SessionFilterMenuProps) => import("react/jsx-runtime").JSX.Element;
+export default SessionFilterMenu;
+//# sourceMappingURL=SessionFilterMenu.d.ts.map

package/dist/components/session/SessionFilterMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SessionFilterMenu.d.ts","sourceRoot":"","sources":["../../../src/components/session/SessionFilterMenu.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAG1D,UAAU,sBAAsB;IAC9B,OAAO,EAAE,uBAAuB,CAAC;IACjC,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,cAAc,CAAC;IAC9B,cAAc,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;IACjD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAaD,QAAA,MAAM,iBAAiB,GAAI,uFAOxB,sBAAsB,4CAiCxB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/session/SessionFilterMenu.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Menu } from "antd";
+import { SessionStatus } from "../../types/chat";
+import { buildSessionMenuItems } from "./sessionMenuItems";
+const getSelectedKeys = (isActive, filterSummary) => {
+    if (!isActive)
+        return [];
+    if (filterSummary.status === SessionStatus.COMPLETED)
+        return [SessionStatus.COMPLETED];
+    const key = filterSummary.status || filterSummary.tag;
+    return key ? [key] : [];
+};
+const SessionFilterMenu = ({ summary, isActive, filterSummary, onFilterSelect, includeUnassigned = false, activeCount, }) => {
+    const { t } = useTranslation();
+    const selectedKeys = useMemo(() => getSelectedKeys(isActive, filterSummary), [isActive, filterSummary]);
+    const menuItems = useMemo(() => buildSessionMenuItems({
+        summary,
+        t,
+        onFilterSelect,
+        includeUnassigned,
+    }), [summary, t, onFilterSelect, includeUnassigned]);
+    return (_jsx(Menu, { selectedKeys: selectedKeys, defaultOpenKeys: ["ACTIVE_SESSIONS"], mode: "inline", items: menuItems, inlineIndent: 12, expandIcon: activeCount ? (_jsx("span", { className: "text-xs", children: activeCount })) : undefined }));
+};
+export default SessionFilterMenu;