fix: scroll to bottom when loading existing conversations

[nmgarza5]

Description

Updates ChatScrollContainer scroll behavior when loading existing conversations:

• Old conversations now scroll to the bottom instead of positioning an anchor at the top of the viewport
• This behavior is consistent regardless of the autoScroll setting
• Integrates changes from PR chore(fe): blurred message container fills vertically #7598: adds h-full to MessageList wrapper so it fills the container vertically
• Removes ~60 lines of dead code (spacerHeight state, calcSpacerHeight function) that became unused after the spacer div no longer has a height

How Has This Been Tested?

2026-01-20.18.56.45.mp4

Additional Options

• [Optional] Override Linear Check

[cubic-dev-ai]

No issues found across 2 files

[greptile-apps]

Greptile Summary

This PR improves scroll behavior when loading existing conversations by making them scroll to the bottom instead of positioning at an anchor element. It also removes approximately 60 lines of dead code related to spacer height calculations that became unused after removing the spacer div.

Key changes:

• Existing conversations now scroll to bottom on load, regardless of autoScroll setting
• New anchor changes during active conversation still scroll to the anchor position
• Dead code removed: spacerHeight state, calcSpacerHeight function, spacer div rendering, and related logic
• Added h-full to MessageList wrapper to ensure blur effect fills container vertically
• Removed unused SCROLL_DEBOUNCE_MS constant

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes are well-structured and logical: removes genuinely dead code (~60 lines of unused spacer logic), improves UX by scrolling existing conversations to bottom, and adds a simple CSS class for proper blur effect. The logic correctly distinguishes between loading existing content (scroll to bottom) vs anchor changes during active sessions (scroll to anchor). No security concerns, follows web standards, and improves code maintainability.
• No files require special attention

Important Files Changed

Filename	Overview
web/src/components/chat/ChatScrollContainer.tsx	Removes dead spacer code and changes existing conversations to scroll to bottom instead of anchor positioning
web/src/components/chat/MessageList.tsx	Adds h-full to make container fill vertically for proper blur effect coverage

Sequence Diagram

sequenceDiagram
    participant User
    participant ChatPage
    participant ChatScrollContainer
    participant MessageList
    
    Note over User,MessageList: Loading Existing Conversation
    User->>ChatPage: Open existing conversation
    ChatPage->>ChatScrollContainer: Render with anchorSelector, sessionId
    ChatScrollContainer->>ChatScrollContainer: Detect isLoadingExistingContent=true
    ChatScrollContainer->>ChatScrollContainer: Calculate targetScrollTop = scrollHeight - clientHeight
    ChatScrollContainer->>ChatScrollContainer: scrollTo(bottom, "instant")
    ChatScrollContainer->>ChatScrollContainer: Set isAtBottomRef = true
    ChatScrollContainer->>MessageList: Render messages with h-full
    MessageList-->>ChatScrollContainer: Content rendered
    ChatScrollContainer->>User: Display conversation at bottom
    
    Note over User,MessageList: New Message Streaming (autoScroll=true)
    User->>ChatPage: Send new message
    ChatPage->>MessageList: Stream new content
    MessageList->>ChatScrollContainer: MutationObserver detects change
    ChatScrollContainer->>ChatScrollContainer: Check wasAtBottom && autoScroll
    ChatScrollContainer->>ChatScrollContainer: scrollToBottom("instant")
    ChatScrollContainer->>User: Auto-scroll to new content
    
    Note over User,MessageList: Anchor Change During Active Session
    User->>ChatPage: Navigate to different message
    ChatPage->>ChatScrollContainer: Update anchorSelector (isLoadingExistingContent=false)
    ChatScrollContainer->>ChatScrollContainer: Calculate targetScrollTop = anchor.offsetTop
    ChatScrollContainer->>ChatScrollContainer: scrollTo(anchor, "smooth")
    ChatScrollContainer->>User: Smooth scroll to anchor position

Loading

[jmelahman]

diff looking like the NASDAQ 😍