feat: 普通列表发送消息后滚动到底部

web/src/components/ChatBox/ChatMessageList/NormalList.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useRef } from 'react';
-import { useUpdateRef } from 'tailchat-shared';
+import { sharedEvent, useUpdateRef } from 'tailchat-shared';
 import { buildMessageItemRow } from './Item';
 import type { MessageListProps } from './types';
 
@@ -24,6 +24,19 @@ export const NormalMessageList: React.FC<MessageListProps> = React.memo(
       }
     }, [props.messages.length]);
 
+    useEffect(() => {
+      const onSendMessage = () => {
+        // 滚动到底部
+        containerRef.current?.scrollTo({ top: 0, behavior: 'smooth' });
+      };
+
+      sharedEvent.on('sendMessage', onSendMessage);
+
+      return () => {
+        sharedEvent.off('sendMessage', onSendMessage);
+      };
+    }, []);
+
     const handleScroll = useCallback(() => {
       if (props.messages.length === 0) {
         return;

web/src/components/ChatBox/index.tsx

@@ -1,9 +1,10 @@
-import React from 'react';
+import React, { useRef } from 'react';
 import { ChatBoxContextProvider, useConverseMessage } from 'tailchat-shared';
 import { AlertErrorView } from '../AlertErrorView';
 import { ChatBoxPlaceholder } from './ChatBoxPlaceholder';
 import { ChatInputBox } from './ChatInputBox';
 import { ChatMessageList } from './ChatMessageList';
+import type { MessageListRef } from './ChatMessageList/types';
 import { ChatReply } from './ChatReply';
 import { useMessageAck } from './useMessageAck';