ScrollToBottomButton

Renders the floating button that scrolls MessageList to the latest message.

Best Practices

• Only render the button when showNotification is true to avoid layout noise.
• Keep the button lightweight and unobtrusive for better UX.
• Use unreadCount to provide meaningful context, but clamp large values.
• Ensure onPress scrolls to the latest message rather than just bottom offset.
• Customize via WithComponents instead of modifying internal components.

General Usage

Replace the default UI via WithComponents.

import { WithComponents } from "stream-chat-react-native";

<WithComponents
  overrides={{ ScrollToBottomButton: CustomScrollToBottomButton }}
>
  <Channel channel={channel}>
    <MessageList />
    <MessageComposer />
  </Channel>
</WithComponents>;

Props