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 };
};