RecentRunner/group-2-threaded-project-petshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix chat scroll behaviour

Browse Source
This commit is contained in:
Harkamal Randhawa
2026-04-16 00:25:32 -06:00
parent 3c4ec5b11e
commit eb7d144b91
2 changed files with 6 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/app/ai-chat/page.js
View File

@@ -111,14 +111,9 @@ function AiChatPage() {
lastScrolledIdRef.current = lastMsg.id; lastScrolledIdRef.current = lastMsg.id;
const area = messagesAreaRef.current; const area = messagesAreaRef.current;
if (!area) return; if (!area) return;
const isOwn = lastMsg.senderId === user?.id; const nearBottom = area.scrollHeight - area.scrollTop - area.clientHeight < 150;
if (isOwn) { if (nearBottom) messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
messagesEndRef.current?.scrollIntoView({ behavior: "smooth" }); }, [messages]);
} else {
const nearBottom = area.scrollHeight - area.scrollTop - area.clientHeight < 150;
if (nearBottom) messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
}
}, [messages, user?.id]);
useEffect(() => { useEffect(() => {
if (!botTyping) return; if (!botTyping) return;

11
web/app/chat/page.js
View File

@@ -109,14 +109,9 @@ function ChatPage() {
lastScrolledIdRef.current = lastMsg.id; lastScrolledIdRef.current = lastMsg.id;
const area = messagesAreaRef.current; const area = messagesAreaRef.current;
if (!area) return; if (!area) return;
const isOwn = lastMsg.senderId === user?.id; const nearBottom = area.scrollHeight - area.scrollTop - area.clientHeight < 150;
if (isOwn) { if (nearBottom) area.scrollTop = area.scrollHeight;
area.scrollTop = area.scrollHeight; }, [messages]);
} else {
const nearBottom = area.scrollHeight - area.scrollTop - area.clientHeight < 80;
if (nearBottom) area.scrollTop = area.scrollHeight;
}
}, [messages, user?.id]);
const fetchMessages = useCallback(async (convId) => { const fetchMessages = useCallback(async (convId) => {
if (!token || !convId) return; if (!token || !convId) return;