Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-20 02:10:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

⏬ feat: Optimize Scroll Handling with Intersection Observer (#3564)

Browse source 
* ⏬ refactor(ScrollToBottom): use Intersection Observer for efficient scroll handling

* chore: imports, remove debug console
This commit is contained in:
Danny Avila 2024-08-06 16:18:15 -04:00 • committed by GitHub
parent 6879de0bf1
commit c2a79aee1b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 54 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

18
client/src/hooks/useScrollToRef.ts
View file

@ -7,7 +7,21 @@ type TUseScrollToRef = {
smoothCallback: () => void;
};
export default function useScrollToRef({ targetRef, callback, smoothCallback }: TUseScrollToRef) {
type ThrottledFunction = (() => void) & {
cancel: () => void;
flush: () => void;
};
type ScrollToRefReturn = {
scrollToRef?: ThrottledFunction;
handleSmoothToRef: React.MouseEventHandler<HTMLButtonElement>;
};
export default function useScrollToRef({
targetRef,
callback,
smoothCallback,
}: TUseScrollToRef): ScrollToRefReturn {
const logAndScroll = (behavior: 'instant' | 'smooth', callbackFn: () => void) => {
// Debugging:
// console.log(`Scrolling with behavior: ${behavior}, Time: ${new Date().toISOString()}`);
@ -17,7 +31,7 @@ export default function useScrollToRef({ targetRef, callback, smoothCallback }:
// eslint-disable-next-line react-hooks/exhaustive-deps
const scrollToRef = useCallback(
throttle(() => logAndScroll('instant', callback), 250, { leading: true }),
throttle(() => logAndScroll('instant', callback), 145, { leading: true }),
[targetRef],
);