Merge pull request #403 from ARYPROGRAMMER/feature/improve-chat-scroll-feedback

Improve chat scroll UX with immediate loading feedback

Author: sutigit

src/client/components/ChatV2/ChatV2.tsx

@@ -192,7 +192,12 @@ const ChatV2Content = () => {
     }, 5000)
 
     setIsStreaming(true)
-    chatScroll.beginAutoscroll()
+    
+    // Scroll immediately to show loading dots for better UX feedback
+    // Small delay ensures React has rendered the loading message
+    setTimeout(() => {
+      chatScroll.beginAutoscroll()
+    }, 10)
 
     const generationInfo: MessageGenerationInfo = {
       model: acualModel,

src/client/components/ChatV2/useChatScroll.ts

@@ -38,10 +38,18 @@ export const useChatScroll = () => {
     startTransition(() => {
       isUserDisabled = false
       setIsAutoScrolling(true)
+      // Immediate scroll to show loading dots right away for better UX
       window.scrollTo({
         top: document.body.scrollHeight,
-        behavior: 'smooth',
+        behavior: 'instant',
       })
+      // Follow up with smooth scroll after a brief delay to maintain smooth UX
+      setTimeout(() => {
+        window.scrollTo({
+          top: document.body.scrollHeight,
+          behavior: 'smooth',
+        })
+      }, 50)
     })
   }