GithubProxy/ChatGPT-Next-Web
1
0
Fork 1
mirror of https://github.com/ChatGPTNextWeb/ChatGPT-Next-Web.git synced 2025-05-19 12:10:17 +09:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5821 from Sherlocksuper/scroll

Browse Source 
feat: support more user-friendly scrolling
This commit is contained in:
Dogtiti 2024-11-16 15:24:46 +08:00 committed by GitHub
commit a2adfbbd32
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/components/chat.tsx
View File

@ -960,9 +960,24 @@ function _Chat() {
(scrollRef.current.scrollTop + scrollRef.current.clientHeight), (scrollRef.current.scrollTop + scrollRef.current.clientHeight),
) <= 1 ) <= 1
: false; : false;
const isAttachWithTop = useMemo(() => {
const lastMessage = scrollRef.current?.lastElementChild as HTMLElement;
// if scrolllRef is not ready or no message, return false
if (!scrollRef?.current || !lastMessage) return false;
const topDistance =
lastMessage!.getBoundingClientRect().top -
scrollRef.current.getBoundingClientRect().top;
// leave some space for user question
return topDistance < 100;
}, [scrollRef?.current?.scrollHeight]);
const isTyping = userInput !== "";
// if user is typing, should auto scroll to bottom
// if user is not typing, should auto scroll to bottom only if already at bottom
const { setAutoScroll, scrollDomToBottom } = useScrollToBottom( const { setAutoScroll, scrollDomToBottom } = useScrollToBottom(
scrollRef, scrollRef,
isScrolledToBottom, (isScrolledToBottom || isAttachWithTop) && !isTyping,
); );
const [hitBottom, setHitBottom] = useState(true); const [hitBottom, setHitBottom] = useState(true);
const isMobileScreen = useMobileScreen(); const isMobileScreen = useMobileScreen();