This is documentation for Stream Chat React SDK v11, which is no longer actively maintained. For up-to-date documentation, see the latest version (v12).

MessageListContext

The context value is provided by MessageListContextProvider which wraps the contents rendered by MessageList. It exposes API that the default and custom components rendered by MessageList can take advantage of. The components that can consume the context are:

Basic Usage

Pull the value from context with our custom hook:

import { useMessageListContext } from 'stream-chat-react';

export const CustomComponent = () => {
  const { listElement, scrollToBottom } = useMessageListContext();
  // component logic ...
  return(
      {/* rendered elements */}
  );
}

Value

listElement

The scroll container within which the messages and typing indicator are rendered. You may want to perform scroll-to-bottom operations based on the listElement’s scroll state.

Type
HTMLDivElement | null

scrollToBottom

Function that scrolls the listElement to the bottom.

Type
() => void
© Getstream.io, Inc. All Rights Reserved.