File size: 2,819 Bytes
8207a08 68ed806 fa5e9f6 8207a08 fa5e9f6 8207a08 8a4bb0c 8441328 fa5e9f6 598945f 8207a08 8a4bb0c 8207a08 8a4bb0c 8207a08 598945f 8207a08 8a4bb0c 8207a08 8a4bb0c 8207a08 18da36c 8207a08 8441328 8a4bb0c 8441328 8207a08 18a496b 0086f8a 8a4bb0c 8207a08 fa5e9f6 8207a08 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
import MessageItem from '@/components/message-item';
import { MessageType } from '@/constants/chat';
import { useTranslate } from '@/hooks/common-hooks';
import { useGetFileIcon } from '@/pages/chat/hooks';
import { buildMessageItemReference } from '@/pages/chat/utils';
import { Button, Flex, Input, Spin } from 'antd';
import { useSendNextMessage } from './hooks';
import PdfDrawer from '@/components/pdf-drawer';
import { useClickDrawer } from '@/components/pdf-drawer/hooks';
import { useFetchUserInfo } from '@/hooks/user-setting-hooks';
import styles from './index.less';
const FlowChatBox = () => {
const {
sendLoading,
handleInputChange,
handlePressEnter,
value,
loading,
ref,
derivedMessages,
reference,
} = useSendNextMessage();
const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
useClickDrawer();
useGetFileIcon();
const { t } = useTranslate('chat');
const { data: userInfo } = useFetchUserInfo();
return (
<>
<Flex flex={1} className={styles.chatContainer} vertical>
<Flex flex={1} vertical className={styles.messageContainer}>
<div>
<Spin spinning={loading}>
{derivedMessages?.map((message, i) => {
return (
<MessageItem
loading={
message.role === MessageType.Assistant &&
sendLoading &&
derivedMessages.length - 1 === i
}
key={message.id}
nickname={userInfo.nickname}
avatar={userInfo.avatar}
item={message}
reference={buildMessageItemReference(
{ message: derivedMessages, reference },
message,
)}
clickDocumentButton={clickDocumentButton}
index={i}
showLikeButton={false}
sendLoading={sendLoading}
></MessageItem>
);
})}
</Spin>
</div>
<div ref={ref} />
</Flex>
<Input
size="large"
placeholder={t('sendPlaceholder')}
value={value}
suffix={
<Button
type="primary"
onClick={handlePressEnter}
loading={sendLoading}
>
{t('send')}
</Button>
}
onPressEnter={handlePressEnter}
onChange={handleInputChange}
/>
</Flex>
<PdfDrawer
visible={visible}
hideModal={hideModal}
documentId={documentId}
chunk={selectedChunk}
></PdfDrawer>
</>
);
};
export default FlowChatBox;
|