@droppii-org/chat-sdk 0.1.48 → 0.1.50
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/expand.d.ts +7 -0
- package/dist/assets/svg/expand.d.ts.map +1 -0
- package/dist/assets/svg/expand.js +2 -0
- package/dist/assets/svg/expand.tsx +44 -0
- package/dist/assets/svg/index.d.ts +1 -0
- package/dist/assets/svg/index.d.ts.map +1 -1
- package/dist/assets/svg/index.js +1 -0
- package/dist/assets/svg/index.ts +1 -0
- package/dist/components/biz-thread-detail/BizAttachmentPreview.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/BizAttachmentPreview.js +1 -5
- package/dist/components/biz-thread-detail/BizImageViewer.d.ts +8 -0
- package/dist/components/biz-thread-detail/BizImageViewer.d.ts.map +1 -0
- package/dist/components/biz-thread-detail/BizImageViewer.js +35 -0
- package/dist/components/biz-thread-detail/BizLinkMessageCard.d.ts +3 -2
- package/dist/components/biz-thread-detail/BizLinkMessageCard.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/BizLinkMessageCard.js +4 -8
- package/dist/components/biz-thread-detail/BizMessageContent.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/BizMessageContent.js +105 -6
- package/dist/components/biz-thread-detail/BizThreadDetailInput.d.ts.map +1 -1
- package/dist/components/biz-thread-detail/BizThreadDetailInput.js +29 -4
- package/dist/components/biz-thread-detail/BizVideoViewer.d.ts +8 -0
- package/dist/components/biz-thread-detail/BizVideoViewer.d.ts.map +1 -0
- package/dist/components/biz-thread-detail/BizVideoViewer.js +103 -0
- package/dist/hooks/message/useSendMessage.d.ts +5 -4
- package/dist/hooks/message/useSendMessage.d.ts.map +1 -1
- package/dist/hooks/message/useSendMessage.js +115 -99
- package/dist/screens/biz-thread-detail/index.js +1 -1
- package/dist/styles/global.css +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/chat.d.ts +8 -1
- package/dist/types/chat.d.ts.map +1 -1
- package/dist/utils/bizMessage.d.ts.map +1 -1
- package/dist/utils/bizMessage.js +1 -0
- package/dist/utils/common.d.ts +1 -0
- package/dist/utils/common.d.ts.map +1 -1
- package/dist/utils/common.js +7 -0
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"expand.d.ts","sourceRoot":"","sources":["../../../src/assets/svg/expand.tsx"],"names":[],"mappings":"AAAA,UAAU,SAAS;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,GAAI,qBAA0B,SAAS,4CAsC7D,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export const ExpandIcon = ({ size = 20, className }) => (_jsxs("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, children: [_jsx("path", { d: "M2 7V2H7", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M18 7V2H13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M2 13V18H7", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M18 13V18H13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
interface ISvgProps {
|
|
2
|
+
size?: number;
|
|
3
|
+
className?: string;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
export const ExpandIcon = ({ size = 20, className }: ISvgProps) => (
|
|
7
|
+
<svg
|
|
8
|
+
width={size}
|
|
9
|
+
height={size}
|
|
10
|
+
viewBox="0 0 20 20"
|
|
11
|
+
fill="none"
|
|
12
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
13
|
+
className={className}
|
|
14
|
+
>
|
|
15
|
+
<path
|
|
16
|
+
d="M2 7V2H7"
|
|
17
|
+
stroke="currentColor"
|
|
18
|
+
strokeWidth="1.5"
|
|
19
|
+
strokeLinecap="round"
|
|
20
|
+
strokeLinejoin="round"
|
|
21
|
+
/>
|
|
22
|
+
<path
|
|
23
|
+
d="M18 7V2H13"
|
|
24
|
+
stroke="currentColor"
|
|
25
|
+
strokeWidth="1.5"
|
|
26
|
+
strokeLinecap="round"
|
|
27
|
+
strokeLinejoin="round"
|
|
28
|
+
/>
|
|
29
|
+
<path
|
|
30
|
+
d="M2 13V18H7"
|
|
31
|
+
stroke="currentColor"
|
|
32
|
+
strokeWidth="1.5"
|
|
33
|
+
strokeLinecap="round"
|
|
34
|
+
strokeLinejoin="round"
|
|
35
|
+
/>
|
|
36
|
+
<path
|
|
37
|
+
d="M18 13V18H13"
|
|
38
|
+
stroke="currentColor"
|
|
39
|
+
strokeWidth="1.5"
|
|
40
|
+
strokeLinecap="round"
|
|
41
|
+
strokeLinejoin="round"
|
|
42
|
+
/>
|
|
43
|
+
</svg>
|
|
44
|
+
);
|
|
@@ -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;AAClC,cAAc,UAAU,CAAC"}
|
package/dist/assets/svg/index.js
CHANGED
package/dist/assets/svg/index.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizAttachmentPreview.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizAttachmentPreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"BizAttachmentPreview.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizAttachmentPreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA8IlC,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,QAAA,MAAM,oBAAoB,GAAI,oCAI3B,yBAAyB,mDAuB3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
|
|
@@ -5,11 +5,7 @@ import { Icon } from "../../components/icon";
|
|
|
5
5
|
import { documentIcon } from "../../assets/svg";
|
|
6
6
|
import { shortenFileName } from "../../components/message/footer/FilePreview";
|
|
7
7
|
import { DOCUMENT_MIME_TYPES } from "../../utils/fileValidation";
|
|
8
|
-
|
|
9
|
-
const minutes = Math.floor(seconds / 60);
|
|
10
|
-
const secs = Math.floor(seconds % 60);
|
|
11
|
-
return `${String(minutes).padStart(2, "0")}:${String(secs).padStart(2, "0")}`;
|
|
12
|
-
};
|
|
8
|
+
import { formatDuration } from "../../utils/common";
|
|
13
9
|
const formatFileSize = (bytes) => {
|
|
14
10
|
if (bytes === 0)
|
|
15
11
|
return "0 B";
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
interface BizImageViewerProps {
|
|
2
|
+
images: string[];
|
|
3
|
+
initialIndex?: number;
|
|
4
|
+
onClose: () => void;
|
|
5
|
+
}
|
|
6
|
+
declare const BizImageViewer: ({ images, initialIndex, onClose, }: BizImageViewerProps) => import("react").ReactPortal;
|
|
7
|
+
export default BizImageViewer;
|
|
8
|
+
//# sourceMappingURL=BizImageViewer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BizImageViewer.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizImageViewer.tsx"],"names":[],"mappings":"AAOA,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,GAAI,oCAIrB,mBAAmB,gCA2ErB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useEffect } from "react";
|
|
4
|
+
import { createPortal } from "react-dom";
|
|
5
|
+
import clsx from "clsx";
|
|
6
|
+
import { Icon } from "../../components/icon";
|
|
7
|
+
const BizImageViewer = ({ images, initialIndex = 0, onClose, }) => {
|
|
8
|
+
var _a;
|
|
9
|
+
const [currentIndex, setCurrentIndex] = useState(initialIndex);
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
const handleKeyDown = (e) => {
|
|
12
|
+
if (e.key === "Escape")
|
|
13
|
+
onClose();
|
|
14
|
+
if (e.key === "ArrowLeft")
|
|
15
|
+
setCurrentIndex((i) => Math.max(0, i - 1));
|
|
16
|
+
if (e.key === "ArrowRight")
|
|
17
|
+
setCurrentIndex((i) => Math.min(images.length - 1, i + 1));
|
|
18
|
+
};
|
|
19
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
20
|
+
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
21
|
+
}, [images.length, onClose]);
|
|
22
|
+
const handleDownload = () => {
|
|
23
|
+
const url = images[currentIndex];
|
|
24
|
+
const filename = url.substring(url.lastIndexOf("/") + 1) || "image";
|
|
25
|
+
const link = document.createElement("a");
|
|
26
|
+
link.href = url;
|
|
27
|
+
link.download = filename;
|
|
28
|
+
document.body.appendChild(link);
|
|
29
|
+
link.click();
|
|
30
|
+
document.body.removeChild(link);
|
|
31
|
+
};
|
|
32
|
+
const container = (_a = document.querySelector('[data-testid="biz-thread-detail-root"]')) !== null && _a !== void 0 ? _a : document.body;
|
|
33
|
+
return createPortal(_jsxs("div", { className: "absolute inset-0 z-[999] flex flex-col bg-black", children: [_jsxs("div", { className: "flex items-center justify-between px-4 pt-12 pb-4", children: [_jsx("button", { className: "flex h-10 w-10 items-center justify-center text-white text-xl", onClick: onClose, children: _jsx(Icon, { icon: "close-b", size: 24 }) }), _jsx("button", { className: "flex h-10 w-10 items-center justify-center text-white text-xl", onClick: handleDownload, children: _jsx(Icon, { icon: "download-o", size: 24 }) })] }), _jsx("div", { className: "flex min-h-0 flex-1 items-center justify-center overflow-hidden px-4", children: _jsx("img", { src: images[currentIndex], alt: "", className: "max-h-full max-w-full rounded-[24px] object-contain" }) }), _jsxs("div", { className: "flex flex-col items-center gap-2 pb-8 pt-4", children: [_jsxs("span", { className: "text-sm text-white", children: [currentIndex + 1, "/", images.length] }), _jsx("div", { className: "flex gap-1.5", children: images.map((_, i) => (_jsx("button", { className: clsx("h-1.5 w-1.5 rounded-full transition-colors", i === currentIndex ? "bg-white" : "bg-white/30"), onClick: () => setCurrentIndex(i) }, i))) })] })] }), container);
|
|
34
|
+
};
|
|
35
|
+
export default BizImageViewer;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import type { UrlMetadataInfo } from "../../types/chat";
|
|
1
2
|
export interface BizLinkMessageCardProps {
|
|
2
|
-
|
|
3
|
+
metadata: UrlMetadataInfo;
|
|
3
4
|
}
|
|
4
|
-
declare const BizLinkMessageCard: ({
|
|
5
|
+
declare const BizLinkMessageCard: ({ metadata }: BizLinkMessageCardProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
5
6
|
export default BizLinkMessageCard;
|
|
6
7
|
//# sourceMappingURL=BizLinkMessageCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizLinkMessageCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizLinkMessageCard.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BizLinkMessageCard.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizLinkMessageCard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,eAAe,CAAC;CAC3B;AAED,QAAA,MAAM,kBAAkB,GAAI,cAAc,uBAAuB,mDA8ChE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1,21 +1,17 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useTranslation } from "react-i18next";
|
|
4
|
-
import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
|
|
5
4
|
import { getHostLabel } from "../../utils/bizLink";
|
|
6
5
|
import { openBizLink } from "../../utils/openBizLink";
|
|
7
|
-
const BizLinkMessageCard = ({
|
|
6
|
+
const BizLinkMessageCard = ({ metadata }) => {
|
|
8
7
|
const { t } = useTranslation("biz-inbox");
|
|
9
|
-
const {
|
|
10
|
-
if (
|
|
11
|
-
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]" })] })] }));
|
|
12
|
-
}
|
|
13
|
-
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)) {
|
|
8
|
+
const { url, title, description, image } = metadata;
|
|
9
|
+
if (!title && !description && !image) {
|
|
14
10
|
return null;
|
|
15
11
|
}
|
|
16
12
|
const handleOpen = () => {
|
|
17
13
|
openBizLink(url, t);
|
|
18
14
|
};
|
|
19
|
-
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: [
|
|
15
|
+
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: [image && (_jsx("div", { className: "aspect-[16/9] w-full overflow-hidden", children: _jsx("img", { src: image, alt: "", className: "h-full w-full object-cover" }) })), _jsxs("div", { className: "flex flex-col px-3 py-2", children: [title && (_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-[#393E40]", children: title })), _jsx("p", { className: "truncate text-[12px] font-medium leading-[1.6] tracking-[0.12px] text-[#1B3FE4]", children: getHostLabel(url) }), description && (_jsx("p", { className: "line-clamp-2 text-[12px] leading-[1.6] text-[#5C6366]", children: description }))] })] }));
|
|
20
16
|
};
|
|
21
17
|
export default BizLinkMessageCard;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizMessageContent.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageContent.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BizMessageContent.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizMessageContent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAA8B,MAAM,yBAAyB,CAAC;AAalF,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,WAAW,CAAC;CACtB;AAgND,QAAA,MAAM,iBAAiB,GAAI,aAAa,sBAAsB,mDAyD7D,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,18 +1,117 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
3
|
+
import { useState } from "react";
|
|
4
|
+
import clsx from "clsx";
|
|
5
|
+
import { MessageStatus, MessageType } from "@openim/wasm-client-sdk";
|
|
6
|
+
import { Image, Spin } from "antd";
|
|
7
|
+
import { Icon } from "../../components/icon";
|
|
8
|
+
import { documentIcon } from "../../assets/svg";
|
|
9
|
+
import { shortenFileName } from "../../components/message/footer/FilePreview";
|
|
4
10
|
import BizLinkMessageCard from "./BizLinkMessageCard";
|
|
5
11
|
import BizLinkTextContent from "./BizLinkTextContent";
|
|
12
|
+
import BizImageViewer from "./BizImageViewer";
|
|
13
|
+
import BizVideoViewer from "./BizVideoViewer";
|
|
6
14
|
import { extractBizLinkUrls } from "../../utils/bizLink";
|
|
15
|
+
import { formatDuration, renderFileSize } from "../../utils/common";
|
|
16
|
+
const MERGE_IMAGE_GRID_COLS_CLASS = {
|
|
17
|
+
1: "grid-cols-[repeat(1,100px)]",
|
|
18
|
+
2: "grid-cols-[repeat(2,100px)]",
|
|
19
|
+
3: "grid-cols-[repeat(3,100px)]",
|
|
20
|
+
};
|
|
21
|
+
const BizPictureMessage = ({ message }) => {
|
|
22
|
+
var _a, _b, _c;
|
|
23
|
+
const [viewerVisible, setViewerVisible] = useState(false);
|
|
24
|
+
const pictureElem = message.pictureElem;
|
|
25
|
+
const sourceUrl = ((_a = pictureElem === null || pictureElem === void 0 ? void 0 : pictureElem.sourcePicture) === null || _a === void 0 ? void 0 : _a.url) || ((_b = pictureElem === null || pictureElem === void 0 ? void 0 : pictureElem.snapshotPicture) === null || _b === void 0 ? void 0 : _b.url) || "";
|
|
26
|
+
const bigUrl = ((_c = pictureElem === null || pictureElem === void 0 ? void 0 : pictureElem.bigPicture) === null || _c === void 0 ? void 0 : _c.url) || sourceUrl;
|
|
27
|
+
const isSending = message.status === MessageStatus.Sending;
|
|
28
|
+
return (_jsxs("div", { className: "-mx-1", children: [_jsx(Spin, { spinning: isSending, children: _jsx("div", { className: "cursor-pointer", onClick: () => setViewerVisible(true), children: _jsx(Image, { src: sourceUrl, width: 205, height: 205, className: "rounded-xl object-cover", preview: false, placeholder: _jsx("div", { className: "flex h-[205px] w-[205px] items-center justify-center rounded-xl bg-black/10", children: _jsx(Spin, {}) }) }) }) }), viewerVisible && (_jsx(BizImageViewer, { images: [bigUrl], onClose: () => setViewerVisible(false) }))] }));
|
|
29
|
+
};
|
|
30
|
+
const BizMergeImageMessage = ({ message }) => {
|
|
31
|
+
var _a, _b;
|
|
32
|
+
const [viewerIndex, setViewerIndex] = useState(null);
|
|
33
|
+
const subMessages = (_b = (_a = message.mergeElem) === null || _a === void 0 ? void 0 : _a.multiMessage) !== null && _b !== void 0 ? _b : [];
|
|
34
|
+
const isSending = message.status === MessageStatus.Sending;
|
|
35
|
+
const cols = Math.min(subMessages.length, 3);
|
|
36
|
+
const imageUrls = subMessages.map((item) => {
|
|
37
|
+
var _a, _b, _c, _d, _e, _f;
|
|
38
|
+
const sourceUrl = ((_b = (_a = item.pictureElem) === null || _a === void 0 ? void 0 : _a.sourcePicture) === null || _b === void 0 ? void 0 : _b.url) ||
|
|
39
|
+
((_d = (_c = item.pictureElem) === null || _c === void 0 ? void 0 : _c.snapshotPicture) === null || _d === void 0 ? void 0 : _d.url) ||
|
|
40
|
+
"";
|
|
41
|
+
return ((_f = (_e = item.pictureElem) === null || _e === void 0 ? void 0 : _e.bigPicture) === null || _f === void 0 ? void 0 : _f.url) || sourceUrl;
|
|
42
|
+
});
|
|
43
|
+
return (_jsxs("div", { className: "-mx-1", children: [_jsx(Spin, { spinning: isSending, children: _jsx("div", { className: clsx("grid gap-1", MERGE_IMAGE_GRID_COLS_CLASS[cols]), children: subMessages.map((item, index) => {
|
|
44
|
+
var _a, _b, _c, _d;
|
|
45
|
+
const sourceUrl = ((_b = (_a = item.pictureElem) === null || _a === void 0 ? void 0 : _a.sourcePicture) === null || _b === void 0 ? void 0 : _b.url) ||
|
|
46
|
+
((_d = (_c = item.pictureElem) === null || _c === void 0 ? void 0 : _c.snapshotPicture) === null || _d === void 0 ? void 0 : _d.url) ||
|
|
47
|
+
"";
|
|
48
|
+
return (_jsx("div", { className: "cursor-pointer", onClick: () => setViewerIndex(index), children: _jsx(Image, { src: sourceUrl, width: 100, height: 100, className: "rounded-xl object-cover", preview: false, placeholder: _jsx("div", { className: "flex h-[100px] w-[100px] items-center justify-center rounded-xl bg-black/10", children: _jsx(Spin, {}) }) }) }, item.clientMsgID));
|
|
49
|
+
}) }) }), viewerIndex !== null && (_jsx(BizImageViewer, { images: imageUrls, initialIndex: viewerIndex, onClose: () => setViewerIndex(null) }))] }));
|
|
50
|
+
};
|
|
51
|
+
const BizVideoMessage = ({ message }) => {
|
|
52
|
+
var _a;
|
|
53
|
+
const [viewerVisible, setViewerVisible] = useState(false);
|
|
54
|
+
const videoElem = message.videoElem;
|
|
55
|
+
const videoUrl = (videoElem === null || videoElem === void 0 ? void 0 : videoElem.videoUrl) || "";
|
|
56
|
+
const posterUrl = (videoElem === null || videoElem === void 0 ? void 0 : videoElem.snapshotUrl) || "";
|
|
57
|
+
const durationSeconds = ((_a = videoElem === null || videoElem === void 0 ? void 0 : videoElem.duration) !== null && _a !== void 0 ? _a : 0) / 1000;
|
|
58
|
+
const isSending = message.status === MessageStatus.Sending;
|
|
59
|
+
return (_jsxs("div", { className: "-mx-1", children: [_jsx(Spin, { spinning: isSending, children: _jsxs("div", { className: "relative h-[150px] w-[215px] cursor-pointer overflow-hidden rounded-xl", onClick: () => setViewerVisible(true), children: [_jsx("img", { src: posterUrl, alt: "", className: "h-full w-full object-cover" }), _jsx("div", { className: "absolute bottom-1 right-1 flex h-[18px] w-9 items-center justify-center rounded-xl bg-black/70", children: _jsx("span", { className: "text-[10px] leading-[1.6] text-white", children: formatDuration(durationSeconds) }) }), _jsx("div", { className: "absolute left-1/2 top-1/2 flex h-[50px] w-[50px] -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-2xl bg-black/60", children: _jsx(Icon, { icon: "play-b", size: 24, className: "text-white" }) })] }) }), viewerVisible && (_jsx(BizVideoViewer, { videoUrl: videoUrl, posterUrl: posterUrl, onClose: () => setViewerVisible(false) }))] }));
|
|
60
|
+
};
|
|
61
|
+
const BizFileMessage = ({ message }) => {
|
|
62
|
+
var _a;
|
|
63
|
+
const fileElem = message.fileElem;
|
|
64
|
+
const fileName = (fileElem === null || fileElem === void 0 ? void 0 : fileElem.fileName) || "";
|
|
65
|
+
const fileSize = (_a = fileElem === null || fileElem === void 0 ? void 0 : fileElem.fileSize) !== null && _a !== void 0 ? _a : 0;
|
|
66
|
+
const sourceUrl = (fileElem === null || fileElem === void 0 ? void 0 : fileElem.sourceUrl) || "";
|
|
67
|
+
const isSending = message.status === MessageStatus.Sending;
|
|
68
|
+
const hasUrl = !!sourceUrl;
|
|
69
|
+
const handleView = () => {
|
|
70
|
+
if (!hasUrl)
|
|
71
|
+
return;
|
|
72
|
+
window.open(sourceUrl, "_blank", "noopener,noreferrer");
|
|
73
|
+
};
|
|
74
|
+
const handleDownload = () => {
|
|
75
|
+
if (!hasUrl)
|
|
76
|
+
return;
|
|
77
|
+
const link = document.createElement("a");
|
|
78
|
+
link.href = sourceUrl;
|
|
79
|
+
link.setAttribute("download", fileName);
|
|
80
|
+
link.setAttribute("target", "_blank");
|
|
81
|
+
link.setAttribute("rel", "noopener noreferrer");
|
|
82
|
+
document.body.appendChild(link);
|
|
83
|
+
link.click();
|
|
84
|
+
link.remove();
|
|
85
|
+
};
|
|
86
|
+
return (_jsx(Spin, { spinning: isSending, children: _jsxs("div", { className: "flex h-[51px] w-[292px] items-center gap-3 rounded-xl border border-[rgba(168,173,175,0.2)] bg-white px-3 py-1", children: [_jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center overflow-hidden [&>svg]:h-6 [&>svg]:w-6", children: documentIcon }), _jsxs("div", { className: "flex min-w-0 w-[168px] flex-col justify-center", children: [_jsx("span", { className: "truncate text-[14px] font-medium leading-[160%] text-[#393E40]", children: shortenFileName(fileName) }), _jsx("span", { className: "truncate text-[13px] leading-[160%] text-[#5C6366]", children: renderFileSize(fileSize) })] }), _jsxs("div", { className: "flex w-[52px] shrink-0 items-center justify-end gap-3", children: [_jsx("button", { type: "button", onClick: handleView, disabled: !hasUrl, "aria-label": "Xem file", className: !hasUrl ? "opacity-30" : undefined, children: _jsx(Icon, { icon: "eye-o", size: 20, className: "text-[#393E40]" }) }), _jsx("button", { type: "button", onClick: handleDownload, disabled: !hasUrl, "aria-label": "T\u1EA3i xu\u1ED1ng", className: !hasUrl ? "opacity-30" : undefined, children: _jsx(Icon, { icon: "download-o", size: 20, className: "text-[#393E40]" }) })] })] }) }));
|
|
87
|
+
};
|
|
7
88
|
const BizMessageContent = ({ message }) => {
|
|
8
|
-
var _a, _b, _c, _d, _e
|
|
89
|
+
var _a, _b, _c, _d, _e;
|
|
90
|
+
if (message.contentType === MessageType.PictureMessage) {
|
|
91
|
+
return _jsx(BizPictureMessage, { message: message });
|
|
92
|
+
}
|
|
93
|
+
if (message.contentType === MessageType.FileMessage) {
|
|
94
|
+
return _jsx(BizFileMessage, { message: message });
|
|
95
|
+
}
|
|
96
|
+
if (message.contentType === MessageType.VideoMessage) {
|
|
97
|
+
return _jsx(BizVideoMessage, { message: message });
|
|
98
|
+
}
|
|
99
|
+
if (message.contentType === MessageType.MergeMessage) {
|
|
100
|
+
return _jsx(BizMergeImageMessage, { message: message });
|
|
101
|
+
}
|
|
9
102
|
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 : "";
|
|
10
103
|
const hasLinks = text ? extractBizLinkUrls(text).length > 0 : false;
|
|
11
104
|
if (message.contentType === MessageType.UrlTextMessage) {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
105
|
+
let urlMetadata;
|
|
106
|
+
try {
|
|
107
|
+
const ex = JSON.parse(message.ex || "{}");
|
|
108
|
+
urlMetadata = ex.urlMetadata;
|
|
109
|
+
}
|
|
110
|
+
catch (_f) {
|
|
111
|
+
urlMetadata = undefined;
|
|
112
|
+
}
|
|
113
|
+
if (urlMetadata === null || urlMetadata === void 0 ? void 0 : urlMetadata.url) {
|
|
114
|
+
return (_jsxs("div", { className: "flex max-w-[292px] flex-col gap-2", children: [text && _jsx(BizLinkTextContent, { text: text }), _jsx(BizLinkMessageCard, { metadata: urlMetadata })] }));
|
|
16
115
|
}
|
|
17
116
|
return text ? _jsx(BizLinkTextContent, { text: text }) : null;
|
|
18
117
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BizThreadDetailInput.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizThreadDetailInput.tsx"],"names":[],"mappings":"
|
|
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,4CAiZ3B,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
|
|
@@ -13,6 +13,7 @@ import useBizMessageDraftStore from "../../store/bizMessageDraft";
|
|
|
13
13
|
import { resolveBizAvatarUrl, resolveBizDisplayName, } from "../../utils/bizConversation";
|
|
14
14
|
import { emit } from "../../utils/events";
|
|
15
15
|
import { extractBizLinkUrls } from "../../utils/bizLink";
|
|
16
|
+
import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
|
|
16
17
|
import { processAndValidateDocuments, processAndValidateFiles, } from "../../utils/fileValidation";
|
|
17
18
|
import BizAttachmentPreview from "./BizAttachmentPreview";
|
|
18
19
|
import BizLinkInputPreview from "./BizLinkInputPreview";
|
|
@@ -42,7 +43,7 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
42
43
|
"",
|
|
43
44
|
}),
|
|
44
45
|
}), [bizConversation, conversationData, t]);
|
|
45
|
-
const { sendTextMessage } = useSendMessage(sendMessageOptions);
|
|
46
|
+
const { sendTextMessage, sendMergeMessage } = useSendMessage(sendMessageOptions);
|
|
46
47
|
const userID = useAuthStore((state) => state.userID);
|
|
47
48
|
const setDraft = useBizMessageDraftStore((state) => state.setDraft);
|
|
48
49
|
const clearDraft = useBizMessageDraftStore((state) => state.clearDraft);
|
|
@@ -58,14 +59,20 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
58
59
|
const [previewDismissed, setPreviewDismissed] = useState(false);
|
|
59
60
|
const [isMoreOptionOpen, { setFalse: closeMoreOption, toggle: toggleMoreOption },] = useBoolean(false);
|
|
60
61
|
const previewUrl = useMemo(() => {
|
|
62
|
+
var _a;
|
|
61
63
|
const urls = extractBizLinkUrls(value);
|
|
62
|
-
return
|
|
64
|
+
return (_a = urls[0]) !== null && _a !== void 0 ? _a : null;
|
|
63
65
|
}, [value]);
|
|
64
66
|
const showLinkPreview = !!previewUrl && !previewDismissed;
|
|
67
|
+
const { data: previewMetadata } = useFetchUrlMetadata(previewUrl !== null && previewUrl !== void 0 ? previewUrl : "", showLinkPreview);
|
|
65
68
|
useEffect(() => {
|
|
66
69
|
setPreviewDismissed(false);
|
|
67
70
|
}, [previewUrl]);
|
|
68
|
-
const
|
|
71
|
+
const hasFiles = listUploadFiles.length > 0;
|
|
72
|
+
const canSend = (value.trim().length > 0 || hasFiles) &&
|
|
73
|
+
!isSending &&
|
|
74
|
+
isConversationReady &&
|
|
75
|
+
!isVideoLoading;
|
|
69
76
|
const getTextareaHeights = useCallback(() => {
|
|
70
77
|
const textarea = textareaRef.current;
|
|
71
78
|
if (!textarea)
|
|
@@ -171,18 +178,36 @@ const BizThreadDetailInput = ({ placeholder, onSendMessage, onInputChange, }) =>
|
|
|
171
178
|
};
|
|
172
179
|
const handleSend = async () => {
|
|
173
180
|
const text = value.trim();
|
|
174
|
-
if (!text || isSending)
|
|
181
|
+
if ((!text && !hasFiles) || isSending)
|
|
175
182
|
return;
|
|
176
183
|
setIsSending(true);
|
|
177
184
|
try {
|
|
178
185
|
if (onSendMessage) {
|
|
179
186
|
onSendMessage(text);
|
|
180
187
|
}
|
|
188
|
+
else if (hasFiles) {
|
|
189
|
+
await sendMergeMessage({
|
|
190
|
+
plainText: text,
|
|
191
|
+
richText: "",
|
|
192
|
+
files: listUploadFiles,
|
|
193
|
+
isInternal: false,
|
|
194
|
+
});
|
|
195
|
+
setListUploadFiles([]);
|
|
196
|
+
}
|
|
181
197
|
else {
|
|
198
|
+
const urlMetadata = showLinkPreview && previewUrl && previewMetadata
|
|
199
|
+
? {
|
|
200
|
+
url: previewUrl,
|
|
201
|
+
title: previewMetadata.title,
|
|
202
|
+
description: previewMetadata.description,
|
|
203
|
+
image: previewMetadata.image,
|
|
204
|
+
}
|
|
205
|
+
: undefined;
|
|
182
206
|
const sent = await sendTextMessage({
|
|
183
207
|
plainText: text,
|
|
184
208
|
richText: "",
|
|
185
209
|
isInternal: false,
|
|
210
|
+
urlMetadata,
|
|
186
211
|
});
|
|
187
212
|
if (!sent)
|
|
188
213
|
return;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
interface BizVideoViewerProps {
|
|
2
|
+
videoUrl: string;
|
|
3
|
+
posterUrl?: string;
|
|
4
|
+
onClose: () => void;
|
|
5
|
+
}
|
|
6
|
+
declare const BizVideoViewer: ({ videoUrl, posterUrl, onClose }: BizVideoViewerProps) => import("react").ReactPortal;
|
|
7
|
+
export default BizVideoViewer;
|
|
8
|
+
//# sourceMappingURL=BizVideoViewer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BizVideoViewer.d.ts","sourceRoot":"","sources":["../../../src/components/biz-thread-detail/BizVideoViewer.tsx"],"names":[],"mappings":"AAQA,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAID,QAAA,MAAM,cAAc,GAAI,kCAAkC,mBAAmB,gCAyM5E,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect, useRef, useState } from "react";
|
|
4
|
+
import { createPortal } from "react-dom";
|
|
5
|
+
import { Icon } from "../../components/icon";
|
|
6
|
+
import { ExpandIcon } from "../../assets/svg";
|
|
7
|
+
import { formatDuration } from "../../utils/common";
|
|
8
|
+
const SKIP_SECONDS = 10;
|
|
9
|
+
const BizVideoViewer = ({ videoUrl, posterUrl, onClose }) => {
|
|
10
|
+
var _a;
|
|
11
|
+
const containerRef = useRef(null);
|
|
12
|
+
const videoRef = useRef(null);
|
|
13
|
+
const [isPlaying, setIsPlaying] = useState(false);
|
|
14
|
+
const [isMuted, setIsMuted] = useState(false);
|
|
15
|
+
const [isFullscreen, setIsFullscreen] = useState(false);
|
|
16
|
+
const [currentTime, setCurrentTime] = useState(0);
|
|
17
|
+
const [duration, setDuration] = useState(0);
|
|
18
|
+
const togglePlay = () => {
|
|
19
|
+
const video = videoRef.current;
|
|
20
|
+
if (!video)
|
|
21
|
+
return;
|
|
22
|
+
if (video.paused) {
|
|
23
|
+
void video.play();
|
|
24
|
+
}
|
|
25
|
+
else {
|
|
26
|
+
video.pause();
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
const skip = (seconds) => {
|
|
30
|
+
const video = videoRef.current;
|
|
31
|
+
if (!video)
|
|
32
|
+
return;
|
|
33
|
+
const max = video.duration || Infinity;
|
|
34
|
+
video.currentTime = Math.min(Math.max(video.currentTime + seconds, 0), max);
|
|
35
|
+
setCurrentTime(video.currentTime);
|
|
36
|
+
};
|
|
37
|
+
const toggleFullscreen = () => {
|
|
38
|
+
var _a, _b;
|
|
39
|
+
const el = containerRef.current;
|
|
40
|
+
if (!el)
|
|
41
|
+
return;
|
|
42
|
+
if (!document.fullscreenElement) {
|
|
43
|
+
void ((_a = el.requestFullscreen) === null || _a === void 0 ? void 0 : _a.call(el));
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
void ((_b = document.exitFullscreen) === null || _b === void 0 ? void 0 : _b.call(document));
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
useEffect(() => {
|
|
50
|
+
const handleKeyDown = (event) => {
|
|
51
|
+
if (event.key === "Escape")
|
|
52
|
+
onClose();
|
|
53
|
+
if (event.key === " ") {
|
|
54
|
+
event.preventDefault();
|
|
55
|
+
togglePlay();
|
|
56
|
+
}
|
|
57
|
+
if (event.key === "ArrowLeft")
|
|
58
|
+
skip(-SKIP_SECONDS);
|
|
59
|
+
if (event.key === "ArrowRight")
|
|
60
|
+
skip(SKIP_SECONDS);
|
|
61
|
+
};
|
|
62
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
63
|
+
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
64
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
65
|
+
}, [onClose]);
|
|
66
|
+
useEffect(() => {
|
|
67
|
+
const handleFullscreenChange = () => setIsFullscreen(document.fullscreenElement === containerRef.current);
|
|
68
|
+
document.addEventListener("fullscreenchange", handleFullscreenChange);
|
|
69
|
+
return () => document.removeEventListener("fullscreenchange", handleFullscreenChange);
|
|
70
|
+
}, []);
|
|
71
|
+
useEffect(() => {
|
|
72
|
+
var _a;
|
|
73
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.play().catch(() => { });
|
|
74
|
+
}, []);
|
|
75
|
+
const toggleMute = () => {
|
|
76
|
+
const video = videoRef.current;
|
|
77
|
+
if (!video)
|
|
78
|
+
return;
|
|
79
|
+
video.muted = !video.muted;
|
|
80
|
+
setIsMuted(video.muted);
|
|
81
|
+
};
|
|
82
|
+
const handleSeek = (event) => {
|
|
83
|
+
const video = videoRef.current;
|
|
84
|
+
if (!video)
|
|
85
|
+
return;
|
|
86
|
+
const value = Number(event.target.value);
|
|
87
|
+
video.currentTime = value;
|
|
88
|
+
setCurrentTime(value);
|
|
89
|
+
};
|
|
90
|
+
const handleDownload = () => {
|
|
91
|
+
const filename = videoUrl.substring(videoUrl.lastIndexOf("/") + 1) || "video";
|
|
92
|
+
const link = document.createElement("a");
|
|
93
|
+
link.href = videoUrl;
|
|
94
|
+
link.download = filename;
|
|
95
|
+
document.body.appendChild(link);
|
|
96
|
+
link.click();
|
|
97
|
+
document.body.removeChild(link);
|
|
98
|
+
};
|
|
99
|
+
const remainingTime = Math.max(duration - currentTime, 0);
|
|
100
|
+
const container = (_a = document.querySelector('[data-testid="biz-thread-detail-root"]')) !== null && _a !== void 0 ? _a : document.body;
|
|
101
|
+
return createPortal(_jsxs("div", { ref: containerRef, className: "absolute inset-0 z-[999] flex flex-col bg-black", children: [_jsxs("div", { className: "flex items-center justify-between px-4 pt-12 pb-4", children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsx("button", { type: "button", className: "flex h-10 w-10 items-center justify-center text-white", onClick: onClose, "aria-label": "\u0110\u00F3ng", children: _jsx(Icon, { icon: "close-b", size: 24 }) }), _jsx("button", { type: "button", className: "flex h-10 w-10 items-center justify-center text-white", onClick: toggleFullscreen, "aria-label": isFullscreen ? "Thu nhỏ" : "Toàn màn hình", children: _jsx(ExpandIcon, { size: 20 }) })] }), _jsx("button", { type: "button", className: "flex h-10 w-10 items-center justify-center text-white", onClick: handleDownload, "aria-label": "T\u1EA3i xu\u1ED1ng", children: _jsx(Icon, { icon: "download-o", size: 24 }) })] }), _jsxs("div", { className: "relative flex min-h-0 flex-1 items-center justify-center overflow-hidden px-4", children: [_jsx("video", { ref: videoRef, src: videoUrl, poster: posterUrl, className: "max-h-full max-w-full rounded-[24px] object-contain", onPlay: () => setIsPlaying(true), onPause: () => setIsPlaying(false), onTimeUpdate: (event) => setCurrentTime(event.currentTarget.currentTime), onLoadedMetadata: (event) => setDuration(event.currentTarget.duration), onClick: togglePlay }), _jsxs("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-between px-8", children: [_jsx("button", { type: "button", className: "pointer-events-auto relative flex h-9 w-9 items-center justify-center text-white", onClick: () => skip(-SKIP_SECONDS), "aria-label": "L\u00F9i 10 gi\u00E2y", children: _jsx(Icon, { icon: "arrow-reload-o", size: 30 }) }), !isPlaying && (_jsx("button", { type: "button", className: "pointer-events-auto flex h-[50px] w-[50px] shrink-0 items-center justify-center rounded-2xl bg-black/60", onClick: togglePlay, "aria-label": "Ph\u00E1t", children: _jsx(Icon, { icon: "play-b", size: 24, className: "text-white" }) })), _jsx("button", { type: "button", className: "pointer-events-auto relative flex h-9 w-9 items-center justify-center text-white", onClick: () => skip(SKIP_SECONDS), "aria-label": "Ti\u1EBFn 10 gi\u00E2y", children: _jsx(Icon, { icon: "arrow-reload-o", size: 30, className: "-scale-x-100" }) })] })] }), _jsx("div", { className: "flex flex-col gap-2 px-4 pb-8 pt-4", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "w-9 shrink-0 text-xs text-white", children: formatDuration(currentTime) }), _jsx("input", { type: "range", min: 0, max: duration || 0, step: 0.1, value: currentTime, onChange: handleSeek, className: "h-1 flex-1 cursor-pointer appearance-none rounded-full bg-white/30 accent-white" }), _jsxs("span", { className: "w-9 shrink-0 text-right text-xs text-white", children: ["-", formatDuration(remainingTime)] }), _jsx("button", { type: "button", onClick: toggleMute, className: "flex h-6 w-6 shrink-0 items-center justify-center text-white", "aria-label": "\u00C2m l\u01B0\u1EE3ng", children: _jsx(Icon, { icon: isMuted ? "volume-off-o" : "volume-up-o", size: 20 }) })] }) })] }), container);
|
|
102
|
+
};
|
|
103
|
+
export default BizVideoViewer;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { MergerMsgParams, MessageItem } from "@openim/wasm-client-sdk";
|
|
2
|
-
import { ExtendMessageInfo, FileMsgParamsByFile, ImageMsgParamsByFile, VideoMsgParamsByFile } from "../../types/chat";
|
|
2
|
+
import { ExtendMessageInfo, FileMsgParamsByFile, ImageMsgParamsByFile, UrlMetadataInfo, VideoMsgParamsByFile } from "../../types/chat";
|
|
3
3
|
import { UploadFile } from "antd";
|
|
4
4
|
import { ISessionResponse } from "../../types/dto";
|
|
5
5
|
export declare const isMediaResendable: (message: {
|
|
@@ -27,11 +27,12 @@ export interface UseSendMessageOptions {
|
|
|
27
27
|
}) => OfflinePushMeta;
|
|
28
28
|
}
|
|
29
29
|
export declare const useSendMessage: (options?: UseSendMessageOptions) => {
|
|
30
|
-
sendTextMessage: ({ plainText, richText, currentSession, isInternal, }: {
|
|
30
|
+
sendTextMessage: ({ plainText, richText, currentSession, isInternal, urlMetadata, }: {
|
|
31
31
|
plainText: string;
|
|
32
32
|
richText: string;
|
|
33
33
|
currentSession?: ISessionResponse;
|
|
34
34
|
isInternal: boolean;
|
|
35
|
+
urlMetadata?: UrlMetadataInfo;
|
|
35
36
|
}) => Promise<boolean>;
|
|
36
37
|
sendMergeMessage: ({ richText, plainText, files, currentSession, isInternal, }: {
|
|
37
38
|
richText: string;
|
|
@@ -42,9 +43,9 @@ export declare const useSendMessage: (options?: UseSendMessageOptions) => {
|
|
|
42
43
|
}) => Promise<void>;
|
|
43
44
|
resendMessage: (failedMessage: MessageItem) => Promise<void>;
|
|
44
45
|
};
|
|
45
|
-
export declare const generateExtendMessageInfo: ({ richText,
|
|
46
|
+
export declare const generateExtendMessageInfo: ({ richText, urlMetadata, currentSession, }: {
|
|
46
47
|
richText?: string;
|
|
47
|
-
|
|
48
|
+
urlMetadata?: UrlMetadataInfo;
|
|
48
49
|
currentSession?: ISessionResponse;
|
|
49
50
|
}) => ExtendMessageInfo;
|
|
50
51
|
//# sourceMappingURL=useSendMessage.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSendMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useSendMessage.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,WAAW,EAGZ,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,cAAc,CAAC;AAWtB,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAUlC,OAAO,EAAgB,gBAAgB,EAAyB,MAAM,aAAa,CAAC;AAkBpF,eAAO,MAAM,iBAAiB,GAAI,SAAS;IACzC,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;CACrB,YAE0C,CAAC;AAE5C,eAAO,MAAM,iBAAiB,GAAU,MAAM,MAAM,gCAanD,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAU,MAAM,oBAAoB,gCAaxE,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAU,iBAAiB,eAAe,gCAazE,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAU,MAAM,oBAAoB,gCAaxE,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAU,MAAM,mBAAmB,gCAatE,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAU,MAAM,MAAM,EAAE,MAAM,MAAM,EAAE,gCActE,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,MAAM,MAAM,EACZ,eAAe,WAAW,gCAc3B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAC9B,4BAA4B,GAC5B,wCAAwC,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;IACzC,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,eAAe,CAAC;CACxE;AAED,eAAO,MAAM,cAAc,GAAI,UAAU,qBAAqB;
|
|
1
|
+
{"version":3,"file":"useSendMessage.d.ts","sourceRoot":"","sources":["../../../src/hooks/message/useSendMessage.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,WAAW,EAGZ,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,oBAAoB,EACrB,MAAM,cAAc,CAAC;AAWtB,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAUlC,OAAO,EAAgB,gBAAgB,EAAyB,MAAM,aAAa,CAAC;AAkBpF,eAAO,MAAM,iBAAiB,GAAI,SAAS;IACzC,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;CACrB,YAE0C,CAAC;AAE5C,eAAO,MAAM,iBAAiB,GAAU,MAAM,MAAM,gCAanD,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAU,MAAM,oBAAoB,gCAaxE,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAU,iBAAiB,eAAe,gCAazE,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAU,MAAM,oBAAoB,gCAaxE,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAU,MAAM,mBAAmB,gCAatE,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAU,MAAM,MAAM,EAAE,MAAM,MAAM,EAAE,gCActE,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,MAAM,MAAM,EACZ,eAAe,WAAW,gCAc3B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAC9B,4BAA4B,GAC5B,wCAAwC,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;IACzC,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,eAAe,CAAC;CACxE;AAED,eAAO,MAAM,cAAc,GAAI,UAAU,qBAAqB;yFAgPvD;QACD,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;QACjB,cAAc,CAAC,EAAE,gBAAgB,CAAC;QAClC,UAAU,EAAE,OAAO,CAAC;QACpB,WAAW,CAAC,EAAE,eAAe,CAAC;KAC/B,KAAG,OAAO,CAAC,OAAO,CAAC;oFA6CjB;QACD,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,UAAU,EAAE,CAAC;QACpB,cAAc,CAAC,EAAE,gBAAgB,CAAC;QAClC,UAAU,EAAE,OAAO,CAAC;KACrB;mCAvKqB,WAAW;CA0UpC,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,4CAIvC;IACD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,cAAc,CAAC,EAAE,gBAAgB,CAAC;CACnC,sBAuBA,CAAC"}
|