@droppii-org/chat-sdk 0.1.29 → 0.1.31

package/dist/assets/svg/index.ts

@@ -1,2 +1,2 @@
 export * from "./document";
-export * from "./canned-response";
+export * from "./canned-response";

package/dist/components/biz-inbox/BizThreadAvatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadAvatar.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadAvatar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,WAAW,oBAAoB;IACnC,YAAY,EAAE,eAAe,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,GAAI,uDAKtB,oBAAoB,4CA8BtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"BizThreadAvatar.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadAvatar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,WAAW,oBAAoB;IACnC,YAAY,EAAE,eAAe,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,GAAI,uDAKtB,oBAAoB,4CAwCtB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/biz-inbox/BizThreadAvatar.js

@@ -4,5 +4,10 @@ import clsx from "clsx";
 import { Icon } from "../../components/icon";
 import { BizChatCategory } from "../../types/biz";
 import { resolveBizBadgeColor } from "../../utils/bizConversation";
-const BizThreadAvatar = ({ chatCategory, displayName, avatarUrl, badgeLabel, }) => (_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-[#0C5CFF] text-white", children: chatCategory === BizChatCategory.GROUP ? (_jsx(Icon, { icon: "user-two-b", size: 20 })) : chatCategory === BizChatCategory.BIZ_BOT_PDP ? (_jsx(Icon, { icon: "droppii-o-1", size: 20 })) : (_jsx(Icon, { icon: "user-o", size: 20 })) })), 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-[inset_2px_6px_8px_0_rgba(0,0,0,0.40)]", resolveBizBadgeColor(chatCategory)), children: badgeLabel }))] }));
+const BizThreadAvatar = ({ chatCategory, displayName, avatarUrl, badgeLabel, }) => {
+    if (chatCategory === BizChatCategory.BIZ_BOT_CRM) {
+        return (_jsx("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-[#607CFB] p-2.5 shadow-[inset_2px_3px_8px_0_rgba(0,0,0,0.40)]", children: _jsx(Icon, { icon: "head-phone-o1", size: 28, className: "text-white" }) }));
+    }
+    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-[#0C5CFF] text-white", children: chatCategory === BizChatCategory.GROUP ? (_jsx(Icon, { icon: "user-two-b", size: 20 })) : chatCategory === BizChatCategory.BIZ_BOT_PDP ? (_jsx(Icon, { icon: "droppii-o-1", size: 20 })) : (_jsx(Icon, { icon: "user-o", size: 20 })) })), 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-[inset_2px_6px_8px_0_rgba(0,0,0,0.40)]", resolveBizBadgeColor(chatCategory)), children: badgeLabel }))] }));
+};
 export default BizThreadAvatar;

package/dist/components/biz-inbox/BizThreadCard.d.ts

@@ -1,7 +1,7 @@
-import type { BizConversationItem } from "../../types/biz";
+import type { BizConversationListItem } from "../../hooks/biz/useBizConversationListItems";
 export interface BizThreadCardProps {
-    item: BizConversationItem;
-    onClick: (item: BizConversationItem) => void;
+    item: BizConversationListItem;
+    onClick: (item: BizConversationListItem) => void;
 }
 declare const BizThreadCard: ({ item, onClick }: BizThreadCardProps) => import("react/jsx-runtime").JSX.Element;
 export default BizThreadCard;

package/dist/components/biz-inbox/BizThreadCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadCard.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAYvD,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,mBAAmB,CAAC;IAC1B,OAAO,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;CAC9C;AAOD,QAAA,MAAM,aAAa,GAAI,mBAAmB,kBAAkB,4CA+C3D,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"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;AAuBD,QAAA,MAAM,aAAa,GAAI,mBAAmB,kBAAkB,4CA+D3D,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/biz-inbox/BizThreadCard.js

@@ -1,8 +1,11 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
 import { useTranslation } from "react-i18next";
+import { useChatContext } from "../../context/ChatContext";
 import { formatTimestamp } from "../../utils/common";
-import { resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, resolveBizLastMessagePreview, resolveBizLastMessageTime, } from "../../utils/bizConversation";
+import { parseBizLatestMessage } from "../../utils/bizMessage";
+import { isBizGroupChat, resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, } from "../../utils/bizConversation";
 import BizThreadAvatar from "./BizThreadAvatar";
 import BizThreadTitle from "./BizThreadTitle";
 const formatLatestMessageTime = (sendTime) => {
@@ -10,16 +13,25 @@ const formatLatestMessageTime = (sendTime) => {
         return "";
     return formatTimestamp(sendTime, { hasTime: true });
 };
+const formatUnreadCount = (count) => (count > 99 ? "99+" : count);
+const UnreadBadge = ({ count }) => {
+    const label = String(formatUnreadCount(count));
+    const isWide = label.length > 1;
+    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 }));
+};
 const BizThreadCard = ({ item, onClick }) => {
+    var _a;
     const { t } = useTranslation("biz-inbox");
-    const displayName = resolveBizDisplayName(item, t("thread_card.fallback_name"));
+    const { t: tCommon } = useTranslation("common");
+    const { user } = useChatContext();
+    const displayName = resolveBizDisplayName(item, t);
     const avatarUrl = resolveBizAvatarUrl(item);
     const badgeLabel = resolveBizBadgeLabel(item.chatCategory, t);
-    const latestMessagePreview = resolveBizLastMessagePreview(item.lastMessage, t);
-    const latestMessageTime = formatLatestMessageTime(resolveBizLastMessageTime(item.lastMessage));
-    const handleClick = () => {
-        onClick(item);
-    };
-    return (_jsxs("button", { type: "button", onClick: handleClick, "data-testid": "biz-inbox-thread-card", className: "flex w-full shrink-0 items-center gap-2 border-b border-[#EFEFEF] bg-white p-3 text-left transition-colors hover:bg-gray-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-[#1677ff]", children: [_jsx(BizThreadAvatar, { chatCategory: item.chatCategory, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col pt-0.5", children: [_jsx(BizThreadTitle, { chatCategory: item.chatCategory, displayName: displayName }), _jsx("p", { className: "min-h-[22.4px] truncate text-[14px] font-normal leading-[160%] tracking-[0.14px] text-[#5C6366] [font-feature-settings:'liga'_off,'clig'_off]", children: latestMessagePreview })] }), latestMessageTime && (_jsx("span", { className: "shrink-0 text-[12px] font-normal leading-[160%] text-[#747B7E] [font-feature-settings:'liga'_off,'clig'_off]", children: latestMessageTime }))] }));
+    const latestMessagePreview = parseBizLatestMessage(item.latestMsg, user === null || user === void 0 ? void 0 : user.userID, tCommon, isBizGroupChat(item));
+    const latestMessageTime = formatLatestMessageTime(item.latestMsgSendTime || null);
+    const unreadCount = (_a = item.unreadCount) !== null && _a !== void 0 ? _a : 0;
+    return (_jsxs("button", { type: "button", onClick: () => onClick(item), "data-testid": "biz-inbox-thread-card", className: "flex w-full shrink-0 items-start gap-2 border-b border-[#EFEFEF] bg-white p-3 text-left transition-colors hover:bg-gray-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-[#1677ff]", children: [_jsx(BizThreadAvatar, { chatCategory: item.chatCategory, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _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: _jsx(BizThreadTitle, { chatCategory: item.chatCategory, displayName: displayName, hasUnread: unreadCount > 0 }) }), latestMessageTime && (_jsx("span", { className: "shrink-0 text-[12px] font-normal leading-[160%] text-[#747B7E] [font-feature-settings:'liga'_off,'clig'_off]", children: latestMessageTime }))] }), _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]", unreadCount > 0
+                                    ? "font-[510] text-black"
+                                    : "font-normal tracking-[0.14px] text-[#5C6366]"), children: latestMessagePreview }), unreadCount > 0 && _jsx(UnreadBadge, { count: unreadCount })] })] })] }));
 };
 export default BizThreadCard;

package/dist/components/biz-inbox/BizThreadList.d.ts

@@ -1,11 +1,12 @@
-import type { BizConversationItem } from "../../types/biz";
+import type { BizConversationListItem } from "../../hooks/biz/useBizConversationListItems";
 export interface BizThreadListProps {
-    items: BizConversationItem[];
+    items: BizConversationListItem[];
+    isLoading: boolean;
     isFetchingNextPage: boolean;
     hasNextPage: boolean;
     onLoadMore: () => void;
-    onSelectThread?: (item: BizConversationItem) => void;
+    onSelectThread?: (item: BizConversationListItem) => void;
 }
-declare const BizThreadList: ({ items, isFetchingNextPage, hasNextPage, onLoadMore, onSelectThread, }: BizThreadListProps) => import("react/jsx-runtime").JSX.Element;
+declare const BizThreadList: ({ items, isLoading, isFetchingNextPage, hasNextPage, onLoadMore, onSelectThread, }: BizThreadListProps) => import("react/jsx-runtime").JSX.Element;
 export default BizThreadList;
 //# sourceMappingURL=BizThreadList.d.ts.map

package/dist/components/biz-inbox/BizThreadList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadList.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAKvD,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAC7B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACtD;AAYD,QAAA,MAAM,aAAa,GAAI,yEAMpB,kBAAkB,4CAoEpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"BizThreadList.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadList.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAC;AAMvF,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,uBAAuB,EAAE,CAAC;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,uBAAuB,KAAK,IAAI,CAAC;CAC1D;AAYD,QAAA,MAAM,aAAa,GAAI,oFAOpB,kBAAkB,4CAwGpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/biz-inbox/BizThreadList.js

@@ -2,27 +2,47 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { useTranslation } from "react-i18next";
-import { Empty } from "antd";
+import { Empty, Spin } from "antd";
 import InfiniteScroll from "react-infinite-scroll-component";
+import { DChatSDK } from "../../constants/sdk";
 import useBizConversationStore from "../../store/bizConversation";
+import useConversationStore from "../../store/conversation";
 import { Icon } from "../../components/icon";
 import BizThreadCard from "./BizThreadCard";
 const FooterSkeleton = () => (_jsxs("div", { className: "flex items-center gap-3 p-3", children: [_jsx("div", { className: "h-10 w-10 animate-pulse rounded-full bg-neutral-200" }), _jsxs("div", { className: "flex flex-1 flex-col gap-2", children: [_jsx("div", { className: "h-3 w-1/2 animate-pulse rounded bg-neutral-200" }), _jsx("div", { className: "h-2.5 w-1/3 animate-pulse rounded bg-neutral-200" })] })] }));
-const BizThreadList = ({ items, isFetchingNextPage, hasNextPage, onLoadMore, onSelectThread, }) => {
+const BizThreadList = ({ items, isLoading, isFetchingNextPage, hasNextPage, onLoadMore, onSelectThread, }) => {
     const { t } = useTranslation("biz-inbox");
     const router = useRouter();
     const pathname = usePathname();
     const searchParams = useSearchParams();
+    const sdkConversations = useBizConversationStore((state) => state.sdkConversations);
     const selectConversation = useBizConversationStore((state) => state.selectConversation);
-    const handleSelectThread = (item) => {
-        selectConversation(item);
-        if (searchParams.get("threadId") === item.conversationId) {
-            onSelectThread === null || onSelectThread === void 0 ? void 0 : onSelectThread(item);
+    const setConversationData = useConversationStore((state) => state.setConversationData);
+    const setSelectedConversationId = useConversationStore((state) => state.setSelectedConversationId);
+    const syncSdkConversation = (conversationId) => {
+        const cachedConversation = sdkConversations[conversationId];
+        if (cachedConversation) {
+            setConversationData(cachedConversation);
+            setSelectedConversationId(conversationId);
             return;
         }
+        DChatSDK.getMultipleConversation([conversationId])
+            .then((res) => {
+            if (res.data.length > 0) {
+                setConversationData(res.data[0]);
+                setSelectedConversationId(conversationId);
+            }
+        })
+            .catch((error) => {
+            console.error("getMultipleConversation", error);
+        });
+    };
+    const handleSelectThread = (item) => {
         const newSearchParams = new URLSearchParams(searchParams);
         newSearchParams.set("threadId", item.conversationId);
         router.push(`${pathname}?${newSearchParams.toString()}`);
+        selectConversation(item);
+        syncSdkConversation(item.conversationId);
         onSelectThread === null || onSelectThread === void 0 ? void 0 : onSelectThread(item);
     };
     const handleEndReached = () => {
@@ -30,6 +50,9 @@ const BizThreadList = ({ items, isFetchingNextPage, hasNextPage, onLoadMore, onS
             onLoadMore();
         }
     };
+    if (isLoading) {
+        return (_jsx("div", { "data-testid": "biz-inbox-thread-list", className: "flex flex-1 items-center justify-center py-12", children: _jsx(Spin, {}) }));
+    }
     return (_jsx("div", { id: "scrollableBizThreadsDiv", "data-testid": "biz-inbox-thread-list", className: "min-h-0 w-full flex-1 overflow-auto", children: _jsx(InfiniteScroll, { dataLength: items.length, next: handleEndReached, hasMore: hasNextPage, loader: isFetchingNextPage ? _jsx(FooterSkeleton, {}) : null, scrollableTarget: "scrollableBizThreadsDiv", children: items.length === 0 ? (_jsx("div", { className: "flex items-center justify-center py-12", children: _jsx(Empty, { image: _jsx(Icon, { icon: "chat-square-b", size: 80, className: "text-gray-300" }), description: t("empty.no_conversations") }) })) : (items.map((item) => (_jsx(BizThreadCard, { item: item, onClick: handleSelectThread }, item.conversationId)))) }) }));
 };
 export default BizThreadList;

package/dist/components/biz-inbox/BizThreadTitle.d.ts

@@ -2,7 +2,8 @@ import { BizChatCategory } from "../../types/biz";
 export interface BizThreadTitleProps {
     chatCategory: BizChatCategory;
     displayName: string;
+    hasUnread?: boolean;
 }
-declare const BizThreadTitle: ({ chatCategory, displayName }: BizThreadTitleProps) => import("react/jsx-runtime").JSX.Element;
+declare const BizThreadTitle: ({ chatCategory, displayName, hasUnread, }: BizThreadTitleProps) => import("react/jsx-runtime").JSX.Element;
 export default BizThreadTitle;
 //# sourceMappingURL=BizThreadTitle.d.ts.map

package/dist/components/biz-inbox/BizThreadTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadTitle.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadTitle.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,WAAW,mBAAmB;IAClC,YAAY,EAAE,eAAe,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,GAAI,+BAA+B,mBAAmB,4CAczE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BizThreadTitle.d.ts","sourceRoot":"","sources":["../../../src/components/biz-inbox/BizThreadTitle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,WAAW,mBAAmB;IAClC,YAAY,EAAE,eAAe,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,GAAI,2CAIrB,mBAAmB,4CAwBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/biz-inbox/BizThreadTitle.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
 import { Icon } from "../../components/icon";
 import { BizChatCategory } from "../../types/biz";
-const BizThreadTitle = ({ chatCategory, displayName }) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [chatCategory === BizChatCategory.GROUP && (_jsx(Icon, { icon: "user-two-b", size: 12, className: "shrink-0 text-black" })), 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-[linear-gradient(93deg,#607CFB_0%,#1B3FE4_100%)] px-1 py-0.5 text-white", children: _jsx(Icon, { icon: "shield-done-b", size: 8 }) })), _jsx("span", { className: "truncate text-[16px] font-[510] leading-[160%] text-black", children: displayName })] }));
+const BizThreadTitle = ({ chatCategory, displayName, hasUnread = false, }) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [chatCategory === BizChatCategory.GROUP && (_jsx(Icon, { icon: "user-two-b", size: 12, className: "shrink-0 text-black" })), 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-[linear-gradient(93deg,#607CFB_0%,#1B3FE4_100%)] px-1 py-0.5 text-white", children: _jsx(Icon, { icon: "shield-done-b", size: 8 }) })), 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 })] }));
 export default BizThreadTitle;

package/dist/components/biz-thread-detail/BizLinkInputPreview.d.ts

@@ -0,0 +1,7 @@
+export interface BizLinkInputPreviewProps {
+    url: string;
+    onRemove: () => void;
+}
+declare const BizLinkInputPreview: ({ url, onRemove }: BizLinkInputPreviewProps) => import("react/jsx-runtime").JSX.Element;
+export default BizLinkInputPreview;
+//# sourceMappingURL=BizLinkInputPreview.d.ts.map

package/dist/components/biz-thread-detail/BizLinkInputPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BizLinkInputPreview.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizLinkInputPreview.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,wBAAwB;IACvC,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,mBAAmB,GAAI,mBAAmB,wBAAwB,4CAoEvE,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/biz-thread-detail/BizLinkInputPreview.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "../../components/icon";
+import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
+import { getHostLabel } from "../../utils/bizLink";
+import { openBizLink } from "../../utils/openBizLink";
+import { useTranslation } from "react-i18next";
+const BizLinkInputPreview = ({ url, onRemove }) => {
+    const { t } = useTranslation("biz-inbox");
+    const { data, isLoading, isError } = useFetchUrlMetadata(url);
+    const handleOpen = () => {
+        openBizLink(url, t);
+    };
+    return (_jsxs("div", { "data-testid": "biz-link-input-preview", className: "flex w-full shrink-0 items-center gap-2 overflow-hidden bg-[#EAF5FF] pr-2", children: [_jsxs("button", { type: "button", onClick: handleOpen, className: "flex min-w-0 flex-1 items-center gap-2 py-0 pl-0 text-left", children: [_jsx("div", { className: "flex h-[51px] w-[51px] shrink-0 items-center justify-center overflow-hidden bg-[#EAF5FF]", children: isLoading ? (_jsx("div", { className: "h-5 w-5 animate-spin rounded-full border-2 border-[#1B3FE4] border-t-transparent" })) : (data === null || data === void 0 ? void 0 : data.image) ? (_jsx("img", { src: data.image, alt: "", className: "h-full w-full object-cover" })) : (_jsx(Icon, { icon: "link-alt-b", size: 24, className: "text-[#1B3FE4]" })) }), _jsxs("div", { className: "min-w-0 flex-1", children: [isLoading ? (_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-[#393E40]", children: t("link_preview.loading") })) : (_jsxs(_Fragment, { children: [_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-[#393E40]", children: (data === null || data === void 0 ? void 0 : data.title) || getHostLabel(url) }), ((data === null || data === void 0 ? void 0 : data.description) || !(data === null || data === void 0 ? void 0 : data.title)) && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-[#747B7E]", children: (data === null || data === void 0 ? void 0 : data.description) || getHostLabel(url) }))] })), isError && !isLoading && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-[#747B7E]", children: getHostLabel(url) }))] })] }), _jsx("button", { type: "button", onClick: onRemove, "data-testid": "biz-link-input-preview-remove", className: "flex h-4 w-4 shrink-0 items-center justify-center", "aria-label": t("link_preview.remove"), children: _jsx(Icon, { icon: "close-b", size: 16, className: "text-[#393E40]" }) })] }));
+};
+export default BizLinkInputPreview;

package/dist/components/biz-thread-detail/BizLinkMessageCard.d.ts

@@ -0,0 +1,6 @@
+export interface BizLinkMessageCardProps {
+    url: string;
+}
+declare const BizLinkMessageCard: ({ url }: BizLinkMessageCardProps) => import("react/jsx-runtime").JSX.Element | null;
+export default BizLinkMessageCard;
+//# sourceMappingURL=BizLinkMessageCard.d.ts.map

package/dist/components/biz-thread-detail/BizLinkMessageCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BizLinkMessageCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizLinkMessageCard.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,uBAAuB;IACtC,GAAG,EAAE,MAAM,CAAC;CACb;AAED,QAAA,MAAM,kBAAkB,GAAI,SAAS,uBAAuB,mDA+D3D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/biz-thread-detail/BizLinkMessageCard.js

@@ -0,0 +1,21 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
+import { getHostLabel } from "../../utils/bizLink";
+import { openBizLink } from "../../utils/openBizLink";
+const BizLinkMessageCard = ({ url }) => {
+    const { t } = useTranslation("biz-inbox");
+    const { data, isLoading } = useFetchUrlMetadata(url);
+    if (isLoading) {
+        return (_jsxs("div", { "data-testid": "biz-link-message-card-loading", className: "flex w-full max-w-[292px] flex-col overflow-hidden rounded-[12px] border border-[rgba(57,62,64,0.1)] bg-white", children: [_jsx("div", { className: "flex aspect-[1920/1080] w-full items-center justify-center bg-[#EAF5FF]", children: _jsx("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-[#1B3FE4] border-t-transparent" }) }), _jsxs("div", { className: "flex flex-col gap-1 px-3 py-2", children: [_jsx("div", { className: "h-4 w-2/3 animate-pulse rounded bg-[#EFEFEF]" }), _jsx("div", { className: "h-3 w-1/3 animate-pulse rounded bg-[#EFEFEF]" })] })] }));
+    }
+    if (!(data === null || data === void 0 ? void 0 : data.title) && !(data === null || data === void 0 ? void 0 : data.description) && !(data === null || data === void 0 ? void 0 : data.image)) {
+        return null;
+    }
+    const handleOpen = () => {
+        openBizLink(url, t);
+    };
+    return (_jsxs("button", { type: "button", onClick: handleOpen, "data-testid": "biz-link-message-card", className: "flex w-full max-w-[292px] flex-col overflow-hidden rounded-[12px] border border-[rgba(57,62,64,0.1)] bg-white text-left", children: [(data === null || data === void 0 ? void 0 : data.image) && (_jsx("div", { className: "aspect-[1920/1080] w-full overflow-hidden", children: _jsx("img", { src: data.image, alt: "", className: "h-full w-full object-cover" }) })), _jsxs("div", { className: "flex flex-col px-3 py-2", children: [(data === null || data === void 0 ? void 0 : data.title) && (_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-[#393E40]", children: data.title })), _jsx("p", { className: "truncate text-[12px] font-medium leading-[1.6] tracking-[0.12px] text-[#1B3FE4]", children: getHostLabel(url) }), (data === null || data === void 0 ? void 0 : data.description) && (_jsx("p", { className: "line-clamp-2 text-[12px] leading-[1.6] text-[#5C6366]", children: data.description }))] })] }));
+};
+export default BizLinkMessageCard;

package/dist/components/biz-thread-detail/BizLinkTextContent.d.ts

@@ -0,0 +1,6 @@
+export interface BizLinkTextContentProps {
+    text: string;
+}
+declare const BizLinkTextContent: ({ text }: BizLinkTextContentProps) => import("react/jsx-runtime").JSX.Element;
+export default BizLinkTextContent;
+//# sourceMappingURL=BizLinkTextContent.d.ts.map

package/dist/components/biz-thread-detail/BizLinkTextContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BizLinkTextContent.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizLinkTextContent.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,MAAM,CAAC;CACd;AAED,QAAA,MAAM,kBAAkB,GAAI,UAAU,uBAAuB,4CAsB5D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/biz-thread-detail/BizLinkTextContent.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { parseBizTextWithLinks } from "../../utils/bizLink";
+import { openBizLink } from "../../utils/openBizLink";
+const BizLinkTextContent = ({ text }) => {
+    const { t } = useTranslation("biz-inbox");
+    const segments = parseBizTextWithLinks(text);
+    return (_jsx("span", { className: "whitespace-pre-wrap break-words text-[16px] leading-[160%] tracking-[0.16px] text-[#393E40]", children: segments.map((segment, index) => segment.type === "link" ? (_jsx("button", { type: "button", onClick: () => openBizLink(segment.url, t), className: "inline font-medium text-[#1B3FE4] underline-offset-2 hover:underline", children: segment.value }, `${segment.url}-${index}`)) : (_jsx("span", { children: segment.value }, `text-${index}`))) }));
+};
+export default BizLinkTextContent;

package/dist/components/biz-thread-detail/BizMessageBubble.d.ts

@@ -1,6 +1,7 @@
+import type { ReactNode } from "react";
 export interface BizMessageBubbleProps {
     isMine: boolean;
-    content: string;
+    content: ReactNode;
     senderName?: string;
     showSenderName?: boolean;
     showTip?: boolean;

package/dist/components/biz-thread-detail/BizMessageBubble.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageBubble.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA6BD,QAAA,MAAM,gBAAgB,GAAI,2DAMvB,qBAAqB,4CAgCvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"BizMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageBubble.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA6BD,QAAA,MAAM,gBAAgB,GAAI,2DAMvB,qBAAqB,4CA8BvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/biz-thread-detail/BizMessageBubble.js

@@ -10,6 +10,6 @@ const BizMessageBubble = ({ isMine, content, senderName, showSenderName, showTip
             ? "rounded-[20px] rounded-br-none"
             : "rounded-[20px] rounded-bl-none"
         : "rounded-[20px]", isMine ? "bg-[rgba(0,81,255,0.1)]" : "bg-[rgba(131,137,157,0.1)]");
-    return (_jsxs("div", { className: "relative flex items-end", "data-testid": "biz-message-bubble", children: [!isMine && showTip && _jsx(BizMessageBubbleTail, { isMine: isMine }), _jsx("div", { className: bubbleClass, children: _jsxs("div", { className: "flex flex-col gap-1 px-1", children: [showSenderName && senderName && (_jsx("span", { className: "text-[12px] font-medium leading-[160%] tracking-[0.12px] text-[#747B7E]", children: senderName })), _jsx("p", { className: "whitespace-pre-wrap break-words text-[16px] leading-[160%] tracking-[0.16px] text-[#393E40]", children: content })] }) }), isMine && showTip && _jsx(BizMessageBubbleTail, { isMine: isMine })] }));
+    return (_jsxs("div", { className: "relative flex items-end", "data-testid": "biz-message-bubble", children: [!isMine && showTip && _jsx(BizMessageBubbleTail, { isMine: isMine }), _jsx("div", { className: bubbleClass, children: _jsxs("div", { className: "flex flex-col gap-1 px-1", children: [showSenderName && senderName && (_jsx("span", { className: "text-[12px] font-medium leading-[160%] tracking-[0.12px] text-[#747B7E]", children: senderName })), _jsx("div", { className: "flex flex-col gap-2", children: content })] }) }), isMine && showTip && _jsx(BizMessageBubbleTail, { isMine: isMine })] }));
 };
 export default BizMessageBubble;

package/dist/components/biz-thread-detail/BizMessageContent.d.ts

@@ -0,0 +1,7 @@
+import { MessageItem } from "@openim/wasm-client-sdk";
+export interface BizMessageContentProps {
+    message: MessageItem;
+}
+declare const BizMessageContent: ({ message }: BizMessageContentProps) => import("react/jsx-runtime").JSX.Element | null;
+export default BizMessageContent;
+//# sourceMappingURL=BizMessageContent.d.ts.map

package/dist/components/biz-thread-detail/BizMessageContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BizMessageContent.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageContent.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAe,MAAM,yBAAyB,CAAC;AAKnE,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,QAAA,MAAM,iBAAiB,GAAI,aAAa,sBAAsB,mDAgC7D,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/biz-thread-detail/BizMessageContent.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { MessageType } from "@openim/wasm-client-sdk";
+import BizLinkMessageCard from "./BizLinkMessageCard";
+import BizLinkTextContent from "./BizLinkTextContent";
+import { extractBizLinkUrls } from "../../utils/bizLink";
+const BizMessageContent = ({ message }) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const text = (_e = (_d = (_b = (_a = message.textElem) === null || _a === void 0 ? void 0 : _a.content) !== null && _b !== void 0 ? _b : (_c = message.urlTextElem) === null || _c === void 0 ? void 0 : _c.content) !== null && _d !== void 0 ? _d : message.content) !== null && _e !== void 0 ? _e : "";
+    const hasLinks = text ? extractBizLinkUrls(text).length > 0 : false;
+    if (message.contentType === MessageType.UrlTextMessage) {
+        const urls = (_g = (_f = message.urlTextElem) === null || _f === void 0 ? void 0 : _f.urls) !== null && _g !== void 0 ? _g : [];
+        const singleLink = urls.length === 1 ? urls[0] : null;
+        return (_jsxs(_Fragment, { children: [text && _jsx(BizLinkTextContent, { text: text }), singleLink && _jsx(BizLinkMessageCard, { url: singleLink })] }));
+    }
+    if (!text)
+        return null;
+    if (hasLinks) {
+        return _jsx(BizLinkTextContent, { text: text });
+    }
+    return (_jsx("p", { className: "whitespace-pre-wrap break-words text-[16px] leading-[160%] tracking-[0.16px] text-[#393E40]", children: text }));
+};
+export default BizMessageContent;

package/dist/components/biz-thread-detail/BizMessageList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizMessageList.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageList.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,cAAc,+CA8DnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BizMessageList.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageList.tsx"],"names":[],"mappings":"AAgBA,QAAA,MAAM,cAAc,+CA8EnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/biz-thread-detail/BizMessageList.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { Empty, Spin } from "antd";
 import { useTranslation } from "react-i18next";
@@ -8,21 +8,29 @@ import MessageInfiniteScroll from "../../components/message/MessageInfiniteScrol
 import { useMessage } from "../../hooks/message/useMessage";
 import { useMessageListScroll } from "../../hooks/message/useMessageListScroll";
 import useBizConversationStore from "../../store/bizConversation";
+import useConversationStore from "../../store/conversation";
+import { ConnectStatus, SyncStatus } from "../../types/chat";
+import { isBizGroupChat } from "../../utils/bizConversation";
 import emitter from "../../utils/events";
 import BizMessageItem from "./item/BizMessageItem";
 const BizMessageList = () => {
     const { t } = useTranslation("biz-inbox");
-    const { user } = useChatContext();
-    const conversationId = useBizConversationStore((state) => { var _a; return (_a = state.conversationData) === null || _a === void 0 ? void 0 : _a.conversationId; });
-    const messageController = useMessage(conversationId, undefined, !!conversationId);
-    const { scrollRef, loadMoreOldMessage, handleInfiniteScroll, scrollToBottomIfAtBottom, } = useMessageListScroll(Object.assign({ conversationId, userId: user === null || user === void 0 ? void 0 : user.userID }, messageController));
-    const { loadState, moreNewLoading } = messageController;
+    const { user, connectStatus, syncStatus } = useChatContext();
+    const conversation = useBizConversationStore((state) => state.conversationData);
+    const selectedConversationId = useConversationStore((state) => state.selectedConversationId);
+    const isGroupChat = conversation ? isBizGroupChat(conversation) : false;
+    const isSdkReady = connectStatus === ConnectStatus.Connected &&
+        syncStatus !== SyncStatus.Loading;
+    const messageController = useMessage(selectedConversationId, undefined, isSdkReady && !!selectedConversationId);
+    const { scrollRef, loadMoreOldMessage, handleInfiniteScroll, scrollToBottomIfAtBottom, } = useMessageListScroll(Object.assign({ conversationId: selectedConversationId, userId: user === null || user === void 0 ? void 0 : user.userID }, messageController));
+    const { loadState, moreOldLoading } = messageController;
+    const isMessageLoading = !isSdkReady || !selectedConversationId || loadState.initLoading;
     useEffect(() => {
         emitter.on("BIZ_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM", scrollToBottomIfAtBottom);
         return () => {
             emitter.off("BIZ_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM", scrollToBottomIfAtBottom);
         };
     }, [scrollToBottomIfAtBottom]);
-    return (_jsxs("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: [_jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableBizMessagesDiv", loadState: loadState, 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(BizMessageItem, { message: message, allMessages: array }, message.clientMsgID))) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }))] }));
+    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(BizMessageItem, { message: message, allMessages: array, isGroupChat: isGroupChat }, message.clientMsgID))) })) }));
 };
 export default BizMessageList;

package/dist/components/biz-thread-detail/BizThreadDetailHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadDetailHeader.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAQvD,MAAM,WAAW,0BAA0B;IACzC,YAAY,EAAE,mBAAmB,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAqBD,QAAA,MAAM,qBAAqB,GAAI,2BAG5B,0BAA0B,4CA8C5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"BizThreadDetailHeader.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAOvD,MAAM,WAAW,0BAA0B;IACzC,YAAY,EAAE,mBAAmB,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAqBD,QAAA,MAAM,qBAAqB,GAAI,2BAG5B,0BAA0B,4CA0C5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/biz-thread-detail/BizThreadDetailHeader.js

@@ -4,15 +4,14 @@ import { useTranslation } from "react-i18next";
 import { Icon } from "../../components/icon";
 import BizThreadAvatar from "../../components/biz-inbox/BizThreadAvatar";
 import BizThreadTitle from "../../components/biz-inbox/BizThreadTitle";
-import { isBizGroupChat, resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, } from "../../utils/bizConversation";
+import { resolveBizAvatarUrl, resolveBizBadgeLabel, resolveBizDisplayName, } from "../../utils/bizConversation";
 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-[#1B3FE4]", children: _jsx(Icon, { icon: icon, size: 24 }) }));
 const BizThreadDetailHeader = ({ conversation, onBack, }) => {
     const { t } = useTranslation("biz-inbox");
-    const isGroup = isBizGroupChat(conversation);
-    const displayName = resolveBizDisplayName(conversation, t("thread_card.fallback_name"));
+    const displayName = resolveBizDisplayName(conversation, t);
     const avatarUrl = resolveBizAvatarUrl(conversation);
     const badgeLabel = resolveBizBadgeLabel(conversation.chatCategory, t);
-    const subtitle = isGroup ? "" : t("thread_detail.profile_hint");
+    const subtitle = t("thread_detail.profile_hint");
     return (_jsxs("div", { "data-testid": "biz-thread-detail-header", className: "flex w-full cursor-default items-center border-b border-[#EFEFEF] bg-white p-2 shadow-[inset_0px_-1px_0px_0px_rgba(61,63,64,0.1)]", 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, { chatCategory: conversation.chatCategory, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(BizThreadTitle, { chatCategory: conversation.chatCategory, displayName: displayName }), _jsx("p", { className: "truncate text-[10px] font-normal leading-[160%] tracking-[0.1px] text-[#5C6366] [font-feature-settings:'liga'_off,'clig'_off]", children: subtitle })] })] })] }));
 };
 export default BizThreadDetailHeader;

package/dist/components/biz-thread-detail/BizThreadDetailInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizThreadDetailInput.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailInput.tsx"],"names":[],"mappings":"AAcA,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,4CAwM3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"BizThreadDetailInput.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailInput.tsx"],"names":[],"mappings":"AAgBA,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,4CA0N3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/dist/components/biz-thread-detail/BizThreadDetailInput.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import clsx from "clsx";
 import { Icon } from "../../components/icon";
@@ -8,6 +8,8 @@ import { useBizSendMessage } from "../../hooks/biz/useBizSendMessage";
 import useBizConversationStore from "../../store/bizConversation";
 import useBizMessageDraftStore from "../../store/bizMessageDraft";
 import { emit } from "../../utils/events";
+import { extractBizLinkUrls } from "../../utils/bizLink";
+import BizLinkInputPreview from "./BizLinkInputPreview";
 const MAX_LINES = 5;
 const CONTAINER_MIN_HEIGHT = 48;
 const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) => {
@@ -21,6 +23,15 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
     const [value, setValue] = useState("");
     const [isFocused, setIsFocused] = useState(false);
     const [isSending, setIsSending] = useState(false);
+    const [previewDismissed, setPreviewDismissed] = useState(false);
+    const previewUrl = useMemo(() => {
+        const urls = extractBizLinkUrls(value);
+        return urls.length === 1 ? urls[0] : null;
+    }, [value]);
+    const showLinkPreview = !!previewUrl && !previewDismissed;
+    useEffect(() => {
+        setPreviewDismissed(false);
+    }, [previewUrl]);
     const canSend = value.trim().length > 0 && !isSending;
     const getTextareaHeights = useCallback(() => {
         const textarea = textareaRef.current;
@@ -140,8 +151,8 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
         event.preventDefault();
         void handleSend();
     };
-    return (_jsx("div", { ref: containerRef, "data-testid": "biz-thread-detail-input", className: "flex w-full shrink-0 flex-col bg-[rgba(131,137,157,0.05)]", children: _jsxs("div", { className: "flex items-end gap-3 px-3 py-2", children: [_jsx("div", { className: clsx("flex min-w-0 flex-1 overflow-hidden rounded-xl border bg-white transition-shadow", isFocused
-                        ? "border-[#607CFB] shadow-[0px_0px_2px_rgba(27,63,228,0.5)]"
-                        : "border-[#DDDEDF]"), 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-[#747B7E] 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-[#002BEB]" : "bg-[#002BEB] opacity-25"), children: _jsx(Icon, { icon: "send-b", size: 20, className: "text-white" }) }) })] }) }));
+    return (_jsxs("div", { ref: containerRef, "data-testid": "biz-thread-detail-input", className: "flex w-full shrink-0 flex-col bg-[rgba(131,137,157,0.05)]", children: [showLinkPreview && previewUrl && (_jsx(BizLinkInputPreview, { url: previewUrl, onRemove: () => setPreviewDismissed(true) })), _jsxs("div", { className: "flex items-end gap-3 px-3 py-2", children: [_jsx("div", { className: clsx("flex min-w-0 flex-1 overflow-hidden rounded-xl border bg-white transition-shadow", isFocused
+                            ? "border-[#607CFB] shadow-[0px_0px_2px_rgba(27,63,228,0.5)]"
+                            : "border-[#DDDEDF]"), 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-[#747B7E] 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-[#002BEB]" : "bg-[#002BEB] opacity-25"), children: _jsx(Icon, { icon: "send-b", size: 20, className: "text-white" }) }) })] })] }));
 };
 export default BizThreadDetailInput;

package/dist/components/biz-thread-detail/item/BizMessageItem.d.ts

@@ -2,7 +2,8 @@ import { MessageItem } from "@openim/wasm-client-sdk";
 export interface BizMessageItemProps {
     message: MessageItem;
     allMessages: MessageItem[];
+    isGroupChat?: boolean;
 }
-declare const BizMessageItem: ({ message, allMessages }: BizMessageItemProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const BizMessageItem: ({ message, allMessages, isGroupChat, }: BizMessageItemProps) => import("react/jsx-runtime").JSX.Element | null;
 export default BizMessageItem;
 //# sourceMappingURL=BizMessageItem.d.ts.map

package/dist/components/biz-thread-detail/item/BizMessageItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BizMessageItem.d.ts","sourceRoot":"","sources":["../../../../src/components/biz-thread-detail/item/BizMessageItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAOtD,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,WAAW,CAAC;IACrB,WAAW,EAAE,WAAW,EAAE,CAAC;CAC5B;AA4BD,QAAA,MAAM,cAAc,GAAI,0BAA0B,mBAAmB,mDA6CpE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BizMessageItem.d.ts","sourceRoot":"","sources":["../../../../src/components/biz-thread-detail/item/BizMessageItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAStD,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,WAAW,CAAC;IACrB,WAAW,EAAE,WAAW,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAyBD,QAAA,MAAM,cAAc,GAAI,wCAIrB,mBAAmB,mDA0DrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/biz-thread-detail/item/BizMessageItem.js

@@ -2,19 +2,26 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Icon } from "../../../components/icon";
 import useAuthStore from "../../../store/auth";
+import { visibleTypeMessage } from "../../../hooks/message/useMessage";
 import { formatTimestamp } from "../../../utils/common";
-import { getBizMessageDisplay } from "../../../utils/bizMessage";
+import { getBizMessageDisplay, shouldHideBizMessage } from "../../../utils/bizMessage";
 import BizMessageBubble from "../BizMessageBubble";
-const BizMessageAvatar = ({ avatarUrl }) => (_jsx("div", { className: "flex shrink-0 items-center pb-4", children: avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "h-6 w-6 rounded-full object-cover" })) : (_jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded-full bg-[#0C5CFF]", children: _jsx(Icon, { icon: "droppii-o-1", size: 14, className: "text-white" }) })) }));
+import BizMessageContent from "../BizMessageContent";
+const BizMessageAvatar = ({ avatarUrl }) => avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "h-6 w-6 shrink-0 self-end rounded-full object-cover" })) : (_jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center self-end rounded-full bg-[#0C5CFF]", children: _jsx(Icon, { icon: "droppii-o-1", size: 14, className: "text-white" }) }));
 const BizMessageTime = ({ sendTime }) => (_jsx("div", { className: "flex w-full items-center px-4 py-1", children: _jsx("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: _jsx("p", { className: "w-full break-words text-center text-[12px] font-normal leading-[160%] tracking-normal text-[#747B7E]", children: formatTimestamp(sendTime, { hasTime: true }) }) }) }));
-const BizMessageItem = ({ message, allMessages }) => {
+const BizMessageItem = ({ message, allMessages, isGroupChat = false, }) => {
     const userID = useAuthStore((state) => state.userID);
     if (!userID)
         return null;
-    const display = getBizMessageDisplay(message, allMessages, userID);
+    if (shouldHideBizMessage(message) ||
+        !visibleTypeMessage.includes(message.contentType)) {
+        return null;
+    }
+    const display = getBizMessageDisplay(message, allMessages, userID, isGroupChat);
     if (!display.isMine) {
-        return (_jsxs("div", { className: "flex w-full flex-col pb-1", "data-testid": "biz-message-item", children: [display.showTimeBreak && _jsx(BizMessageTime, { sendTime: display.sendTime }), _jsxs("div", { className: "flex w-full items-end pl-3 pr-12", children: [display.showAvatar ? (_jsx(BizMessageAvatar, { avatarUrl: display.senderFaceUrl })) : (_jsx("div", { className: "w-6 shrink-0" })), _jsx("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: _jsx(BizMessageBubble, { isMine: display.isMine, content: display.content, senderName: display.senderName, showSenderName: display.showSenderName, showTip: display.showTip }) })] })] }));
+        return (_jsxs("div", { className: "flex w-full flex-col pb-1", "data-testid": "biz-message-item", children: [display.showTimeBreak && _jsx(BizMessageTime, { sendTime: display.sendTime }), _jsxs("div", { className: "flex w-full items-end gap-1 pl-3 pr-12", children: [isGroupChat &&
+                            (display.showAvatar ? (_jsx(BizMessageAvatar, { avatarUrl: display.senderFaceUrl })) : (_jsx("div", { className: "h-6 w-6 shrink-0 self-end" }))), _jsx("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: _jsx(BizMessageBubble, { isMine: display.isMine, content: _jsx(BizMessageContent, { message: message }), senderName: display.senderName, showSenderName: display.showSenderName, showTip: display.showTip }) })] })] }));
     }
-    return (_jsxs("div", { className: "flex w-full flex-col pb-1", "data-testid": "biz-message-item", children: [display.showTimeBreak && _jsx(BizMessageTime, { sendTime: display.sendTime }), _jsx("div", { className: "flex w-full justify-end pl-12 pr-3", children: _jsx("div", { className: "flex min-w-0 max-w-[calc(100%-48px)] flex-col items-end gap-1", children: _jsx(BizMessageBubble, { isMine: display.isMine, content: display.content, showTip: display.showTip }) }) })] }));
+    return (_jsxs("div", { className: "flex w-full flex-col pb-1", "data-testid": "biz-message-item", children: [display.showTimeBreak && _jsx(BizMessageTime, { sendTime: display.sendTime }), _jsx("div", { className: "flex w-full justify-end pl-12 pr-3", children: _jsx("div", { className: "flex min-w-0 max-w-[calc(100%-48px)] flex-col items-end gap-1", children: _jsx(BizMessageBubble, { isMine: display.isMine, content: _jsx(BizMessageContent, { message: message }), showTip: display.showTip }) }) })] }));
 };
 export default BizMessageItem;

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

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