fix: scroll to bottom issue

[urmauur]

Describe Your Changes

1. TypeScript Type Annotation: The useRef hook for parentRef is updated from useRef(null) to useRef<HTMLDivElement>(null), providing a type annotation to specify that the ref should point to a HTMLDivElement.

2. New State Addition: A new state currentThread is introduced, which uses the useAtomValue hook to retrieve the value from activeThreadAtom.

3. Refactoring useEffect Hook:

   • The existing useEffect hook is refactored to:
     • Remove the check for isUserManuallyScrollingUp and !parentRef.current.
     • Add a requestAnimationFrame call to delay scrolling until the DOM updates. This ensures smoother behavior when scrolling to the last index of messages.
     • Update the dependencies of the useEffect to include currentThread?.id and remove unused dependencies like messages, loadModelError, and isUserManuallyScrollingUp.

4. Removed Logical Checks: The logical checks within the previous useEffect have been refactored to ensure the scroll actions are executed efficiently in the newly structured useEffect.

Fixes Issues

Screen.Recording.2024-12-18.at.13.20.27.mov

• Closes bug: If I scroll up it keeps autoscrolling so I have to fight with it or wait for it to finish #4253
• Closes #

Self Checklist

• Added relevant comments, esp in complex areas
• Updated docs (for bug fixes / features)
• Created issues for follow-up changes or refactoring needed

[louis-menlo]

LGTM

[github-actions]

This is the build for this pull request. You can download it from the Artifacts section here: Build URL.

[github-actions]

Barecheck - Code coverage report

Total: 69.07%

Your code coverage diff: -0.03% ▾

Uncovered files and lines

File	Lines
web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx	20-21, 23-24, 26, 30-31, 34-35, 37, 39, 43, 60-63, 65-66, 71, 73-74, 78, 80-84, 90, 92, 97-98, 104-105, 107-108, 110-112, 114-115, 119-121, 123, 158

[louis-menlo]

Fixed #4292