File size: 1,028 Bytes
246d201 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
import { RefObject, useEffect, useState } from "react";
export function useScrollToBottom(scrollRef: RefObject<HTMLDivElement | null>) {
// for auto-scroll
const [autoScroll, setAutoScroll] = useState(true);
const [hitBottom, setHitBottom] = useState(true);
const onChatBodyScroll = (e: HTMLElement) => {
const bottomHeight = e.scrollTop + e.clientHeight;
const isHitBottom = bottomHeight >= e.scrollHeight - 10;
setHitBottom(isHitBottom);
setAutoScroll(isHitBottom);
};
function scrollDomToBottom() {
const dom = scrollRef.current;
if (dom) {
requestAnimationFrame(() => {
setAutoScroll(true);
dom.scrollTo({ top: dom.scrollHeight, behavior: "auto" });
});
}
}
// auto scroll
useEffect(() => {
if (autoScroll) {
scrollDomToBottom();
}
});
return {
scrollRef,
autoScroll,
setAutoScroll,
scrollDomToBottom,
hitBottom,
setHitBottom,
onChatBodyScroll,
};
}
|