@droppii-org/chat-sdk 0.0.30 → 0.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (166) hide show
  1. package/dist/assets/conversationBg.png +0 -0
  2. package/dist/assets/images/conversationBg.png +0 -0
  3. package/dist/assets/images/imageFailed.png +0 -0
  4. package/dist/assets/sdk/sql-wasm.wasm +0 -0
  5. package/dist/assets/sdk/version +1 -0
  6. package/dist/assets/sdk/wasm_exec.js +575 -0
  7. package/dist/assets/svg/document.d.ts +2 -0
  8. package/dist/assets/svg/document.d.ts.map +1 -0
  9. package/dist/assets/svg/document.js +2 -0
  10. package/dist/assets/svg/document.tsx +37 -0
  11. package/dist/assets/svg/index.d.ts +2 -0
  12. package/dist/assets/svg/index.d.ts.map +1 -0
  13. package/dist/assets/svg/index.js +1 -0
  14. package/dist/assets/svg/index.ts +1 -0
  15. package/dist/components/chatBubble/ChatBubble.d.ts.map +1 -1
  16. package/dist/components/chatBubble/ChatBubble.js +6 -11
  17. package/dist/components/conversation/ConversationBySessionItem.d.ts +7 -0
  18. package/dist/components/conversation/ConversationBySessionItem.d.ts.map +1 -0
  19. package/dist/components/conversation/ConversationBySessionItem.js +97 -0
  20. package/dist/components/conversation/ConversationItemList.d.ts +7 -0
  21. package/dist/components/conversation/ConversationItemList.d.ts.map +1 -0
  22. package/dist/components/conversation/ConversationItemList.js +20 -0
  23. package/dist/components/conversation/DeskConversationList.d.ts +1 -5
  24. package/dist/components/conversation/DeskConversationList.d.ts.map +1 -1
  25. package/dist/components/conversation/DeskConversationList.js +33 -87
  26. package/dist/components/mediaCollection/FileCollection.d.ts +3 -0
  27. package/dist/components/mediaCollection/FileCollection.d.ts.map +1 -0
  28. package/dist/components/mediaCollection/FileCollection.js +52 -0
  29. package/dist/components/mediaCollection/ImageCollection.d.ts +3 -0
  30. package/dist/components/mediaCollection/ImageCollection.d.ts.map +1 -0
  31. package/dist/components/mediaCollection/ImageCollection.js +51 -0
  32. package/dist/components/mediaCollection/LinkCollection.d.ts +3 -0
  33. package/dist/components/mediaCollection/LinkCollection.d.ts.map +1 -0
  34. package/dist/components/mediaCollection/LinkCollection.js +8 -0
  35. package/dist/components/mediaCollection/VideoCollection.d.ts +3 -0
  36. package/dist/components/mediaCollection/VideoCollection.d.ts.map +1 -0
  37. package/dist/components/mediaCollection/VideoCollection.js +50 -0
  38. package/dist/components/mediaCollection/index.d.ts +10 -0
  39. package/dist/components/mediaCollection/index.d.ts.map +1 -0
  40. package/dist/components/mediaCollection/index.js +58 -0
  41. package/dist/components/message/MessageHeader.d.ts.map +1 -1
  42. package/dist/components/message/MessageHeader.js +2 -1
  43. package/dist/components/message/MessageList.d.ts.map +1 -1
  44. package/dist/components/message/MessageList.js +14 -2
  45. package/dist/components/message/footer/FilePreview.d.ts +0 -1
  46. package/dist/components/message/footer/FilePreview.d.ts.map +1 -1
  47. package/dist/components/message/footer/FilePreview.js +4 -4
  48. package/dist/components/message/footer/ToolbarPlugin.d.ts.map +1 -1
  49. package/dist/components/message/footer/ToolbarPlugin.js +3 -6
  50. package/dist/components/message/footer/index.js +1 -1
  51. package/dist/components/message/item/FileMessage.d.ts.map +1 -1
  52. package/dist/components/message/item/FileMessage.js +2 -1
  53. package/dist/components/message/item/ImageMessage.js +3 -3
  54. package/dist/components/message/item/TextMessage.js +2 -2
  55. package/dist/components/message/item/index.js +1 -1
  56. package/dist/components/searchConversation/SearchAll.d.ts +3 -0
  57. package/dist/components/searchConversation/SearchAll.d.ts.map +1 -0
  58. package/dist/components/searchConversation/SearchAll.js +8 -0
  59. package/dist/components/searchConversation/SearchConversationAsMessages.d.ts +3 -0
  60. package/dist/components/searchConversation/SearchConversationAsMessages.d.ts.map +1 -0
  61. package/dist/components/searchConversation/SearchConversationAsMessages.js +8 -0
  62. package/dist/components/searchConversation/SearchConversationAsUsers.d.ts +3 -0
  63. package/dist/components/searchConversation/SearchConversationAsUsers.d.ts.map +1 -0
  64. package/dist/components/searchConversation/SearchConversationAsUsers.js +8 -0
  65. package/dist/components/searchConversation/index.d.ts +8 -0
  66. package/dist/components/searchConversation/index.d.ts.map +1 -0
  67. package/dist/components/searchConversation/index.js +38 -0
  68. package/dist/components/session/AssignedSessionFilter.js +9 -10
  69. package/dist/components/session/DeskAssignedSession.d.ts +3 -0
  70. package/dist/components/session/DeskAssignedSession.d.ts.map +1 -0
  71. package/dist/components/session/DeskAssignedSession.js +118 -0
  72. package/dist/constants/images.d.ts +5 -0
  73. package/dist/constants/images.d.ts.map +1 -0
  74. package/dist/constants/images.js +7 -0
  75. package/dist/context/ChatContext.d.ts +2 -1
  76. package/dist/context/ChatContext.d.ts.map +1 -1
  77. package/dist/context/ChatContext.js +17 -24
  78. package/dist/hooks/collection/useMediaCollection.d.ts +229 -0
  79. package/dist/hooks/collection/useMediaCollection.d.ts.map +1 -0
  80. package/dist/hooks/collection/useMediaCollection.js +66 -0
  81. package/dist/hooks/common/useIsMobile.d.ts +2 -0
  82. package/dist/hooks/common/useIsMobile.d.ts.map +1 -0
  83. package/dist/hooks/common/useIsMobile.js +15 -0
  84. package/dist/hooks/conversation/useConversation.js +1 -1
  85. package/dist/hooks/conversation/useConversationStore.d.ts +3 -2
  86. package/dist/hooks/conversation/useConversationStore.d.ts.map +1 -1
  87. package/dist/hooks/global/useGlobalEvent.d.ts.map +1 -1
  88. package/dist/hooks/global/useGlobalEvent.js +55 -6
  89. package/dist/hooks/init/useChatToken.d.ts +2 -0
  90. package/dist/hooks/init/useChatToken.d.ts.map +1 -0
  91. package/dist/hooks/init/useChatToken.js +11 -0
  92. package/dist/hooks/message/useSendMessage.d.ts.map +1 -1
  93. package/dist/hooks/message/useSendMessage.js +31 -12
  94. package/dist/hooks/search/useSearchConversation.d.ts +2 -0
  95. package/dist/hooks/search/useSearchConversation.d.ts.map +1 -0
  96. package/dist/hooks/search/useSearchConversation.js +1 -0
  97. package/dist/hooks/session/useGetSessionByTagOrStatus.d.ts +220 -0
  98. package/dist/hooks/session/useGetSessionByTagOrStatus.d.ts.map +1 -0
  99. package/dist/hooks/session/useGetSessionByTagOrStatus.js +72 -0
  100. package/dist/hooks/session/useGetSessionSummary.d.ts +3 -0
  101. package/dist/hooks/session/useGetSessionSummary.d.ts.map +1 -0
  102. package/dist/hooks/session/useGetSessionSummary.js +14 -0
  103. package/dist/index.d.ts +5 -5
  104. package/dist/index.d.ts.map +1 -1
  105. package/dist/index.js +3 -4
  106. package/dist/layout/index.d.ts.map +1 -1
  107. package/dist/layout/index.js +2 -5
  108. package/dist/locales/i18n.d.ts +3 -0
  109. package/dist/locales/i18n.d.ts.map +1 -0
  110. package/dist/locales/i18n.js +16 -0
  111. package/dist/locales/i18n.ts +18 -0
  112. package/dist/locales/vi/common.json +24 -0
  113. package/dist/screens/chatBubble/index.d.ts.map +1 -1
  114. package/dist/screens/chatBubble/index.js +20 -10
  115. package/dist/screens/deskMessage/index.d.ts.map +1 -1
  116. package/dist/screens/deskMessage/index.js +4 -4
  117. package/dist/services/api.d.ts +2 -0
  118. package/dist/services/api.d.ts.map +1 -0
  119. package/dist/services/api.js +16 -0
  120. package/dist/services/query.d.ts +7 -0
  121. package/dist/services/query.d.ts.map +1 -0
  122. package/dist/services/query.js +6 -0
  123. package/dist/services/routes.d.ts +15 -0
  124. package/dist/services/routes.d.ts.map +1 -0
  125. package/dist/services/routes.js +14 -0
  126. package/dist/store/auth.d.ts +4 -0
  127. package/dist/store/auth.d.ts.map +1 -0
  128. package/dist/store/auth.js +16 -0
  129. package/dist/store/conversation.d.ts.map +1 -1
  130. package/dist/store/conversation.js +0 -11
  131. package/dist/store/session.d.ts +8 -0
  132. package/dist/store/session.d.ts.map +1 -0
  133. package/dist/store/session.js +10 -0
  134. package/dist/styles/global.css +1 -1
  135. package/dist/types/chat.d.ts +10 -4
  136. package/dist/types/chat.d.ts.map +1 -1
  137. package/dist/types/dto.d.ts +55 -0
  138. package/dist/types/dto.d.ts.map +1 -0
  139. package/dist/types/dto.js +1 -0
  140. package/dist/utils/common.d.ts +2 -0
  141. package/dist/utils/common.d.ts.map +1 -0
  142. package/dist/utils/common.js +12 -0
  143. package/dist/utils/imCommon.d.ts +0 -1
  144. package/dist/utils/imCommon.d.ts.map +1 -1
  145. package/dist/utils/imCommon.js +0 -5
  146. package/package.json +15 -3
  147. package/dist/assets/openIM.wasm +0 -0
  148. package/dist/components/ChatBubble.d.ts +0 -10
  149. package/dist/components/ChatBubble.d.ts.map +0 -1
  150. package/dist/components/ChatBubble.js +0 -28
  151. package/dist/components/message/MessageItem.d.ts +0 -7
  152. package/dist/components/message/MessageItem.d.ts.map +0 -1
  153. package/dist/components/message/MessageItem.js +0 -21
  154. package/dist/components/message/footer/BottomSection.d.ts +0 -3
  155. package/dist/components/message/footer/BottomSection.d.ts.map +0 -1
  156. package/dist/components/message/footer/BottomSection.js +0 -6
  157. package/dist/screens/desk-message/index.d.ts +0 -3
  158. package/dist/screens/desk-message/index.d.ts.map +0 -1
  159. package/dist/screens/desk-message/index.js +0 -15
  160. package/dist/tsconfig.tsbuildinfo +0 -1
  161. package/dist/types/index.d.ts +0 -1
  162. package/dist/types/index.d.ts.map +0 -1
  163. package/dist/types/index.js +0 -1
  164. package/dist/types/sdk.d.ts +0 -1
  165. package/dist/types/sdk.d.ts.map +0 -1
  166. package/dist/types/sdk.js +0 -1
@@ -0,0 +1,58 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
+ import { useBoolean } from "ahooks";
4
+ import { Button, Drawer, Tabs } from "antd";
5
+ import { Icon } from "../icon";
6
+ import { useTranslation } from "react-i18next";
7
+ import ImageCollection from "./ImageCollection";
8
+ import VideoCollection from "./VideoCollection";
9
+ import { useIsMobile } from "../../hooks/common/useIsMobile";
10
+ import { useMemo } from "react";
11
+ import FileCollection from "./FileCollection";
12
+ import LinkCollection from "./LinkCollection";
13
+ export var MediaCollectionTabKey;
14
+ (function (MediaCollectionTabKey) {
15
+ MediaCollectionTabKey["Image"] = "image";
16
+ MediaCollectionTabKey["Video"] = "video";
17
+ MediaCollectionTabKey["File"] = "file";
18
+ MediaCollectionTabKey["Link"] = "link";
19
+ })(MediaCollectionTabKey || (MediaCollectionTabKey = {}));
20
+ export const TOP_OFFSET = 128; /// HEADER + TAB HEIGHT
21
+ const MediaCollection = () => {
22
+ const { t } = useTranslation();
23
+ const [isOpen, { toggle }] = useBoolean(false);
24
+ const isMobile = useIsMobile();
25
+ const items = useMemo(() => {
26
+ if (!isOpen)
27
+ return [];
28
+ return [
29
+ {
30
+ key: MediaCollectionTabKey.Image,
31
+ label: "Ảnh",
32
+ children: _jsx(ImageCollection, {}),
33
+ },
34
+ {
35
+ key: MediaCollectionTabKey.Video,
36
+ label: "Video",
37
+ children: _jsx(VideoCollection, {}),
38
+ },
39
+ {
40
+ key: MediaCollectionTabKey.File,
41
+ label: "Tập tin",
42
+ children: _jsx(FileCollection, {}),
43
+ },
44
+ {
45
+ key: MediaCollectionTabKey.Link,
46
+ label: "Liên kết",
47
+ children: _jsx(LinkCollection, {}),
48
+ },
49
+ ];
50
+ }, [isOpen]);
51
+ return (_jsxs(_Fragment, { children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "folder-o", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: toggle, mask: false, closeIcon: false, styles: {
52
+ body: {
53
+ padding: 0,
54
+ height: "100%",
55
+ },
56
+ }, getContainer: false, width: isMobile ? "100%" : 360, children: _jsxs("div", { className: "flex flex-col h-full", children: [_jsxs("div", { className: "flex items-center justify-between p-3", children: [_jsx("span", { className: "text-lg font-medium", children: t("library") }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "close-b", size: 22 }) })] }), _jsx("div", { className: "flex-1 overflow-hidden", children: _jsx(Tabs, { defaultActiveKey: MediaCollectionTabKey.Image, items: items, className: "h-full" }) })] }) })] }));
57
+ };
58
+ export default MediaCollection;
@@ -1 +1 @@
1
- {"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AAQA,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,GAAI,aAAa,kBAAkB,4CAkDrD,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AASA,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,GAAI,aAAa,kBAAkB,4CA4CrD,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -4,10 +4,11 @@ import { Avatar, Button } from "antd";
4
4
  import { Icon } from "../icon";
5
5
  import { useConversationDisplayData } from "../../hooks/conversation/useConversation";
6
6
  import useConversationStore from "../../store/conversation";
7
+ import MediaCollection from "../mediaCollection";
7
8
  const MessageHeader = ({ onClose }) => {
8
9
  var _a;
9
10
  const conversationData = useConversationStore((state) => state.conversationData);
10
11
  const { avatar, displayName } = useConversationDisplayData(conversationData);
11
- return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3", children: [_jsx(Avatar, { src: avatar, size: "large", 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 flex-1", children: [_jsx("p", { children: displayName || "" }), _jsx("p", { className: "text-xs text-gray-500", children: "2 thành viên" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", children: _jsx(Icon, { icon: "search-o", size: 22 }) }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", children: _jsx(Icon, { icon: "folder-o", size: 22 }) }), _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 }) }))] })] }));
12
+ return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3 bg-white", children: [_jsx(Avatar, { src: avatar, size: "large", 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 flex-1", children: [_jsx("p", { children: displayName || "" }), _jsx("p", { className: "text-xs text-gray-500", children: "2 thành viên" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", children: _jsx(Icon, { icon: "search-o", size: 22 }) }), _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 }) }))] })] }));
12
13
  };
13
14
  export default MessageHeader;
@@ -1 +1 @@
1
- {"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AAeA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAuE3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AAiBA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CA0F3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useMessage } from "../../hooks/message/useMessage";
4
- import { Spin } from "antd";
4
+ import { Empty, Spin } from "antd";
5
5
  import { useEffect, useMemo, useRef } from "react";
6
6
  import dayjs from "dayjs";
7
7
  import isToday from "dayjs/plugin/isToday";
@@ -10,12 +10,17 @@ import MessageItem from "./item";
10
10
  import InfiniteScroll from "react-infinite-scroll-component";
11
11
  import MessageHeader from "./MessageHeader";
12
12
  import MessageFooter from "./footer";
13
+ import { images } from "../../constants/images";
14
+ import { useTranslation } from "react-i18next";
15
+ import useConversationStore from "../../store/conversation";
13
16
  dayjs.extend(isToday);
14
17
  const MessageList = (props) => {
15
18
  var _a, _b, _c;
19
+ const { t } = useTranslation();
16
20
  const { onClose, conversationId } = props;
17
21
  const scrollRef = useRef(null);
18
22
  const { getMoreOldMessages, moreOldLoading, loadState, latestLoadState } = useMessage(conversationId);
23
+ const conversationData = useConversationStore((state) => state.conversationData);
19
24
  const lastMessage = useMemo(() => {
20
25
  var _a;
21
26
  const messageList = (_a = latestLoadState.current) === null || _a === void 0 ? void 0 : _a.messageList;
@@ -41,7 +46,14 @@ const MessageList = (props) => {
41
46
  emitter.off("CHAT_LIST_SCROLL_TO_BOTTOM", scrollToBottom);
42
47
  };
43
48
  }, []);
44
- return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full bg-white", children: [_jsx(MessageHeader, { onClose: onClose }), _jsx("div", { id: "scrollableDiv", style: {
49
+ if (!conversationData) {
50
+ return (_jsx("div", { className: "flex flex-1 items-center justify-center h-full", children: _jsx(Empty, { description: t("no_conversation_data") }) }));
51
+ }
52
+ return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full", style: {
53
+ backgroundImage: `url(${images.conversationBg})`,
54
+ backgroundSize: "cover",
55
+ backgroundPosition: "center",
56
+ }, children: [_jsx(MessageHeader, { onClose: onClose }), _jsx("div", { id: "scrollableDiv", style: {
45
57
  height: "100%",
46
58
  overflow: "auto",
47
59
  display: "flex",
@@ -1,4 +1,3 @@
1
- export declare const documentIcon: import("react/jsx-runtime").JSX.Element;
2
1
  interface ShortenOptions {
3
2
  maxLength?: number;
4
3
  keepStart?: number;
@@ -1 +1 @@
1
- {"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAYA,eAAO,MAAM,YAAY,yCAoCxB,CAAC;AAEF,UAAU,cAAc;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,GAAI,MAAM,MAAM,EAAE,UAAS,cAAmB,WAkBzE,CAAC;AAEF,QAAA,MAAM,WAAW,+CAkFhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAYA,UAAU,cAAc;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,GAAI,MAAM,MAAM,EAAE,UAAS,cAAmB,WAkBzE,CAAC;AAEF,QAAA,MAAM,WAAW,+CAkFhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -4,12 +4,12 @@ import { useCallback } from "react";
4
4
  import { useMessageFooterContext } from ".";
5
5
  import { Button } from "antd";
6
6
  import { Icon } from "../../icon";
7
+ import { documentIcon } from "../../../assets/svg";
7
8
  const documentTypes = [
8
9
  "application/pdf",
9
10
  "application/msword",
10
11
  "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
11
12
  ];
12
- export const documentIcon = (_jsxs("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M10.1923 5.83301L23.4363 5.83301L34.1656 14.2054V29.8639C34.1656 31.8997 32.5286 34.1663 29.8068 34.1663C27.0849 34.1663 10.1923 34.1663 10.1923 34.1663C7.4704 34.1663 5.8335 31.8997 5.8335 29.8639V10.0305C5.8335 7.99475 7.4704 5.83301 10.1923 5.83301Z", fill: "#24B0FF" }), _jsx("path", { d: "M10.8335 28.1394V20.833H16.0309V22.4222H12.7026V23.5916H15.3612V25.1708H12.7026V28.1394H10.8335Z", fill: "#edf6ff" }), _jsx("path", { d: "M19.0073 28.0885V20.833H20.8613V26.5118H24.0146V28.0885L19.0073 28.0885Z", fill: "#edf6ff" }), _jsx("path", { d: "M16.5918 28.1001V20.833H18.4485V28.1001H16.5918Z", fill: "#edf6ff" }), _jsx("path", { d: "M24.5737 20.833V28.1393H29.7723V26.5573H26.439L26.4422 25.1708H29.1017V23.5916H26.4422V22.4222H29.7723V20.833H24.5737Z", fill: "#edf6ff" }), _jsx("path", { opacity: "0.302", "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M23.2686 5.83301V14.2281H34.1655L23.2686 5.83301Z", fill: "#edf6ff" })] }));
13
13
  export const shortenFileName = (name, options = {}) => {
14
14
  const { maxLength = 20, keepStart = 8, keepEnd = 3 } = options;
15
15
  if (name.length <= maxLength)
@@ -31,7 +31,7 @@ const FilePreview = () => {
31
31
  setListUploadFiles(listUploadFiles.filter((f) => f.uid !== file.uid));
32
32
  };
33
33
  const renderFilePreview = useCallback((file) => {
34
- var _a, _b;
34
+ var _a, _b, _c;
35
35
  const isDocument = documentTypes.includes(((_a = file === null || file === void 0 ? void 0 : file.originFileObj) === null || _a === void 0 ? void 0 : _a.type) || "");
36
36
  const isVideo = (_b = file.type) === null || _b === void 0 ? void 0 : _b.startsWith("video/");
37
37
  let src = file.url;
@@ -39,10 +39,10 @@ const FilePreview = () => {
39
39
  src = URL.createObjectURL(file.originFileObj);
40
40
  }
41
41
  if (isDocument) {
42
- return (_jsxs("div", { className: "relative flex flex-row items-center gap-2 align-center bg-gray-100 rounded-md p-1 pr-2", children: [documentIcon, _jsx("span", { className: "text-xs text-gray-500", children: shortenFileName(file.name) }), _jsx(Button, { className: "absolute top-[-8px] right-[-8px] w-5 h-5 rounded-full p-0 bg-gray-500 hover:bg-gray-600", type: "primary", onClick: () => onRemoveFile(file), children: _jsx(Icon, { icon: "close-b", size: 12, color: "white" }) })] }, file.uid));
42
+ return (_jsxs("div", { className: "relative flex flex-row items-center gap-2 align-center bg-gray-100 rounded-md p-1 pr-2", children: [documentIcon, _jsx("span", { className: "text-xs text-gray-500", children: shortenFileName(((_c = file === null || file === void 0 ? void 0 : file.originFileObj) === null || _c === void 0 ? void 0 : _c.name) || "") }), _jsx(Button, { className: "absolute top-[-8px] right-[-8px] w-5 h-5 rounded-full p-0 bg-gray-500 hover:bg-gray-600", type: "primary", onClick: () => onRemoveFile(file), children: _jsx(Icon, { icon: "close-b", size: 12, color: "white" }) })] }, file.uid));
43
43
  }
44
44
  return (_jsxs("div", { className: "relative rounded-md border", children: [isVideo ? (_jsx("video", { src: src, className: "w-[48px] h-[48px] object-cover rounded-lg", autoPlay: false })) : (_jsx("img", { src: src, alt: file.name, className: "w-[48px] h-[48px] object-cover rounded-lg" })), _jsx(Button, { className: "absolute top-[-8px] right-[-8px] w-5 h-5 rounded-full p-0 bg-gray-500 hover:bg-gray-600", type: "primary", onClick: () => onRemoveFile(file), children: _jsx(Icon, { icon: "close-b", size: 12, color: "white" }) }), isVideo && (_jsx(Icon, { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2", icon: "play-b", size: 20, color: "white" }))] }, file.uid));
45
45
  }, [listUploadFiles]);
46
- return (_jsx("div", { className: "overflow-x-auto", children: _jsx("div", { className: "border-b py-2 px-4", children: _jsx("div", { className: "flex items-center gap-2", children: listUploadFiles.map((file) => renderFilePreview(file)) }) }) }));
46
+ return (_jsx("div", { className: "overflow-x-auto mb-[-4px]", children: _jsx("div", { className: "border-b py-2 px-4", children: _jsx("div", { className: "flex items-center gap-2", children: listUploadFiles.map((file) => renderFilePreview(file)) }) }) }));
47
47
  };
48
48
  export default FilePreview;
@@ -1 +1 @@
1
- {"version":3,"file":"ToolbarPlugin.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ToolbarPlugin.tsx"],"names":[],"mappings":"AAwFA,eAAO,MAAM,aAAa,+CAyNzB,CAAC"}
1
+ {"version":3,"file":"ToolbarPlugin.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ToolbarPlugin.tsx"],"names":[],"mappings":"AA4DA,eAAO,MAAM,aAAa,+CAwNzB,CAAC"}
@@ -9,7 +9,6 @@ import { useCallback, useEffect, useMemo, useState } from "react";
9
9
  import { BoldOutlined, ItalicOutlined, StrikethroughOutlined, OrderedListOutlined, UnorderedListOutlined, LinkOutlined, } from "@ant-design/icons";
10
10
  import { Button } from "antd";
11
11
  const quoteIcon = (_jsxs("svg", { width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M5.24615 10.5714C4.5616 10.5714 3.99078 10.5715 3.53762 10.5105C3.0593 10.4462 2.62745 10.3047 2.28042 9.95769C1.9334 9.61072 1.79194 9.17887 1.72763 8.70055C1.6667 8.24737 1.66673 7.67654 1.66675 6.99199V6.91274C1.66673 6.22819 1.6667 5.65734 1.72763 5.20419C1.79194 4.72586 1.9334 4.29401 2.28043 3.94699C2.62746 3.59997 3.0593 3.4585 3.53762 3.3942C3.99078 3.33327 4.56161 3.33329 5.24615 3.33331H5.32541C6.00995 3.33329 6.5808 3.33327 7.03397 3.3942C7.51228 3.4585 7.94413 3.59997 8.29116 3.94699C8.63817 4.29401 8.77966 4.72586 8.84396 5.20419C8.90491 5.65734 8.90484 6.22817 8.90484 6.91272V6.99198C8.90484 7.67652 8.90491 8.24737 8.84396 8.70055C8.77966 9.17887 8.63817 9.61072 8.29116 9.95769C7.94413 10.3047 7.51228 10.4462 7.03397 10.5105C6.5808 10.5715 6.00998 10.5714 5.32544 10.5714H5.24615Z", fill: "currentColor" }), _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M2.84403 16.1313C2.71884 15.7295 2.94301 15.3023 3.34474 15.1772C5.71249 14.4393 7.38095 12.3426 7.38095 9.914V6.76172C7.38095 6.34094 7.72207 5.99982 8.14286 5.99982C8.56366 5.99982 8.90476 6.34094 8.90476 6.76172V9.914C8.90476 13.0731 6.73976 15.7152 3.79812 16.6319C3.39638 16.7572 2.96923 16.533 2.84403 16.1313Z", fill: "currentColor" }), _jsx("path", { d: "M14.389 10.5714C13.7044 10.5714 13.1336 10.5715 12.6804 10.5105C12.2021 10.4462 11.7703 10.3047 11.4233 9.95769C11.0762 9.61072 10.9348 9.17887 10.8704 8.70055C10.8095 8.24737 10.8096 7.67654 10.8096 6.99199V6.91274C10.8096 6.22819 10.8095 5.65734 10.8704 5.20419C10.9348 4.72586 11.0762 4.29401 11.4233 3.94699C11.7703 3.59997 12.2021 3.4585 12.6804 3.3942C13.1336 3.33327 13.7044 3.33329 14.389 3.33331H14.4682C15.1528 3.33329 15.7236 3.33327 16.1768 3.3942C16.6551 3.4585 17.087 3.59997 17.4339 3.94699C17.781 4.29401 17.9225 4.72586 17.9868 5.20419C18.0477 5.65734 18.0477 6.22817 18.0477 6.91272V6.99198C18.0477 7.67652 18.0477 8.24737 17.9868 8.70055C17.9225 9.17887 17.781 9.61072 17.4339 9.95769C17.087 10.3047 16.6551 10.4462 16.1768 10.5105C15.7236 10.5715 15.1528 10.5714 14.4682 10.5714H14.389Z", fill: "currentColor" }), _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.9869 16.1313C11.8617 15.7295 12.0858 15.3023 12.4876 15.1772C14.8553 14.4393 16.5238 12.3426 16.5238 9.914V6.76172C16.5238 6.34094 16.8649 5.99982 17.2857 5.99982C17.7065 5.99982 18.0476 6.34094 18.0476 6.76172V9.914C18.0476 13.0731 15.8825 15.7152 12.9409 16.6319C12.5392 16.7572 12.112 16.533 11.9869 16.1313Z", fill: "currentColor" })] }));
12
- const codeIcon = (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.41925 6.07724C6.74925 6.40268 6.74925 6.93031 6.41925 7.25575L3.63676 9.99983L6.41925 12.7439C6.74925 13.0693 6.74925 13.597 6.41925 13.9224C6.08926 14.2479 5.55424 14.2479 5.22424 13.9224L1.96374 10.7069C1.56775 10.3164 1.56775 9.68325 1.96374 9.29272L5.22424 6.07724C5.55424 5.7518 6.08926 5.7518 6.41925 6.07724Z", fill: "currentColor" }), _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.5809 6.07724C13.2509 6.40268 13.2509 6.93031 13.5809 7.25575L16.3634 9.99983L13.5809 12.7439C13.2509 13.0693 13.2509 13.597 13.5809 13.9224C13.9109 14.2479 14.4459 14.2479 14.7759 13.9224L18.0364 10.7069C18.4324 10.3164 18.4324 9.68325 18.0364 9.29272L14.7759 6.07724C14.4459 5.7518 13.9109 5.7518 13.5809 6.07724Z", fill: "currentColor" }), _jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8957 3.36522C12.3382 3.49166 12.5945 3.9529 12.468 4.39543L9.13468 16.0621C9.00825 16.5046 8.54701 16.7609 8.10448 16.6344C7.66195 16.508 7.40571 16.0468 7.53214 15.6042L10.8655 3.93756C10.9919 3.49503 11.4532 3.23879 11.8957 3.36522Z", fill: "currentColor" })] }));
13
12
  export const ToolbarPlugin = () => {
14
13
  const [editor] = useLexicalComposerContext();
15
14
  const [activeMarks, setActiveMarks] = useState([]);
@@ -121,10 +120,8 @@ export const ToolbarPlugin = () => {
121
120
  marks.push("bold");
122
121
  if (selection.hasFormat("italic"))
123
122
  marks.push("italic");
124
- if (selection.hasFormat("underline"))
125
- marks.push("underline");
126
- if (selection.hasFormat("code"))
127
- marks.push("code");
123
+ if (selection.hasFormat("strikethrough"))
124
+ marks.push("strikethrough");
128
125
  // block
129
126
  const anchorNode = selection.anchor.getNode();
130
127
  const topLevelNode = anchorNode.getTopLevelElementOrThrow();
@@ -156,7 +153,7 @@ export const ToolbarPlugin = () => {
156
153
  removeSelectionListener();
157
154
  };
158
155
  }, [editor]);
159
- return (_jsxs("div", { className: "flex items-center gap-2 px-4", children: [formatTextButtons.map((button) => {
156
+ return (_jsxs("div", { className: "flex items-center gap-2 px-4 pt-1", children: [formatTextButtons.map((button) => {
160
157
  const { icon, onPress, key, isActive } = button;
161
158
  return (_jsx(Button, { type: "text", shape: "default", className: getButtonClasses(isActive), onClick: onPress, children: icon }, key));
162
159
  }), insertListButtons.map((button) => {
@@ -60,6 +60,6 @@ const MessageFooterProvider = (props) => {
60
60
  }
61
61
  setListUploadFiles([]);
62
62
  }, [sendMergeMessage, sendTextMessage, listUploadFiles]);
63
- return (_jsx(MessageFooterContext.Provider, { value: { onSendMessage, listUploadFiles, setListUploadFiles }, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsxs("div", { className: "border-t pb-2 flex flex-col gap-1", children: [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": "Nh\u1EADp tin nh\u1EAFn", placeholder: _jsx("div", { className: "absolute top-2 left-7 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: "Nh\u1EADp tin nh\u1EAFn" }) }) }) }), _jsx(ActionBar, {})] }), _jsx(LinkPlugin, {}), _jsx(ListPlugin, {}), _jsx(EnterHandler, {})] }) }));
63
+ return (_jsx(MessageFooterContext.Provider, { value: { onSendMessage, listUploadFiles, setListUploadFiles }, children: _jsxs(LexicalComposer, { initialConfig: initialConfig, children: [_jsxs("div", { className: "border-t pb-2 flex flex-col gap-1 bg-white", children: [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": "Nh\u1EADp tin nh\u1EAFn", placeholder: _jsx("div", { className: "absolute top-2 left-7 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: "Nh\u1EADp tin nh\u1EAFn" }) }) }) }), _jsx(ActionBar, {})] }), _jsx(LinkPlugin, {}), _jsx(ListPlugin, {}), _jsx(EnterHandler, {})] }) }));
64
64
  };
65
65
  export default MessageFooterProvider;
@@ -1 +1 @@
1
- {"version":3,"file":"FileMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/FileMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,QAAA,MAAM,eAAe,GAAI,OAAO,qBAAqB,4CAmCpD,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"FileMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/message/item/FileMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAItD,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,QAAA,MAAM,eAAe,GAAI,OAAO,qBAAqB,4CAmCpD,CAAC;AAEF,eAAe,eAAe,CAAC"}
@@ -1,5 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { documentIcon, shortenFileName } from "../footer/FilePreview";
2
+ import { shortenFileName } from "../footer/FilePreview";
3
+ import { documentIcon } from "../../../assets/svg";
3
4
  const FileMessageItem = (props) => {
4
5
  var _a;
5
6
  const { message } = props;
@@ -3,7 +3,7 @@ import { MessageStatus } from "@openim/wasm-client-sdk";
3
3
  import { Image, Spin } from "antd";
4
4
  const min = (a, b) => (a > b ? b : a);
5
5
  const ImageMessageItem = (props) => {
6
- var _a, _b, _c;
6
+ var _a, _b, _c, _d;
7
7
  const { message } = props;
8
8
  const imageHeight = message.pictureElem.sourcePicture.height;
9
9
  const imageWidth = message.pictureElem.sourcePicture.width;
@@ -11,8 +11,8 @@ const ImageMessageItem = (props) => {
11
11
  const minHeight = min(200, imageWidth) * (imageHeight / imageWidth) + 2;
12
12
  const adaptedHight = min(minHeight, snapshotMaxHeight) + 10;
13
13
  const adaptedWidth = min(imageWidth, 200) + 10;
14
- const sourceUrl = ((_c = message.pictureElem.snapshotPicture) === null || _c === void 0 ? void 0 : _c.url) ||
15
- message.pictureElem.sourcePicture.url;
14
+ const sourceUrl = ((_c = message.pictureElem.sourcePicture) === null || _c === void 0 ? void 0 : _c.url) ||
15
+ ((_d = message.pictureElem.snapshotPicture) === null || _d === void 0 ? void 0 : _d.url);
16
16
  const isSending = message.status === MessageStatus.Sending;
17
17
  const minStyle = {
18
18
  minHeight: `${adaptedHight}px`,
@@ -14,8 +14,8 @@ const TextMessageItem = (props) => {
14
14
  if (Object.keys(extendMessageInfo).length > 0 &&
15
15
  (extendMessageInfo === null || extendMessageInfo === void 0 ? void 0 : extendMessageInfo.messageInfo)) {
16
16
  const htmlContent = ((_b = (_a = extendMessageInfo === null || extendMessageInfo === void 0 ? void 0 : extendMessageInfo.messageInfo) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.content) || "";
17
- return (_jsx("div", { className: "text-sm sm:text-base break-words whitespace-pre-line flex-1", dangerouslySetInnerHTML: { __html: htmlContent } }));
17
+ return (_jsx("div", { className: "!text-sm sm:text-base break-words whitespace-pre-line flex-1", dangerouslySetInnerHTML: { __html: htmlContent } }));
18
18
  }
19
- return (_jsx("span", { className: "text-sm sm:text-base whitespace-pre-wrap", children: ((_c = message === null || message === void 0 ? void 0 : message.textElem) === null || _c === void 0 ? void 0 : _c.content) || "" }));
19
+ return (_jsx("span", { className: "!text-sm sm:text-base whitespace-pre-wrap", children: ((_c = message === null || message === void 0 ? void 0 : message.textElem) === null || _c === void 0 ? void 0 : _c.content) || "" }));
20
20
  };
21
21
  export default TextMessageItem;
@@ -52,7 +52,7 @@ const MessageItem = ({ groupMessage }) => {
52
52
  const isMine = (message === null || message === void 0 ? void 0 : message.sendID) === (user === null || user === void 0 ? void 0 : user.userID);
53
53
  const showAvatar = messageIndex === messagesInGroup.length - 1;
54
54
  const showSenderName = messageIndex === 0 && (message === null || message === void 0 ? void 0 : message.sessionType) === SessionType.Group;
55
- return (_jsx("div", { className: clsx("flex", isMine ? "justify-end" : "justify-start"), children: _jsxs("div", { className: clsx("flex flex-1 items-end gap-2", isMine ? "justify-end" : "justify-start"), children: [!isMine && (_jsx("div", { className: "flex items-center justify-center w-[32px] h-[32px]", children: showAvatar && (_jsx(Avatar, { children: ((_b = (_a = message === null || message === void 0 ? void 0 : message.senderNickname) === null || _a === void 0 ? void 0 : _a.charAt) === null || _b === void 0 ? void 0 : _b.call(_a, 0)) || "A" })) })), _jsxs("div", { className: clsx("flex flex-col flex-[0.8]", isMine ? "items-end" : "items-start"), children: [!isMine && showSenderName && (_jsx("span", { className: "text-xs text-gray-500 mb-1 px-3", children: message === null || message === void 0 ? void 0 : message.senderNickname })), _jsxs("div", { className: clsx("px-3 py-2 rounded-2xl max-w-full break-words flex flex-col flex-1 text-gray-900 gap-1", isMine ? "bg-blue-100" : "bg-gray-100"), children: [(message === null || message === void 0 ? void 0 : message.contentType) === MessageType.MergeMessage ? (_jsxs("div", { children: [(_d = (_c = message === null || message === void 0 ? void 0 : message.mergeElem) === null || _c === void 0 ? void 0 : _c.multiMessage) === null || _d === void 0 ? void 0 : _d.map((item) => {
55
+ return (_jsx("div", { className: clsx("flex", isMine ? "justify-end" : "justify-start"), children: _jsxs("div", { className: clsx("flex flex-1 items-end gap-2", isMine ? "justify-end" : "justify-start"), children: [!isMine && (_jsx("div", { className: "flex items-center justify-center w-[32px] h-[32px]", children: showAvatar && (_jsx(Avatar, { children: ((_b = (_a = message === null || message === void 0 ? void 0 : message.senderNickname) === null || _a === void 0 ? void 0 : _a.charAt) === null || _b === void 0 ? void 0 : _b.call(_a, 0)) || "A" })) })), _jsxs("div", { className: clsx("flex flex-col flex-[0.8]", isMine ? "items-end" : "items-start"), children: [!isMine && showSenderName && (_jsx("span", { className: "text-xs text-gray-500 mb-1 px-3", children: message === null || message === void 0 ? void 0 : message.senderNickname })), _jsxs("div", { className: clsx("px-3 py-2 rounded-2xl max-w-full break-words flex flex-col flex-1 text-gray-900 gap-1", isMine ? "bg-blue-100" : "bg-white"), children: [(message === null || message === void 0 ? void 0 : message.contentType) === MessageType.MergeMessage ? (_jsxs("div", { children: [(_d = (_c = message === null || message === void 0 ? void 0 : message.mergeElem) === null || _c === void 0 ? void 0 : _c.multiMessage) === null || _d === void 0 ? void 0 : _d.map((item) => {
56
56
  return renderMessageByType(item);
57
57
  }), (message === null || message === void 0 ? void 0 : message.textElem) && (_jsx(TextMessageItem, { message: message }))] })) : (renderMessageByType(message)), _jsx("span", { className: clsx("text-xs text-gray-500 text-right text-gray-500"), children: dayjs(message === null || message === void 0 ? void 0 : message.sendTime).format("HH:mm") })] })] })] }) }, message === null || message === void 0 ? void 0 : message.clientMsgID));
58
58
  })] }, groupMessage === null || groupMessage === void 0 ? void 0 : groupMessage.groupMessageID));
@@ -0,0 +1,3 @@
1
+ declare const SearchConversationAll: () => import("react/jsx-runtime").JSX.Element;
2
+ export default SearchConversationAll;
3
+ //# sourceMappingURL=SearchAll.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SearchAll.d.ts","sourceRoot":"","sources":["../../../src/components/searchConversation/SearchAll.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,qBAAqB,+CAI1B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { Empty } from "antd";
3
+ import { useTranslation } from "react-i18next";
4
+ const SearchConversationAll = () => {
5
+ const { t } = useTranslation();
6
+ return _jsx(Empty, { description: t("no_conversation") });
7
+ };
8
+ export default SearchConversationAll;
@@ -0,0 +1,3 @@
1
+ declare const SearchConversationAsMessages: () => import("react/jsx-runtime").JSX.Element;
2
+ export default SearchConversationAsMessages;
3
+ //# sourceMappingURL=SearchConversationAsMessages.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SearchConversationAsMessages.d.ts","sourceRoot":"","sources":["../../../src/components/searchConversation/SearchConversationAsMessages.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,4BAA4B,+CAIjC,CAAC;AAEF,eAAe,4BAA4B,CAAC"}
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { Empty } from "antd";
3
+ import { useTranslation } from "react-i18next";
4
+ const SearchConversationAsMessages = () => {
5
+ const { t } = useTranslation();
6
+ return _jsx(Empty, { description: t("no_conversation") });
7
+ };
8
+ export default SearchConversationAsMessages;
@@ -0,0 +1,3 @@
1
+ declare const SearchConversationAsUsers: () => import("react/jsx-runtime").JSX.Element;
2
+ export default SearchConversationAsUsers;
3
+ //# sourceMappingURL=SearchConversationAsUsers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SearchConversationAsUsers.d.ts","sourceRoot":"","sources":["../../../src/components/searchConversation/SearchConversationAsUsers.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,yBAAyB,+CAI9B,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { Empty } from "antd";
3
+ import { useTranslation } from "react-i18next";
4
+ const SearchConversationAsUsers = () => {
5
+ const { t } = useTranslation();
6
+ return _jsx(Empty, { description: t("no_conversation") });
7
+ };
8
+ export default SearchConversationAsUsers;
@@ -0,0 +1,8 @@
1
+ export declare enum SearchConversationTabKey {
2
+ All = "all",
3
+ Users = "users",
4
+ Messages = "messages"
5
+ }
6
+ declare const SearchConversation: () => import("react/jsx-runtime").JSX.Element;
7
+ export default SearchConversation;
8
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/searchConversation/index.tsx"],"names":[],"mappings":"AASA,oBAAY,wBAAwB;IAClC,GAAG,QAAQ;IACX,KAAK,UAAU;IACf,QAAQ,aAAa;CACtB;AAED,QAAA,MAAM,kBAAkB,+CA4BvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
@@ -0,0 +1,38 @@
1
+ "use client";
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import { Tabs } from "antd";
4
+ import { useMemo } from "react";
5
+ import { useTranslation } from "react-i18next";
6
+ import SearchConversationAll from "./SearchAll";
7
+ import SearchConversationAsUsers from "./SearchConversationAsUsers";
8
+ import SearchConversationAsMessages from "./SearchConversationAsMessages";
9
+ export var SearchConversationTabKey;
10
+ (function (SearchConversationTabKey) {
11
+ SearchConversationTabKey["All"] = "all";
12
+ SearchConversationTabKey["Users"] = "users";
13
+ SearchConversationTabKey["Messages"] = "messages";
14
+ })(SearchConversationTabKey || (SearchConversationTabKey = {}));
15
+ const SearchConversation = () => {
16
+ const { t } = useTranslation();
17
+ const items = useMemo(() => {
18
+ return [
19
+ {
20
+ key: SearchConversationTabKey.All,
21
+ label: t("all"),
22
+ children: _jsx(SearchConversationAll, {}),
23
+ },
24
+ {
25
+ key: SearchConversationTabKey.Users,
26
+ label: t("users"),
27
+ children: _jsx(SearchConversationAsUsers, {}),
28
+ },
29
+ {
30
+ key: SearchConversationTabKey.Messages,
31
+ label: t("messages"),
32
+ children: _jsx(SearchConversationAsMessages, {}),
33
+ },
34
+ ];
35
+ }, [t]);
36
+ return (_jsx("div", { children: _jsx(Tabs, { defaultActiveKey: SearchConversationTabKey.All, items: items }) }));
37
+ };
38
+ export default SearchConversation;
@@ -7,7 +7,6 @@ import { SESSION_STATUS_ENUM, TAG_ENUM } from "../../constants";
7
7
  const AssignedSessionFilter = ({ onFilterChange, className = "", }) => {
8
8
  const [expandedCategories, setExpandedCategories] = useState(new Set([0]));
9
9
  const [selectedFilter, setSelectedFilter] = useState(SESSION_STATUS_ENUM.UNASSIGNED);
10
- console.log({ selectedFilter });
11
10
  const summary = useConversationStore((state) => state.summary);
12
11
  const setFilterSummary = useConversationStore((state) => state.setFilterSummary);
13
12
  const messageCategories = useMemo(() => {
@@ -115,15 +114,15 @@ const AssignedSessionFilter = ({ onFilterChange, className = "", }) => {
115
114
  }
116
115
  setExpandedCategories(newExpanded);
117
116
  };
118
- const handleFilterSelect = (categoryId, subCategoryId) => {
119
- const filterId = subCategoryId || categoryId;
120
- setSelectedFilter(filterId);
121
- // Find the selected category and subcategory
122
- const category = messageCategories.find((cat) => cat.label === categoryId);
117
+ const handleFilterSelect = (categoryKey, subCategoryKey) => {
118
+ const filterKey = subCategoryKey || categoryKey;
119
+ setSelectedFilter(filterKey);
120
+ // Find the selected category and subcategory by key
121
+ const category = messageCategories.find((cat) => cat.key === categoryKey);
123
122
  let query;
124
123
  if (category) {
125
- if (subCategoryId && category.subCategories) {
126
- const subCategory = category.subCategories.find((sub) => sub.label === subCategoryId);
124
+ if (subCategoryKey && category.subCategories) {
125
+ const subCategory = category.subCategories.find((sub) => sub.key === subCategoryKey);
127
126
  query = subCategory === null || subCategory === void 0 ? void 0 : subCategory.query;
128
127
  }
129
128
  else {
@@ -133,14 +132,14 @@ const AssignedSessionFilter = ({ onFilterChange, className = "", }) => {
133
132
  if (query) {
134
133
  setFilterSummary(query);
135
134
  }
136
- onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange(categoryId, subCategoryId);
135
+ onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange(categoryKey, subCategoryKey);
137
136
  };
138
137
  return (_jsxs("div", { className: `w-64 bg-white border-r border-gray-200 flex flex-col ${className}`, children: [_jsx("div", { className: "p-4 border-b border-gray-200", children: _jsx("h2", { className: "text-lg font-semibold text-gray-800", children: "TIN NH\u1EAEN C\u1EE6A T\u00D4I" }) }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx("ul", { className: "py-2", children: messageCategories.map((category, index) => (_jsxs("li", { children: [_jsxs("button", { onClick: () => {
139
138
  if (category.subCategories) {
140
139
  toggleCategory(index);
141
140
  }
142
141
  else {
143
- handleFilterSelect(category.label);
142
+ handleFilterSelect(category.key);
144
143
  }
145
144
  }, className: `w-full flex items-center justify-between px-4 py-3 hover:bg-gray-50 transition-colors group ${selectedFilter === category.key && !category.subCategories
146
145
  ? "bg-blue-50 border-r-2 border-blue-500"
@@ -0,0 +1,3 @@
1
+ declare const DeskAssignedSession: () => import("react/jsx-runtime").JSX.Element;
2
+ export default DeskAssignedSession;
3
+ //# sourceMappingURL=DeskAssignedSession.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DeskAssignedSession.d.ts","sourceRoot":"","sources":["../../../src/components/session/DeskAssignedSession.tsx"],"names":[],"mappings":"AAeA,QAAA,MAAM,mBAAmB,+CAkNxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
@@ -0,0 +1,118 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { useBoolean } from "ahooks";
4
+ import { Button, Layout, Menu } from "antd";
5
+ import { useMemo } from "react";
6
+ import { useTranslation } from "react-i18next";
7
+ import { SESSION_STATUS_ENUM, TAG_ENUM } from "../../constants";
8
+ import { Icon } from "../icon";
9
+ import { useGetSessionSummary } from "../../hooks/session/useGetSessionSummary";
10
+ import useSessionStore from "../../store/session";
11
+ import clsx from "clsx";
12
+ const { Sider } = Layout;
13
+ const DeskAssignedSession = () => {
14
+ const { t } = useTranslation();
15
+ const [collapsed, { toggle }] = useBoolean(false);
16
+ const setFilterSummary = useSessionStore((state) => state.setFilterSummary);
17
+ const { data: sessionSummary } = useGetSessionSummary();
18
+ const menuItems = useMemo(() => {
19
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
20
+ return [
21
+ {
22
+ label: t("active_sessions"),
23
+ key: "ACTIVE_SESSIONS",
24
+ icon: _jsx(Icon, { icon: "chat-dot-o", size: 20 }),
25
+ children: [
26
+ {
27
+ label: t("unassigned"),
28
+ key: SESSION_STATUS_ENUM.UNASSIGNED,
29
+ icon: (_jsx(Icon, { icon: "user-del-o", size: 18, className: "text-orange-500" })),
30
+ onClick: () => {
31
+ setFilterSummary({
32
+ status: SESSION_STATUS_ENUM.UNASSIGNED,
33
+ tag: undefined,
34
+ });
35
+ },
36
+ extra: (_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 === SESSION_STATUS_ENUM.UNASSIGNED)) === null || _b === void 0 ? void 0 : _b.count) || "" })),
37
+ },
38
+ {
39
+ label: t("slow_processing"),
40
+ key: TAG_ENUM.SLOW_PROCESSING,
41
+ icon: (_jsx(Icon, { icon: "warning-square-o", size: 18, className: "text-red-500" })),
42
+ onClick: () => {
43
+ setFilterSummary({
44
+ status: undefined,
45
+ tag: TAG_ENUM.SLOW_PROCESSING,
46
+ });
47
+ },
48
+ extra: (_jsx("span", { className: "text-xs text-gray-500", children: ((_d = (_c = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _c === void 0 ? void 0 : _c.find((s) => s.type === TAG_ENUM.SLOW_PROCESSING)) === null || _d === void 0 ? void 0 : _d.count) || "" })),
49
+ },
50
+ {
51
+ label: t("waiting_process"),
52
+ key: SESSION_STATUS_ENUM.WAITING_PROCESS,
53
+ icon: (_jsx(Icon, { icon: "time-circle-o", size: 18, className: "text-orange-400" })),
54
+ onClick: () => {
55
+ setFilterSummary({
56
+ status: SESSION_STATUS_ENUM.WAITING_PROCESS,
57
+ tag: undefined,
58
+ });
59
+ },
60
+ extra: (_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 === SESSION_STATUS_ENUM.WAITING_PROCESS)) === null || _f === void 0 ? void 0 : _f.count) || "" })),
61
+ },
62
+ {
63
+ label: t("awaiting_reply"),
64
+ key: TAG_ENUM.AWAITING_REPLY,
65
+ icon: (_jsx(Icon, { icon: "arrow-reply-o", size: 18, className: "text-purple-500" })),
66
+ onClick: () => {
67
+ setFilterSummary({
68
+ status: undefined,
69
+ tag: TAG_ENUM.AWAITING_REPLY,
70
+ });
71
+ },
72
+ extra: (_jsx("span", { className: "text-xs text-gray-500", children: ((_h = (_g = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _g === void 0 ? void 0 : _g.find((s) => s.type === TAG_ENUM.AWAITING_REPLY)) === null || _h === void 0 ? void 0 : _h.count) || "" })),
73
+ },
74
+ {
75
+ label: t("in_process"),
76
+ key: SESSION_STATUS_ENUM.IN_PROCESS,
77
+ icon: _jsx(Icon, { icon: "play-circle-o", size: 18 }),
78
+ onClick: () => {
79
+ setFilterSummary({
80
+ status: SESSION_STATUS_ENUM.IN_PROCESS,
81
+ tag: undefined,
82
+ });
83
+ },
84
+ extra: (_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 === SESSION_STATUS_ENUM.IN_PROCESS)) === null || _k === void 0 ? void 0 : _k.count) || "" })),
85
+ },
86
+ {
87
+ label: t("temporarily_paused"),
88
+ key: TAG_ENUM.TEMPORARILY_PAUSED,
89
+ icon: _jsx(Icon, { icon: "pause-o", size: 18 }),
90
+ onClick: () => {
91
+ setFilterSummary({
92
+ status: undefined,
93
+ tag: TAG_ENUM.TEMPORARILY_PAUSED,
94
+ });
95
+ },
96
+ extra: (_jsx("span", { className: "text-xs text-gray-500", children: ((_m = (_l = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _l === void 0 ? void 0 : _l.find((s) => s.type === TAG_ENUM.TEMPORARILY_PAUSED)) === null || _m === void 0 ? void 0 : _m.count) || "" })),
97
+ },
98
+ ],
99
+ expandIcon: undefined,
100
+ extra: (_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 === SESSION_STATUS_ENUM.IN_PROCESS)) === null || _p === void 0 ? void 0 : _p.count) || "" })),
101
+ },
102
+ {
103
+ label: t("closed_sessions"),
104
+ key: "CLOSED_SESSIONS",
105
+ icon: _jsx(Icon, { icon: "check-square-o", size: 20 }),
106
+ onClick: () => {
107
+ setFilterSummary({
108
+ status: SESSION_STATUS_ENUM.COMPLETED,
109
+ tag: undefined,
110
+ });
111
+ },
112
+ extra: (_jsx("span", { className: "text-xs text-gray-500", children: ((_r = (_q = sessionSummary === null || sessionSummary === void 0 ? void 0 : sessionSummary.sessionStatuses) === null || _q === void 0 ? void 0 : _q.find((s) => s.type === SESSION_STATUS_ENUM.COMPLETED)) === null || _r === void 0 ? void 0 : _r.count) || "" })),
113
+ },
114
+ ];
115
+ }, [sessionSummary]);
116
+ 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 Staging" })), _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: [SESSION_STATUS_ENUM.UNASSIGNED], defaultOpenKeys: ["ACTIVE_SESSIONS"], mode: "inline", items: menuItems, inlineIndent: 12 })] }));
117
+ };
118
+ export default DeskAssignedSession;
@@ -0,0 +1,5 @@
1
+ export declare const images: {
2
+ conversationBg: string;
3
+ imageFailed: string;
4
+ };
5
+ //# sourceMappingURL=images.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"images.d.ts","sourceRoot":"","sources":["../../src/constants/images.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,MAAM;;;CAGlB,CAAC"}