This is beta documentation for Stream Chat React Native SDK v9. For the latest stable version, see the latest version (v8) .

PaginatedMessageListContext

PaginatedMessageListContext is provided by Channel. If you are not familiar with the React Context API, see the React docs.

Best Practices

  • Use usePaginatedMessageListContext for consistent access and typings.
  • Check hasMore before triggering pagination.
  • Use loadingMore flags to prevent duplicate loads.
  • Avoid manual message array mutations; rely on context updates.
  • Keep pagination handlers lightweight to preserve scroll performance.

Basic Usage

Consume PaginatedMessageListContext in any child of Channel:

import { useContext } from "react";
import { PaginatedMessageListContext } from "stream-chat-react-native";

const { loadingMore, loadMoreRecent, messages } = useContext(
  PaginatedMessageListContext,
);

Alternatively, use the usePaginatedMessageListContext hook.

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

const { loadingMore, loadMoreRecent, messages } =
  usePaginatedMessageListContext();

Value

hasMore

False if Channel has loaded all history via pagination. Used to decide whether to load more when the user reaches the top of MessageList.

Type
boolean

loadingMore

True while Channel is querying older messages. Used to show/hide the inline loading indicator at the top of MessageList.

Type
boolean

loadingMoreRecent

True while Channel is querying newer messages. Used to show/hide the inline loading indicator at the bottom of MessageList.

Type
boolean

loadLatestMessages

Loads the latest messages in the channel, jumping to the most recent state.

Type
() => Promise<void>

loadMore

Loads more messages before the top message. Called from the underlying FlatList onScroll when the user reaches the top and hasMore is true.

Type
(limit?: number) => Promise<void>

loadMoreRecent

Loads more recent messages. Called from the underlying FlatList onScroll when the user reaches the relevant edge.

Type
(limit?: number) => Promise<void>

messages

Messages currently loaded in the channel.

Type
ChannelState['messages']

setLoadingMore

Setter for loadingMore.

Type
(loadingMore: boolean) => void

setLoadingMoreRecent

Setter for loadingMoreRecent.

Type
(loadingMoreRecent: boolean) => void

viewabilityChangedCallback

A callback to be passed to onViewableItemsChanged in the underlying MessageList. Used internally to track which messages are visible.

Type
(config: ViewabilityChangedCallbackInput) => void