| import { useEffect, useRef } from "react"; | |
| export const useScrollToBottom = () => { | |
| const scrollRef = useRef<HTMLDivElement>(null); | |
| const scrollToBottom = () => { | |
| if (scrollRef.current) { | |
| // Get the actual scrollable container | |
| const scrollContainer = scrollRef.current.querySelector( | |
| "[data-radix-scroll-area-viewport]" | |
| ); | |
| if (scrollContainer) { | |
| const targetPosition = scrollContainer.scrollHeight; | |
| scrollContainer.scrollTo({ | |
| top: targetPosition, | |
| behavior: "smooth", | |
| }); | |
| } | |
| } | |
| }; | |
| return { scrollRef, scrollToBottom }; | |
| }; | |