From 1677cb7321d919d6776018440ca6a039b81be537 Mon Sep 17 00:00:00 2001
From: Phantom <59059173+EurFelux@users.noreply.github.com>
Date: Thu, 24 Jul 2025 00:23:53 +0800
Subject: [PATCH] fix(messages): Scroll position (#8360)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat(消息上下文): 添加消息滚动上下文以保持滚动位置

添加MessagesContext来管理消息列表的滚动位置
在MessageEditor中调整文本区域大小时保持滚动位置

* fix(消息滚动): 修复发送新消息不跟随滚动的问题

* refactor(Messages): 移除不必要的消息完成时的自动滚动逻辑

* refactor(MessageEditor): 移除调试日志语句

* fix(Messages): 避免直接操作dom

* fix(MessageEditor): 修复文本区域自动滚动和焦点问题

确保编辑器挂载时自动滚动到光标位置
将焦点设置和滚动逻辑分离到单独的useEffect中，确保仅在组件挂载时执行一次

* fix(Messages): 移除冗余的日志记录并添加注释

移除在滚动事件处理中的日志记录
添加注释说明为何不使用平滑滚动

* refactor(messages): 移除MessagesContext和相关逻辑

* refactor(Messages): 移除冗余的scrollTo函数并内联滚动逻辑

简化滚动到底部的实现，直接使用requestAnimationFrame内联处理
---
 .../src/pages/home/Messages/MessageEditor.tsx         | 11 +++++++++++
 src/renderer/src/pages/home/Messages/Messages.tsx     |  5 ++---
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/renderer/src/pages/home/Messages/MessageEditor.tsx b/src/renderer/src/pages/home/Messages/MessageEditor.tsx
index 99f38b8268..a6c105fa7c 100644
--- a/src/renderer/src/pages/home/Messages/MessageEditor.tsx
+++ b/src/renderer/src/pages/home/Messages/MessageEditor.tsx
@@ -104,6 +104,17 @@ const MessageBlockEditor: FC<Props> = ({ message, topicId, onSave, onResend, onC
     }, 0)
   }, [])
 
+  // 仅在打开时执行一次
+  useEffect(() => {
+    if (textareaRef.current) {
+      const realTextarea = textareaRef.current.resizableTextArea?.textArea
+      if (realTextarea) {
+        realTextarea.scrollTo({ top: realTextarea.scrollHeight })
+      }
+      textareaRef.current.focus({ cursor: 'end' })
+    }
+  }, [])
+
   const onPaste = useCallback(
     async (event: ClipboardEvent) => {
       return await PasteService.handlePaste(
diff --git a/src/renderer/src/pages/home/Messages/Messages.tsx b/src/renderer/src/pages/home/Messages/Messages.tsx
index 8e0532d7ae..2ecbbda948 100644
--- a/src/renderer/src/pages/home/Messages/Messages.tsx
+++ b/src/renderer/src/pages/home/Messages/Messages.tsx
@@ -90,13 +90,12 @@ const Messages: React.FC<MessagesProps> = ({ assistant, topic, setActiveTopic, o
     setHasMore(messages.length > displayCount)
   }, [messages, displayCount])
 
+  // NOTE: 如果设置为平滑滚动会导致滚动条无法跟随生成的新消息保持在底部位置
   const scrollToBottom = useCallback(() => {
     if (scrollContainerRef.current) {
       requestAnimationFrame(() => {
         if (scrollContainerRef.current) {
-          scrollContainerRef.current.scrollTo({
-            top: scrollContainerRef.current.scrollHeight
-          })
+          scrollContainerRef.current.scrollTo({ top: 0 })
         }
       })
     }