diff --git a/packages/react-chat/src/components/Chat/ChatBody.tsx b/packages/react-chat/src/components/Chat/ChatBody.tsx
index 9e354c15..f5247c2a 100644
--- a/packages/react-chat/src/components/Chat/ChatBody.tsx
+++ b/packages/react-chat/src/components/Chat/ChatBody.tsx
@@ -115,6 +115,7 @@ export function ChatBody({
                 messenger ? (
                   <ChatMessages
                     messages={messages}
+                    loadNextDay={loadNextDay}
                     fetchMetadata={fetchMetadata}
                   />
                 ) : (
diff --git a/packages/react-chat/src/components/Chat/ChatMessages.tsx b/packages/react-chat/src/components/Chat/ChatMessages.tsx
index f98daff9..5be98dba 100644
--- a/packages/react-chat/src/components/Chat/ChatMessages.tsx
+++ b/packages/react-chat/src/components/Chat/ChatMessages.tsx
@@ -10,11 +10,16 @@ import { ChatMessageContent } from "./ChatMessageContent";
 
 type ChatMessagesProps = {
   messages: ChatMessage[];
+  loadNextDay: () => void;
   fetchMetadata?: (url: string) => Promise<Metadata | undefined>;
 };
 
-export function ChatMessages({ messages, fetchMetadata }: ChatMessagesProps) {
-  const [scrollOnBot, setScrollOnBot] = useState(false);
+export function ChatMessages({
+  messages,
+  loadNextDay,
+  fetchMetadata,
+}: ChatMessagesProps) {
+  const [scrollOnBot, setScrollOnBot] = useState(true);
   const ref = useRef<HTMLHeadingElement>(null);
   const today = useMemo(() => new Date().getDay(), []);
   useEffect(() => {
@@ -26,6 +31,9 @@ export function ChatMessages({ messages, fetchMetadata }: ChatMessagesProps) {
   useEffect(() => {
     const setScroll = () => {
       if (ref && ref.current) {
+        if (ref.current.scrollTop <= 0) {
+          loadNextDay();
+        }
         if (
           ref.current.scrollTop + ref.current.clientHeight ==
           ref.current.scrollHeight