File size: 3,495 Bytes
18da36c 79f4fcc aa396c5 2eeb8b1 8e222fd ae21b62 6a6f6eb 8e222fd e55650e 18da36c 8e222fd cb33b9e 8e222fd 2eeb8b1 598945f 18da36c 058cd84 452020d 414b2e9 7043f18 cb33b9e 414b2e9 e55650e cb33b9e ae21b62 e55650e 985fa34 8e222fd 84f80c5 598945f 452020d ae21b62 84f80c5 cb33b9e 84f80c5 cb33b9e 84f80c5 18da36c cb33b9e 84f80c5 ae21b62 2eeb8b1 ae21b62 88e5a61 ae21b62 e55650e ae21b62 e55650e 985fa34 e55650e 88e5a61 ae21b62 2eeb8b1 058cd84 ae21b62 452020d |
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 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 |
import MessageItem from '@/components/message-item';
import DocumentPreviewer from '@/components/pdf-previewer';
import { MessageType } from '@/constants/chat';
import { Drawer, Flex, Spin } from 'antd';
import {
useClickDrawer,
useFetchConversationOnMount,
useGetFileIcon,
useGetSendButtonDisabled,
useSelectConversationLoading,
useSendButtonDisabled,
useSendMessage,
} from '../hooks';
import { buildMessageItemReference } from '../utils';
import MessageInput from '@/components/message-input';
import { useFetchUserInfo } from '@/hooks/user-setting-hooks';
import styles from './index.less';
const ChatContainer = () => {
const {
ref,
currentConversation: conversation,
addNewestConversation,
removeLatestMessage,
addNewestAnswer,
} = useFetchConversationOnMount();
const {
handleInputChange,
handlePressEnter,
value,
loading: sendLoading,
} = useSendMessage(
conversation,
addNewestConversation,
removeLatestMessage,
addNewestAnswer,
);
const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
useClickDrawer();
const disabled = useGetSendButtonDisabled();
const sendDisabled = useSendButtonDisabled(value);
useGetFileIcon();
const loading = useSelectConversationLoading();
const { data: userInfo } = useFetchUserInfo();
return (
<>
<Flex flex={1} className={styles.chatContainer} vertical>
<Flex flex={1} vertical className={styles.messageContainer}>
<div>
<Spin spinning={loading}>
{conversation?.message?.map((message, i) => {
return (
<MessageItem
loading={
message.role === MessageType.Assistant &&
sendLoading &&
conversation?.message.length - 1 === i
}
key={message.id}
item={message}
nickname={userInfo.nickname}
avatar={userInfo.avatar}
reference={buildMessageItemReference(conversation, message)}
clickDocumentButton={clickDocumentButton}
></MessageItem>
);
})}
</Spin>
</div>
<div ref={ref} />
</Flex>
<MessageInput
disabled={disabled}
sendDisabled={sendDisabled}
sendLoading={sendLoading}
value={value}
onInputChange={handleInputChange}
onPressEnter={handlePressEnter}
conversationId={conversation.id}
></MessageInput>
{/* <Input
size="large"
placeholder={t('sendPlaceholder')}
value={value}
disabled={disabled}
suffix={
<Button
type="primary"
onClick={handlePressEnter}
loading={sendLoading}
disabled={sendDisabled}
>
{t('send')}
</Button>
}
onPressEnter={handlePressEnter}
onChange={handleInputChange}
/> */}
</Flex>
<Drawer
title="Document Previewer"
onClose={hideModal}
open={visible}
width={'50vw'}
>
<DocumentPreviewer
documentId={documentId}
chunk={selectedChunk}
visible={visible}
></DocumentPreviewer>
</Drawer>
</>
);
};
export default ChatContainer;
|