# 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 the `Channel` prop instead of modifying internal components.

## General Usage

Replace the default UI via the `ScrollToBottomButton` prop on [Channel](/chat/docs/sdk/react-native/v8/core-components/channel/).

```tsx
<Channel ScrollToBottomButton={CustomScrollToBottomButton} />
```

## Props

### `onPress`

Press handler.

| Type     |
| -------- |
| Function |

### `showNotification`

When `false`, the button is not rendered.

| Type    |
| ------- |
| Boolean |

### `unreadCount`

Unread count for the current channel.

| Type   |
| ------ |
| Number |


---

This page was last updated at 2026-04-21T07:55:41.286Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/v8/ui-components/scroll-to-bottom-button/](https://getstream.io/chat/docs/sdk/react-native/v8/ui-components/scroll-to-bottom-button/).