feat: useChat

This commit is contained in:
李如威 2026-01-05 17:30:48 +08:00
parent 40d4a6384b
commit a2d98c4da8
3 changed files with 16 additions and 10 deletions

View File

@ -49,15 +49,16 @@ export function useChat({ api }: UseChatOptions) {
setLoading(true)
const mokeResult = "你好!有什麼我可以幫你的嗎?聽起來很有趣,請繼續說。我正在思考你的問題,請稍候...這是一個很棒的觀點!哈哈,真的嗎?太神奇了。抱歉,我剛才走神了,你能再說一遍嗎"
const count = random(0, 200)
const count = random(0, 100)
let idx = 0;
while (idx < count) {
const tokenLength = random(2, 5)
console.log(tokenLength);
const startIndex = idx % mokeResult.length
const chunk = mokeResult.slice(startIndex, startIndex + tokenLength);
setMessages(prev =>
prev.map(msg =>
msg.id === assistantId
? { ...msg, content: msg.content + mokeResult.substring(idx % mokeResult.length, tokenLength) }
? { ...msg, content: msg.content + chunk }
: msg
)
)

View File

@ -8,15 +8,18 @@ type ChatListProps = {
}
export function ChatList({ messages }: ChatListProps) {
const bottomRef = useRef<HTMLDivElement>(null)
const bottomRef = useRef<HTMLDivElement>(null);
const listRef = useRef<HTMLDivElement>(null);
useEffect(() => {
bottomRef?.current?.scrollIntoView({ behavior: 'smooth' });
const content = listRef?.current;
if (!content || content.scrollHeight > content.clientHeight) return;
bottomRef?.current?.scrollIntoView({ behavior: 'smooth', block: 'end' });
}, [messages]);
return (
<>
<div className={styles.chatList}>
<div className={styles.chatList} ref={listRef}>
{messages.map(msg => (
<div key={msg.id}>
<ChatItem message={msg} />

View File

@ -31,9 +31,11 @@ export default () => {
style: footerStyle,
renderContent: (_, dom) => dom.props.children[1],
}}
footer={[<div key='submit' className={styles.chatPageFooter}>
<InputBar onSubmit={onSubmit}/>
</div>]}
footer={[
<div key='submit' className={styles.chatPageFooter}>
<InputBar onSubmit={onSubmit} />
</div>
]}
title={<HeaderModelSelect value={model} onChange={val => setModel(val)} />}
>
<Flex vertical align='center'>