@droppii-org/chat-sdk 0.1.50 → 0.1.52
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.
- package/dist/assets/svg/index.d.ts +0 -1
- package/dist/assets/svg/index.d.ts.map +1 -1
- package/dist/assets/svg/index.js +0 -1
- package/dist/assets/svg/index.ts +1 -2
- package/dist/components/biz-inbox/BizInboxHeader.js +1 -1
- package/dist/components/biz-inbox/BizThreadAvatar.js +2 -2
- package/dist/components/biz-inbox/BizThreadCard.d.ts.map +1 -1
- package/dist/components/biz-inbox/BizThreadCard.js +3 -11
- package/dist/components/biz-inbox/BizThreadTitle.js +1 -1
- package/dist/components/biz-thread-detail/BizMessageList.js +2 -2
- package/dist/components/biz-thread-detail/BizMoreOptionItem.js +2 -2
- package/dist/components/biz-thread-detail/BizThreadDetailHeader.js +2 -2
- package/dist/components/biz-thread-detail/BizThreadDetailInput.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/BizThreadDetailInput.js +12 -21
- package/dist/components/biz-thread-detail/index.d.ts +0 -4
- package/dist/components/biz-thread-detail/index.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/index.js +0 -2
- package/dist/components/conversation/ConversationBySessionItem.d.ts.map +1 -1
- package/dist/components/conversation/ConversationBySessionItem.js +6 -5
- package/dist/components/conversation/ThreadCard.d.ts +14 -0
- package/dist/components/conversation/ThreadCard.d.ts.map +1 -0
- package/dist/components/conversation/ThreadCard.js +16 -0
- package/dist/components/media-collection/ImageCollection.d.ts.map +1 -1
- package/dist/components/media-collection/ImageCollection.js +3 -17
- package/dist/components/message/MessageList.d.ts.map +1 -1
- package/dist/components/message/MessageList.js +1 -7
- package/dist/components/message/footer/ComposerTextSyncPlugin.d.ts +6 -0
- package/dist/components/message/footer/ComposerTextSyncPlugin.d.ts.map +1 -0
- package/dist/components/message/footer/ComposerTextSyncPlugin.js +16 -0
- package/dist/components/message/footer/FilePreview.d.ts +3 -2
- package/dist/components/message/footer/FilePreview.d.ts.map +1 -1
- package/dist/components/message/footer/FilePreview.js +61 -21
- package/dist/components/message/footer/LinkInputPreview.d.ts +7 -0
- package/dist/components/message/footer/LinkInputPreview.d.ts.map +1 -0
- package/dist/components/message/footer/LinkInputPreview.js +16 -0
- package/dist/components/message/footer/MediaActions.d.ts.map +1 -1
- package/dist/components/message/footer/MediaActions.js +8 -5
- package/dist/components/message/footer/index.d.ts.map +1 -1
- package/dist/components/message/footer/index.js +48 -35
- package/dist/components/message/item/FileMessage.d.ts +2 -2
- package/dist/components/message/item/FileMessage.d.ts.map +1 -1
- package/dist/components/message/item/FileMessage.js +20 -12
- package/dist/components/message/item/ImageMessage.d.ts.map +1 -1
- package/dist/components/message/item/ImageMessage.js +17 -15
- package/dist/components/message/item/LinkCard.d.ts +7 -0
- package/dist/components/message/item/LinkCard.d.ts.map +1 -0
- package/dist/components/message/item/LinkCard.js +17 -0
- package/dist/components/message/item/LinkText.d.ts +6 -0
- package/dist/components/message/item/LinkText.d.ts.map +1 -0
- package/dist/components/message/item/LinkText.js +13 -0
- package/dist/components/message/item/MergeImageMessage.d.ts +7 -0
- package/dist/components/message/item/MergeImageMessage.d.ts.map +1 -0
- package/dist/components/message/item/MergeImageMessage.js +30 -0
- package/dist/components/message/item/MessageBubble.d.ts +13 -0
- package/dist/components/message/item/MessageBubble.d.ts.map +1 -0
- package/dist/components/message/item/MessageBubble.js +23 -0
- package/dist/components/message/item/RevokeMessage.js +1 -1
- package/dist/components/message/item/TextMessage.d.ts.map +1 -1
- package/dist/components/message/item/TextMessage.js +20 -9
- package/dist/components/message/item/UrlTextMessage.d.ts.map +1 -1
- package/dist/components/message/item/UrlTextMessage.js +19 -17
- package/dist/components/message/item/VideoMessage.d.ts.map +1 -1
- package/dist/components/message/item/VideoMessage.js +10 -12
- package/dist/components/message/item/imagePreviewToolbar.d.ts +5 -0
- package/dist/components/message/item/imagePreviewToolbar.d.ts.map +1 -0
- package/dist/components/message/item/imagePreviewToolbar.js +14 -0
- package/dist/components/message/item/index.d.ts +2 -1
- package/dist/components/message/item/index.d.ts.map +1 -1
- package/dist/components/message/item/index.js +40 -44
- package/dist/components/message/item/mediaSize.d.ts +16 -0
- package/dist/components/message/item/mediaSize.d.ts.map +1 -0
- package/dist/components/message/item/mediaSize.js +20 -0
- package/dist/components/message/item/textStyle.d.ts +2 -0
- package/dist/components/message/item/textStyle.d.ts.map +1 -0
- package/dist/components/message/item/textStyle.js +1 -0
- package/dist/components/thread/ManualAssignPopover.js +1 -1
- package/dist/hooks/message/useSendMessage.d.ts +3 -10
- package/dist/hooks/message/useSendMessage.d.ts.map +1 -1
- package/dist/hooks/message/useSendMessage.js +27 -44
- package/dist/styles/global.css +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/utils/bizConversation.d.ts +1 -1
- package/dist/utils/bizConversation.js +2 -2
- package/dist/utils/bizMessage.d.ts +1 -14
- package/dist/utils/bizMessage.d.ts.map +1 -1
- package/dist/utils/bizMessage.js +0 -26
- package/dist/utils/common.d.ts +2 -1
- package/dist/utils/common.d.ts.map +1 -1
- package/dist/utils/common.js +9 -3
- package/dist/utils/fileValidation.d.ts +1 -0
- package/dist/utils/fileValidation.d.ts.map +1 -1
- package/dist/utils/fileValidation.js +10 -17
- package/dist/utils/link.d.ts +13 -0
- package/dist/utils/link.d.ts.map +1 -0
- package/dist/utils/link.js +77 -0
- package/dist/utils/openLink.d.ts +3 -0
- package/dist/utils/openLink.d.ts.map +1 -0
- package/dist/utils/openLink.js +19 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC"}
|
package/dist/assets/svg/index.js
CHANGED
package/dist/assets/svg/index.ts
CHANGED
|
@@ -3,6 +3,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useTranslation } from "react-i18next";
|
|
4
4
|
const BizInboxHeader = () => {
|
|
5
5
|
const { t } = useTranslation("biz-inbox");
|
|
6
|
-
return (_jsx("div", { "data-testid": "biz-inbox-header", className: "flex w-full flex-col border-b border-gray-100 bg-white", children: _jsx("div", { className: "flex h-12 items-end px-3", children: _jsxs("div", { className: "flex h-full flex-col items-center justify-end px-3", children: [_jsx("span", { className: "pb-1.5 text-center text-[16px] font-bold leading-[160%] tracking-[0.16px] text-
|
|
6
|
+
return (_jsx("div", { "data-testid": "biz-inbox-header", className: "flex w-full flex-col border-b border-gray-100 bg-white", children: _jsx("div", { className: "flex h-12 items-end px-3", children: _jsxs("div", { className: "flex h-full flex-col items-center justify-end px-3", children: [_jsx("span", { className: "pb-1.5 text-center text-[16px] font-bold leading-[160%] tracking-[0.16px] text-primary-400", children: t("tabs.messages") }), _jsx("span", { className: "h-[3px] w-full rounded-t bg-primary-400" })] }) }) }));
|
|
7
7
|
};
|
|
8
8
|
export default BizInboxHeader;
|
|
@@ -5,8 +5,8 @@ import { Icon } from "../../components/icon";
|
|
|
5
5
|
import { BizChatCategory, BizPeerType } from "../../types/biz";
|
|
6
6
|
import { resolveBizBadgeColor } from "../../utils/bizConversation";
|
|
7
7
|
const BizThreadAvatar = ({ peerType, chatCategory, displayName, avatarUrl, badgeLabel, }) => {
|
|
8
|
-
const badge = badgeLabel ? (_jsx("span", { className: clsx("absolute -bottom-px -right-px flex h-[17px] items-center justify-center gap-2 rounded-md border border-white px-1 text-[10px] font-semibold leading-3 text-white shadow-
|
|
9
|
-
return (_jsxs("div", { className: "relative h-12 w-12 shrink-0", children: [avatarUrl ? (_jsx("img", { src: avatarUrl, alt: displayName, className: "h-12 w-12 rounded-full object-cover" })) : (_jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-
|
|
8
|
+
const badge = badgeLabel ? (_jsx("span", { className: clsx("absolute -bottom-px -right-px flex h-[17px] items-center justify-center gap-2 rounded-md border border-white px-1 text-[10px] font-semibold leading-3 text-white shadow-badge-inset", resolveBizBadgeColor(peerType)), children: badgeLabel })) : null;
|
|
9
|
+
return (_jsxs("div", { className: "relative h-12 w-12 shrink-0", children: [avatarUrl ? (_jsx("img", { src: avatarUrl, alt: displayName, className: "h-12 w-12 rounded-full object-cover" })) : (_jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-chat-avatar text-white", children: chatCategory === BizChatCategory.GROUP ||
|
|
10
10
|
peerType === BizPeerType.GROUP ? (_jsx(Icon, { icon: "user-two-b", size: 20 })) : peerType === BizPeerType.BOT ? (_jsx(Icon, { icon: "droppii-o-1", size: 20 })) : (_jsx(Icon, { icon: "user-o", size: 20 })) })), badge] }));
|
|
11
11
|
};
|
|
12
12
|
export default BizThreadAvatar;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizThreadCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadCard.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BizThreadCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadCard.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAC;AAavF,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,uBAAuB,CAAC;IAC9B,OAAO,EAAE,CAAC,IAAI,EAAE,uBAAuB,KAAK,IAAI,CAAC;CAClD;AAQD,QAAA,MAAM,aAAa,GAAI,mBAAmB,kBAAkB,4CA6C3D,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as _jsx
|
|
3
|
-
import clsx from "clsx";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
3
|
import dayjs from "dayjs";
|
|
5
4
|
import { useTranslation } from "react-i18next";
|
|
6
5
|
import useAuthStore from "../../store/auth";
|
|
7
6
|
import { formatTimestamp } from "../../utils/common";
|
|
8
7
|
import { parseBizLatestMessage } from "../../utils/bizMessage";
|
|
9
8
|
import { resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, } from "../../utils/bizConversation";
|
|
9
|
+
import ThreadCard from "../../components/conversation/ThreadCard";
|
|
10
10
|
import BizThreadAvatar from "./BizThreadAvatar";
|
|
11
11
|
import BizThreadTitle from "./BizThreadTitle";
|
|
12
12
|
const formatLatestMessageTime = (sendTime) => {
|
|
@@ -15,12 +15,6 @@ const formatLatestMessageTime = (sendTime) => {
|
|
|
15
15
|
const isToday = dayjs(sendTime).isSame(dayjs(), "day");
|
|
16
16
|
return formatTimestamp(sendTime, { hasTime: isToday });
|
|
17
17
|
};
|
|
18
|
-
const formatUnreadCount = (count) => (count > 99 ? "99+" : count);
|
|
19
|
-
const UnreadBadge = ({ count }) => {
|
|
20
|
-
const label = String(formatUnreadCount(count));
|
|
21
|
-
const isWide = label.length > 1;
|
|
22
|
-
return (_jsx("span", { className: `inline-flex h-5 shrink-0 items-center justify-center rounded-[32px] border-2 border-white bg-[linear-gradient(93deg,#FF7D74_0%,#F04438_100%)] text-center text-[12px] font-semibold leading-[160%] text-white px-[3px] ${isWide ? "min-w-8" : "min-w-5"}`, children: label }));
|
|
23
|
-
};
|
|
24
18
|
const BizThreadCard = ({ item, onClick }) => {
|
|
25
19
|
var _a;
|
|
26
20
|
const { t } = useTranslation("biz-inbox");
|
|
@@ -32,8 +26,6 @@ const BizThreadCard = ({ item, onClick }) => {
|
|
|
32
26
|
const latestMessagePreview = parseBizLatestMessage(item.latestMsg, currentUserId, tCommon, item.peer.fullName);
|
|
33
27
|
const latestMessageTime = formatLatestMessageTime(item.latestMsgSendTime || null);
|
|
34
28
|
const unreadCount = (_a = item.unreadCount) !== null && _a !== void 0 ? _a : 0;
|
|
35
|
-
return (
|
|
36
|
-
? "font-[510] text-black"
|
|
37
|
-
: "font-normal tracking-[0.14px] text-[#5C6366]"), children: latestMessagePreview }), unreadCount > 0 && _jsx(UnreadBadge, { count: unreadCount })] })] })] }));
|
|
29
|
+
return (_jsx(ThreadCard, { testId: "biz-inbox-thread-card", onClick: () => onClick(item), unreadCount: unreadCount, time: latestMessageTime, preview: latestMessagePreview, avatar: _jsx(BizThreadAvatar, { peerType: item.peer.type, chatCategory: item.chatCategory, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), title: _jsx(BizThreadTitle, { peerType: item.peer.type, chatCategory: item.chatCategory, displayName: displayName, hasUnread: unreadCount > 0 }) }));
|
|
38
30
|
};
|
|
39
31
|
export default BizThreadCard;
|
|
@@ -5,6 +5,6 @@ import { Icon } from "../../components/icon";
|
|
|
5
5
|
import { BizChatCategory, BizPeerType } from "../../types/biz";
|
|
6
6
|
const BizThreadTitle = ({ peerType, chatCategory, displayName, hasUnread = false, }) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [(chatCategory === BizChatCategory.GROUP ||
|
|
7
7
|
peerType === BizPeerType.GROUP) && (_jsx(Icon, { icon: "user-two-b", size: 12, className: "shrink-0 text-black" })), peerType === BizPeerType.BOT &&
|
|
8
|
-
chatCategory === BizChatCategory.BIZ_BOT_PDP && (_jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center gap-0.5 rounded-full border border-white bg-
|
|
8
|
+
chatCategory === BizChatCategory.BIZ_BOT_PDP && (_jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center gap-0.5 rounded-full border border-white bg-gradient-pr-light px-1 py-0.5 text-white", children: _jsx(Icon, { icon: "shield-done-b", size: 8 }) })), peerType === BizPeerType.BOT &&
|
|
9
9
|
chatCategory === BizChatCategory.BIZ_BOT_CRM && (_jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-black text-white", children: _jsx(Icon, { icon: "droppii-o-1", size: 8 }) })), _jsx("span", { className: clsx("min-w-0 truncate text-[16px] leading-[160%] text-black [font-feature-settings:'liga'_off,'clig'_off]", hasUnread ? "font-bold tracking-[0.16px]" : "font-[510]"), children: displayName })] }));
|
|
10
10
|
export default BizThreadTitle;
|
|
@@ -12,7 +12,7 @@ import useConversationStore from "../../store/conversation";
|
|
|
12
12
|
import useAuthStore from "../../store/auth";
|
|
13
13
|
import { isBizGroupChat } from "../../utils/bizConversation";
|
|
14
14
|
import emitter from "../../utils/events";
|
|
15
|
-
import
|
|
15
|
+
import MessageItem from "../../components/message/item";
|
|
16
16
|
const BizMessageList = () => {
|
|
17
17
|
const { t } = useTranslation("biz-inbox");
|
|
18
18
|
const { user } = useChatContext();
|
|
@@ -31,6 +31,6 @@ const BizMessageList = () => {
|
|
|
31
31
|
emitter.off("BIZ_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM", scrollToBottomIfAtBottom);
|
|
32
32
|
};
|
|
33
33
|
}, [scrollToBottomIfAtBottom]);
|
|
34
|
-
return (_jsx("div", { "data-testid": "biz-message-list", className: "relative flex min-h-0 min-w-0 flex-1 flex-col overflow-x-hidden bg-white", children: isMessageLoading ? (_jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Spin, {}) })) : (_jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableBizMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, containerClassName: "h-full", empty: _jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Empty, { description: t("empty.no_messages") }) }), children: loadState.messageList.map((message, _, array) => (_jsx(
|
|
34
|
+
return (_jsx("div", { "data-testid": "biz-message-list", className: "relative flex min-h-0 min-w-0 flex-1 flex-col overflow-x-hidden bg-white", children: isMessageLoading ? (_jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Spin, {}) })) : (_jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableBizMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, containerClassName: "h-full", empty: _jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Empty, { description: t("empty.no_messages") }) }), children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, isGroupChat: isGroupChat }, message.clientMsgID))) })) }));
|
|
35
35
|
};
|
|
36
36
|
export default BizMessageList;
|
|
@@ -13,7 +13,7 @@ const BizMoreOptionItem = ({ option, onSelect }) => {
|
|
|
13
13
|
onSelect(option);
|
|
14
14
|
};
|
|
15
15
|
return (_jsxs("button", { type: "button", onClick: handleClick, disabled: !option.enabled, "aria-label": label, "data-testid": `biz-more-option-${option.labelKey}`, className: clsx("flex flex-col items-center gap-1 rounded-xl px-1 transition-colors", option.enabled
|
|
16
|
-
? "active:bg-[
|
|
17
|
-
: "cursor-not-allowed opacity-40"), children: [_jsx("span", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-
|
|
16
|
+
? "active:bg-chat-bubble-neutral/[0.08]"
|
|
17
|
+
: "cursor-not-allowed opacity-40"), children: [_jsx("span", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-gray-200/10", children: _jsx(Icon, { icon: option.icon, size: ICON_SIZE, className: "text-gray-900" }) }), _jsx("span", { className: "line-clamp-2 text-center text-[12px] leading-[1.4] text-gray-900", children: label })] }));
|
|
18
18
|
};
|
|
19
19
|
export default BizMoreOptionItem;
|
|
@@ -5,13 +5,13 @@ import { Icon } from "../../components/icon";
|
|
|
5
5
|
import BizThreadAvatar from "../../components/biz-inbox/BizThreadAvatar";
|
|
6
6
|
import BizThreadTitle from "../../components/biz-inbox/BizThreadTitle";
|
|
7
7
|
import { resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, } from "../../utils/bizConversation";
|
|
8
|
-
const HeaderIconButton = ({ icon, onClick, testId, }) => (_jsx("button", { type: "button", onClick: onClick, "data-testid": testId, className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-
|
|
8
|
+
const HeaderIconButton = ({ icon, onClick, testId, }) => (_jsx("button", { type: "button", onClick: onClick, "data-testid": testId, className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", children: _jsx(Icon, { icon: icon, size: 24 }) }));
|
|
9
9
|
const BizThreadDetailHeader = ({ conversation, onBack, }) => {
|
|
10
10
|
const { t } = useTranslation("biz-inbox");
|
|
11
11
|
const displayName = resolveBizDisplayName(conversation, t);
|
|
12
12
|
const avatarUrl = resolveBizAvatarUrl(conversation);
|
|
13
13
|
const badgeLabel = resolveBizBadgeLabel(conversation.peer.type, t);
|
|
14
14
|
const subtitle = t("thread_detail.profile_hint");
|
|
15
|
-
return (_jsxs("div", { "data-testid": "biz-thread-detail-header", className: "flex w-full cursor-default items-center border-b border-
|
|
15
|
+
return (_jsxs("div", { "data-testid": "biz-thread-detail-header", className: "flex w-full cursor-default items-center border-b border-gray-25 bg-white p-2 shadow-inset-gray-divider", children: [_jsx(HeaderIconButton, { icon: "arrow-left-o", onClick: onBack, testId: "biz-thread-detail-back" }), _jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2 px-1", "data-testid": "biz-thread-detail-profile", children: [_jsx(BizThreadAvatar, { peerType: conversation.peer.type, chatCategory: conversation.chatCategory, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(BizThreadTitle, { peerType: conversation.peer.type, chatCategory: conversation.chatCategory, displayName: displayName }), _jsx("p", { className: "truncate text-[10px] font-normal leading-[160%] tracking-[0.1px] text-gray-600 [font-feature-settings:'liga'_off,'clig'_off]", children: subtitle })] })] })] }));
|
|
16
16
|
};
|
|
17
17
|
export default BizThreadDetailHeader;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizThreadDetailInput.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailInput.tsx"],"names":[],"mappings":"AA+BA,MAAM,WAAW,yBAAyB;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,QAAA,MAAM,oBAAoB,GAAI,gDAI3B,yBAAyB,
|
|
1
|
+
{"version":3,"file":"BizThreadDetailInput.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailInput.tsx"],"names":[],"mappings":"AA+BA,MAAM,WAAW,yBAAyB;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,QAAA,MAAM,oBAAoB,GAAI,gDAI3B,yBAAyB,4CA0Y3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
|
|
@@ -12,11 +12,11 @@ import useConversationStore from "../../store/conversation";
|
|
|
12
12
|
import useBizMessageDraftStore from "../../store/bizMessageDraft";
|
|
13
13
|
import { resolveBizAvatarUrl, resolveBizDisplayName, } from "../../utils/bizConversation";
|
|
14
14
|
import { emit } from "../../utils/events";
|
|
15
|
-
import {
|
|
15
|
+
import { extractLinkUrls } from "../../utils/link";
|
|
16
16
|
import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
|
|
17
17
|
import { processAndValidateDocuments, processAndValidateFiles, } from "../../utils/fileValidation";
|
|
18
|
-
import
|
|
19
|
-
import
|
|
18
|
+
import { FilePreviewList } from "../../components/message/footer/FilePreview";
|
|
19
|
+
import LinkInputPreview from "../../components/message/footer/LinkInputPreview";
|
|
20
20
|
import BizMoreOptionPanel from "./BizMoreOptionPanel";
|
|
21
21
|
const MAX_LINES = 5;
|
|
22
22
|
const CONTAINER_MIN_HEIGHT = 48;
|
|
@@ -29,7 +29,6 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
29
29
|
const conversationId = selectedConversationId || (bizConversation === null || bizConversation === void 0 ? void 0 : bizConversation.conversationId) || "";
|
|
30
30
|
const isConversationReady = !!conversationData && (!!conversationData.userID || !!conversationData.groupID);
|
|
31
31
|
const sendMessageOptions = useMemo(() => ({
|
|
32
|
-
extractUrls: extractBizLinkUrls,
|
|
33
32
|
scrollEvent: "BIZ_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM",
|
|
34
33
|
resolveOfflinePushMeta: () => ({
|
|
35
34
|
title: bizConversation
|
|
@@ -43,7 +42,7 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
43
42
|
"",
|
|
44
43
|
}),
|
|
45
44
|
}), [bizConversation, conversationData, t]);
|
|
46
|
-
const {
|
|
45
|
+
const { sendMergeMessage } = useSendMessage(sendMessageOptions);
|
|
47
46
|
const userID = useAuthStore((state) => state.userID);
|
|
48
47
|
const setDraft = useBizMessageDraftStore((state) => state.setDraft);
|
|
49
48
|
const clearDraft = useBizMessageDraftStore((state) => state.clearDraft);
|
|
@@ -59,9 +58,8 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
59
58
|
const [previewDismissed, setPreviewDismissed] = useState(false);
|
|
60
59
|
const [isMoreOptionOpen, { setFalse: closeMoreOption, toggle: toggleMoreOption },] = useBoolean(false);
|
|
61
60
|
const previewUrl = useMemo(() => {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
return (_a = urls[0]) !== null && _a !== void 0 ? _a : null;
|
|
61
|
+
const urls = extractLinkUrls(value);
|
|
62
|
+
return urls.length === 1 ? urls[0] : null;
|
|
65
63
|
}, [value]);
|
|
66
64
|
const showLinkPreview = !!previewUrl && !previewDismissed;
|
|
67
65
|
const { data: previewMetadata } = useFetchUrlMetadata(previewUrl !== null && previewUrl !== void 0 ? previewUrl : "", showLinkPreview);
|
|
@@ -185,15 +183,6 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
185
183
|
if (onSendMessage) {
|
|
186
184
|
onSendMessage(text);
|
|
187
185
|
}
|
|
188
|
-
else if (hasFiles) {
|
|
189
|
-
await sendMergeMessage({
|
|
190
|
-
plainText: text,
|
|
191
|
-
richText: "",
|
|
192
|
-
files: listUploadFiles,
|
|
193
|
-
isInternal: false,
|
|
194
|
-
});
|
|
195
|
-
setListUploadFiles([]);
|
|
196
|
-
}
|
|
197
186
|
else {
|
|
198
187
|
const urlMetadata = showLinkPreview && previewUrl && previewMetadata
|
|
199
188
|
? {
|
|
@@ -203,14 +192,16 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
203
192
|
image: previewMetadata.image,
|
|
204
193
|
}
|
|
205
194
|
: undefined;
|
|
206
|
-
const sent = await
|
|
195
|
+
const sent = await sendMergeMessage({
|
|
207
196
|
plainText: text,
|
|
208
197
|
richText: "",
|
|
198
|
+
files: listUploadFiles,
|
|
209
199
|
isInternal: false,
|
|
210
200
|
urlMetadata,
|
|
211
201
|
});
|
|
212
202
|
if (!sent)
|
|
213
203
|
return;
|
|
204
|
+
setListUploadFiles([]);
|
|
214
205
|
}
|
|
215
206
|
setValue("");
|
|
216
207
|
if (conversationId && userID) {
|
|
@@ -258,8 +249,8 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
258
249
|
event.preventDefault();
|
|
259
250
|
void handleSend();
|
|
260
251
|
};
|
|
261
|
-
return (_jsxs("div", { ref: containerRef, "data-testid": "biz-thread-detail-input", className: "flex w-full shrink-0 flex-col bg-[
|
|
262
|
-
? "border-
|
|
263
|
-
: "border-
|
|
252
|
+
return (_jsxs("div", { ref: containerRef, "data-testid": "biz-thread-detail-input", className: "flex w-full shrink-0 flex-col bg-chat-bubble-neutral/[0.05]", children: [_jsx("input", { ref: mediaInputRef, type: "file", accept: "image/jpeg,image/png,image/jpg,video/*", multiple: true, className: "hidden", onChange: handleMediaInputChange }), _jsx("input", { ref: documentInputRef, type: "file", accept: ".pdf,.doc,.docx", multiple: true, className: "hidden", onChange: handleDocumentInputChange }), listUploadFiles.length > 0 && (_jsx(FilePreviewList, { files: listUploadFiles, onRemove: (file) => handleRemoveFile(file.uid), onVideoReady: () => setIsVideoLoading(false) })), showLinkPreview && previewUrl && (_jsx(LinkInputPreview, { url: previewUrl, onRemove: () => setPreviewDismissed(true) })), _jsxs("div", { className: "flex items-end gap-3 px-3 py-2", children: [_jsx("div", { className: "flex shrink-0 items-center", children: _jsx("button", { type: "button", onClick: handleToggleMoreOption, "aria-label": t("thread_detail.more_option.toggle"), "aria-expanded": isMoreOptionOpen, "data-testid": "biz-thread-detail-more-option-toggle", className: "flex py-3 items-center justify-center rounded-full", children: isMoreOptionOpen ? (_jsx(Icon, { icon: "close-circle-o", size: 24, className: "text-primary-400" })) : (_jsx(Icon, { icon: "plus-circle-o", size: 24, className: "text-gray-900" })) }) }), _jsx("div", { className: clsx("flex min-w-0 flex-1 overflow-hidden rounded-xl border bg-white transition-shadow", isFocused
|
|
253
|
+
? "border-primary-200 shadow-primary-focus"
|
|
254
|
+
: "border-gray-50"), style: { minHeight: CONTAINER_MIN_HEIGHT }, children: _jsx("div", { className: "flex min-w-0 flex-[1_0_0] items-center gap-2 self-stretch px-3 py-1", children: _jsx("textarea", { ref: textareaRef, value: value, rows: 1, onChange: (event) => handleChange(event.target.value), onFocus: handleFocus, onBlur: handleBlur, onKeyDown: handleKeyDown, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : t("thread_detail.input_placeholder"), "data-testid": "biz-thread-detail-message-input", className: "biz-message-input-scrollbar min-h-0 min-w-0 flex-1 resize-none appearance-none border-0 bg-transparent p-0 text-[16px] leading-[1.6] tracking-[0.16px] text-black outline-none ring-0 placeholder:text-gray-400 focus:border-0 focus:outline-none focus:ring-0" }) }) }), _jsx("div", { className: "flex shrink-0 items-center pb-1", children: _jsx("button", { type: "button", onClick: () => void handleSend(), disabled: !canSend, "data-testid": "biz-thread-detail-send", className: clsx("flex h-10 w-10 items-center justify-center rounded-full", canSend ? "bg-chat-send" : "bg-chat-send opacity-25"), children: _jsx(Icon, { icon: "send-b", size: 20, className: "text-white" }) }) })] }), isMoreOptionOpen && (_jsx(BizMoreOptionPanel, { disabled: !isConversationReady, onTriggerMediaInput: () => { var _a; return (_a = mediaInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, onTriggerDocumentInput: () => { var _a; return (_a = documentInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); } }))] }));
|
|
264
255
|
};
|
|
265
256
|
export default BizThreadDetailInput;
|
|
@@ -3,12 +3,8 @@ export type { BizThreadDetailHeaderProps } from "./BizThreadDetailHeader";
|
|
|
3
3
|
export { default as BizThreadDetailInput } from "./BizThreadDetailInput";
|
|
4
4
|
export type { BizThreadDetailInputProps } from "./BizThreadDetailInput";
|
|
5
5
|
export { default as BizMessageList } from "./BizMessageList";
|
|
6
|
-
export { default as BizMessageItem } from "./item/BizMessageItem";
|
|
7
|
-
export type { BizMessageItemProps } from "./item/BizMessageItem";
|
|
8
6
|
export { default as BizMoreOptionPanel } from "./BizMoreOptionPanel";
|
|
9
7
|
export type { BizMoreOptionPanelProps } from "./BizMoreOptionPanel";
|
|
10
8
|
export { default as BizMoreOptionItem } from "./BizMoreOptionItem";
|
|
11
9
|
export type { BizMoreOptionItemProps } from "./BizMoreOptionItem";
|
|
12
|
-
export { default as BizAttachmentPreview } from "./BizAttachmentPreview";
|
|
13
|
-
export type { BizAttachmentPreviewProps } from "./BizAttachmentPreview";
|
|
14
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAE1E,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAExE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAE1E,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAExE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
export { default as BizThreadDetailHeader } from "./BizThreadDetailHeader";
|
|
2
2
|
export { default as BizThreadDetailInput } from "./BizThreadDetailInput";
|
|
3
3
|
export { default as BizMessageList } from "./BizMessageList";
|
|
4
|
-
export { default as BizMessageItem } from "./item/BizMessageItem";
|
|
5
4
|
export { default as BizMoreOptionPanel } from "./BizMoreOptionPanel";
|
|
6
5
|
export { default as BizMoreOptionItem } from "./BizMoreOptionItem";
|
|
7
|
-
export { default as BizAttachmentPreview } from "./BizAttachmentPreview";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationBySessionItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/ConversationBySessionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"ConversationBySessionItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/ConversationBySessionItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAShD,UAAU,8BAA8B;IACtC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,yBAAyB,GAAI,iCAGhC,8BAA8B,mDA8DhC,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as _jsx
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useTranslation } from "react-i18next";
|
|
4
4
|
import useConversationStore from "../../store/conversation";
|
|
5
5
|
import { usePathname, useRouter, useSearchParams } from "next/navigation";
|
|
6
|
-
import { Avatar
|
|
6
|
+
import { Avatar } from "antd";
|
|
7
7
|
import { useChatContext } from "../../context/ChatContext";
|
|
8
8
|
import { useConversationDisplayData } from "../../hooks/conversation/useConversation";
|
|
9
9
|
import { formatTimestamp, parseLatestMessage } from "../../utils/common";
|
|
10
|
+
import ThreadCard from "./ThreadCard";
|
|
10
11
|
const ConversationBySessionItem = ({ sessionItem, latestPreview, }) => {
|
|
11
12
|
var _a;
|
|
12
13
|
const { t } = useTranslation();
|
|
@@ -34,8 +35,8 @@ const ConversationBySessionItem = ({ sessionItem, latestPreview, }) => {
|
|
|
34
35
|
const latestMsgSendTime = (latestPreview === null || latestPreview === void 0 ? void 0 : latestPreview.latestMsgSendTime) || 0;
|
|
35
36
|
if (!conversation)
|
|
36
37
|
return null;
|
|
37
|
-
return (
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
return (_jsx(ThreadCard, { onClick: () => handleConversationClick(conversation), isSelected: isSelected, unreadCount: conversation.unreadCount, preview: parseLatestMessage(latestMsg, user === null || user === void 0 ? void 0 : user.userID, t), time: latestMsgSendTime > 0
|
|
39
|
+
? formatTimestamp(latestMsgSendTime, { hasTime: true })
|
|
40
|
+
: undefined, avatar: _jsx(Avatar, { size: 48, src: avatar, children: ((_a = displayName === null || displayName === void 0 ? void 0 : displayName.charAt) === null || _a === void 0 ? void 0 : _a.call(displayName, 0)) || "A" }), title: _jsx("h3", { className: "truncate text-sm font-semibold text-gray-900", children: displayName }) }));
|
|
40
41
|
};
|
|
41
42
|
export default ConversationBySessionItem;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
export interface ThreadCardProps {
|
|
3
|
+
avatar: ReactNode;
|
|
4
|
+
title: ReactNode;
|
|
5
|
+
preview: string;
|
|
6
|
+
time?: string;
|
|
7
|
+
unreadCount?: number;
|
|
8
|
+
isSelected?: boolean;
|
|
9
|
+
onClick: () => void;
|
|
10
|
+
testId?: string;
|
|
11
|
+
}
|
|
12
|
+
declare const ThreadCard: ({ avatar, title, preview, time, unreadCount, isSelected, onClick, testId, }: ThreadCardProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export default ThreadCard;
|
|
14
|
+
//# sourceMappingURL=ThreadCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ThreadCard.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/ThreadCard.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAoBvC,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,SAAS,CAAC;IAClB,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,UAAU,GAAI,6EASjB,eAAe,4CA4CjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import clsx from "clsx";
|
|
4
|
+
const formatUnreadCount = (count) => (count > 99 ? "99+" : count);
|
|
5
|
+
const UnreadBadge = ({ count }) => {
|
|
6
|
+
const label = String(formatUnreadCount(count));
|
|
7
|
+
const isWide = label.length > 1;
|
|
8
|
+
return (_jsx("span", { className: clsx("inline-flex h-5 shrink-0 items-center justify-center rounded-[32px] border-2 border-white bg-gradient-danger-light px-[3px] text-center text-[12px] font-semibold leading-[160%] text-white", isWide ? "min-w-8" : "min-w-5"), children: label }));
|
|
9
|
+
};
|
|
10
|
+
const ThreadCard = ({ avatar, title, preview, time, unreadCount = 0, isSelected = false, onClick, testId, }) => {
|
|
11
|
+
const hasUnread = unreadCount > 0;
|
|
12
|
+
return (_jsxs("button", { type: "button", onClick: onClick, "data-testid": testId, className: clsx("relative flex w-full shrink-0 items-start gap-2 border-b border-gray-25 p-3 text-left transition-colors hover:bg-gray-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-chat-ring", isSelected ? "bg-blue-50" : "bg-white"), children: [isSelected && (_jsx("span", { className: "absolute bottom-0 left-0 top-0 w-1 bg-blue-500" })), avatar, _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsxs("div", { className: "flex min-h-[25.6px] items-center justify-between gap-1", children: [_jsx("div", { className: "min-w-0 flex-1", children: title }), time && (_jsx("span", { className: "shrink-0 text-[12px] font-normal leading-[160%] text-gray-400 [font-feature-settings:'liga'_off,'clig'_off]", children: time }))] }), _jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("p", { className: clsx("min-w-0 flex-1 truncate text-[14px] leading-[160%] [font-feature-settings:'liga'_off,'clig'_off]", hasUnread
|
|
13
|
+
? "font-[510] text-black"
|
|
14
|
+
: "font-normal tracking-[0.14px] text-gray-600"), children: preview }), hasUnread && _jsx(UnreadBadge, { count: unreadCount })] })] })] }));
|
|
15
|
+
};
|
|
16
|
+
export default ThreadCard;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/ImageCollection.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,eAAe,+
|
|
1
|
+
{"version":3,"file":"ImageCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/ImageCollection.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,eAAe,+CAqFpB,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -2,13 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { MessageType } from "@openim/wasm-client-sdk";
|
|
3
3
|
import { useSearchMessage } from "../../hooks/search/useSearchMessage";
|
|
4
4
|
import InfiniteScroll from "react-infinite-scroll-component";
|
|
5
|
-
import {
|
|
5
|
+
import { Empty, Image, Spin } from "antd";
|
|
6
6
|
import { useCallback } from "react";
|
|
7
7
|
import dayjs from "dayjs";
|
|
8
8
|
import useConversationStore from "../../store/conversation";
|
|
9
9
|
import { images } from "../../constants/images";
|
|
10
10
|
import { useTranslation } from "react-i18next";
|
|
11
|
-
import {
|
|
11
|
+
import { renderImagePreviewToolbar } from "../../components/message/item/imagePreviewToolbar";
|
|
12
12
|
const ImageCollection = () => {
|
|
13
13
|
const { t } = useTranslation();
|
|
14
14
|
const selectedSourceId = useConversationStore((state) => state.selectedSourceId);
|
|
@@ -18,16 +18,6 @@ const ImageCollection = () => {
|
|
|
18
18
|
contentType: MessageType.PictureMessage,
|
|
19
19
|
},
|
|
20
20
|
});
|
|
21
|
-
const handleDownload = (imageUrl) => {
|
|
22
|
-
if (!imageUrl)
|
|
23
|
-
return;
|
|
24
|
-
const link = document.createElement("a");
|
|
25
|
-
link.href = imageUrl;
|
|
26
|
-
link.download = imageUrl.substring(imageUrl.lastIndexOf("/") + 1);
|
|
27
|
-
document.body.appendChild(link);
|
|
28
|
-
link.click();
|
|
29
|
-
document.body.removeChild(link);
|
|
30
|
-
};
|
|
31
21
|
const renderItem = useCallback((date, items) => {
|
|
32
22
|
return (_jsxs("div", { className: "mb-2", children: [_jsx("span", { className: "text-sm font-medium text-gray-500 px-3", children: dayjs(date).format("DD MMMM, YYYY") }), _jsx("div", { className: "grid grid-cols-3 justify-start gap-px py-2", children: items.map((item) => {
|
|
33
23
|
var _a, _b, _c, _d;
|
|
@@ -42,11 +32,7 @@ const ImageCollection = () => {
|
|
|
42
32
|
if (isLoading)
|
|
43
33
|
return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
|
|
44
34
|
return (_jsx("div", { id: "scrollableImageDiv", className: "h-full overflow-auto", children: _jsx(Image.PreviewGroup, { preview: {
|
|
45
|
-
toolbarRender: (originalNode, info) => {
|
|
46
|
-
var _a;
|
|
47
|
-
const imageUrl = (_a = info === null || info === void 0 ? void 0 : info.image) === null || _a === void 0 ? void 0 : _a.url;
|
|
48
|
-
return (_jsxs("div", { className: "flex flex-col justify-center gap-2", children: [originalNode, imageUrl && (_jsx(Button, { type: "primary", icon: _jsx(DownloadOutlined, {}), className: "self-center", onClick: () => handleDownload(imageUrl), children: t("download") }))] }));
|
|
49
|
-
},
|
|
35
|
+
toolbarRender: (originalNode, info) => { var _a; return renderImagePreviewToolbar(originalNode, (_a = info === null || info === void 0 ? void 0 : info.image) === null || _a === void 0 ? void 0 : _a.url, t); },
|
|
50
36
|
}, children: _jsx(InfiniteScroll, { dataLength: dataFlatten.length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableImageDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }) }));
|
|
51
37
|
};
|
|
52
38
|
export default ImageCollection;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AA0BA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;CACpC;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAgQ3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -11,7 +11,6 @@ import MessageInfiniteScroll from "./MessageInfiniteScroll";
|
|
|
11
11
|
import MessageHeader from "./MessageHeader";
|
|
12
12
|
import MessageFooter from "./footer";
|
|
13
13
|
import UnassignedSessionFooter from "./UnassignedSessionFooter";
|
|
14
|
-
import { images } from "../../constants/images";
|
|
15
14
|
import { useTranslation } from "react-i18next";
|
|
16
15
|
import useConversationStore from "../../store/conversation";
|
|
17
16
|
import { useBoolean } from "ahooks";
|
|
@@ -130,11 +129,6 @@ const MessageList = (props) => {
|
|
|
130
129
|
if (!conversationData) {
|
|
131
130
|
return (_jsx("div", { className: "flex flex-1 items-center justify-center h-full", children: connectStatus !== ConnectStatus.Connected ? (_jsx(Spin, {})) : (_jsx(Empty, { description: t("no_conversation_data") })) }));
|
|
132
131
|
}
|
|
133
|
-
return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full min-w-0", style: {
|
|
134
|
-
backgroundImage: `url(${images.conversationBg})`,
|
|
135
|
-
backgroundSize: "cover",
|
|
136
|
-
backgroundPosition: "center",
|
|
137
|
-
overflowX: "hidden",
|
|
138
|
-
}, children: [_jsx(MessageHeader, { onClose: onClose, currentSession: latestConversationSession, isJoined: isJoined }), _jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage }, message.clientMsgID))) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), isCheckingMembership ? (_jsx("div", { className: "border-t bg-white py-4 flex items-center justify-center", children: _jsx(Spin, {}) })) : (latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.status) === SessionStatus.UNASSIGNED ? (_jsx(UnassignedSessionFooter, { sessionId: latestConversationSession.id, teamId: latestConversationSession.teamId })) : shouldRestrictToLastSession ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: joinGroup, loading: isJoining, children: t("join_group") })] })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(Modal, { centered: true, open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, getContainer: false, forceRender: true, children: _jsx("p", { children: t("revoke_message_confirm_message") }) })] }));
|
|
132
|
+
return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full min-w-0 bg-white", style: { overflowX: "hidden" }, children: [_jsx(MessageHeader, { onClose: onClose, currentSession: latestConversationSession, isJoined: isJoined }), _jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage }, message.clientMsgID))) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), isCheckingMembership ? (_jsx("div", { className: "border-t bg-white py-4 flex items-center justify-center", children: _jsx(Spin, {}) })) : (latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.status) === SessionStatus.UNASSIGNED ? (_jsx(UnassignedSessionFooter, { sessionId: latestConversationSession.id, teamId: latestConversationSession.teamId })) : shouldRestrictToLastSession ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: joinGroup, loading: isJoining, children: t("join_group") })] })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(Modal, { centered: true, open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, getContainer: false, forceRender: true, children: _jsx("p", { children: t("revoke_message_confirm_message") }) })] }));
|
|
139
133
|
};
|
|
140
134
|
export default MessageList;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ComposerTextSyncPlugin.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ComposerTextSyncPlugin.tsx"],"names":[],"mappings":"AAMA,UAAU,2BAA2B;IACnC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC;AAED,QAAA,MAAM,sBAAsB,GAAI,cAAc,2BAA2B,SAYxE,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
3
|
+
import { $getRoot } from "lexical";
|
|
4
|
+
import { useEffect } from "react";
|
|
5
|
+
const ComposerTextSyncPlugin = ({ onChange }) => {
|
|
6
|
+
const [editor] = useLexicalComposerContext();
|
|
7
|
+
useEffect(() => {
|
|
8
|
+
return editor.registerUpdateListener(({ editorState }) => {
|
|
9
|
+
editorState.read(() => {
|
|
10
|
+
onChange($getRoot().getTextContent());
|
|
11
|
+
});
|
|
12
|
+
});
|
|
13
|
+
}, [editor, onChange]);
|
|
14
|
+
return null;
|
|
15
|
+
};
|
|
16
|
+
export default ComposerTextSyncPlugin;
|
|
@@ -4,10 +4,11 @@ interface ShortenOptions {
|
|
|
4
4
|
keepStart?: number;
|
|
5
5
|
keepEnd?: number;
|
|
6
6
|
}
|
|
7
|
-
export declare const shortenFileName: (name
|
|
8
|
-
export declare function FilePreviewList({ files, onRemove, }: {
|
|
7
|
+
export declare const shortenFileName: (name?: string, options?: ShortenOptions) => string;
|
|
8
|
+
export declare function FilePreviewList({ files, onRemove, onVideoReady, }: {
|
|
9
9
|
files: UploadFile[];
|
|
10
10
|
onRemove: (file: UploadFile) => void;
|
|
11
|
+
onVideoReady?: () => void;
|
|
11
12
|
}): import("react/jsx-runtime").JSX.Element | null;
|
|
12
13
|
declare const FilePreview: () => import("react/jsx-runtime").JSX.Element;
|
|
13
14
|
export default FilePreview;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
|
1
|
+
{"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAOlC,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,OAAO,MAAM,EAAE,UAAS,cAAmB,WAmB1E,CAAC;AAwIF,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,YAAY,GACb,EAAE;IACD,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,kDAsBA;AAED,QAAA,MAAM,WAAW,+CAQhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
|