Skip to main content

MessageList Hooks

The MessageList and VirtualizedMessageList components use a variety of custom hooks to assemble a scrollable list of Message components, with all of the necessary data and handlers provided to each. These hooks can be useful when building a custom list component.

useCallLoadMore#

A custom hook that returns a memoized callback of the loadMore function that only changes if the limit paramter changes. This returned value is then added to the props object given to the InfiniteScroll component.

useEnrichedMessages#

A custom hook that determines which messages need date separators and group css styles, returns the processed array of messages.

useGiphyPreview#

A custom hook that handles state setting logic for the optional GiphyPreviewMessage component in the VirtualizedMessageList.

useLastReadData#

A custom hook that returns a memoized value of read states for each message. Used within the useEnrichedMessages hook.

useMessageListElements#

A custom hook processes each message and returns the html elements needed to render each one, returned as an array. This hook also passes all of the Message component props appropriately.

useMessageListScrollManager#

A custom hook that handles the list scroll logic, returns a handler function that calculates a new scroll top value.

useNewMessageNotification#

A custom hook used in the VirtualizedList component and returns message notification information.

usePrependMessagesCount#

A custom hook used in the VirtualizedList component and returns the number of messages prepended.

useScrollLocationLogic#

A custom hook used to handle the scroll location logic of the list and returns the related data and handlers.

useShouldForceScrollToBottom#

A custom hook used in the VirtualizedList, returns a boolean for whether the list should be forced to scroll to the bottom.

Did you find this page helpful?