# ChannelListMessenger

Component to render list of channels, within the [`ChannelList`](https://getstream.io/chat/docs/sdk/react-native/v3/core-components/channel-list/) component.
This is the default component provided to the prop [`List`](https://getstream.io/chat/docs/sdk/react-native/v3/core-components/channel-list#list) on the `ChannelList` component.

## Props

### additionalFlatListProps

Additional props provided to the underlying [FlatList](https://reactnative.dev/docs/flatlist#props).

#### Example

```tsx
const flatListProps = { bounces: true };

<ChannelList additionalFlatListProps={flatListProps} />;
```

<Admonition type="warning">

Don't use `additionalFlatListProps` to access the FlatList ref, use `setFlatListRef` instead.

</Admonition>

| Type   |
| ------ |
| object |

### channels

Array of channels currently loaded within the `ChannelList` component.

| Type  |
| ----- |
| array |

### error

True if a call to [query channels API call](https://getstream.io/chat/docs/javascript/query-channels/) within `ChannelList` component results in error, either during first load or during pagination.

| Type    |
| ------- |
| boolean |

### `loadingChannels`

True if `ChannelList` component is loading the first page of channels.

| Type    |
| ------- |
| boolean |

### loadingNextPage

True if `ChannelList` component is loading more channels as part of pagination. This will be set to true when user scrolls to bottom of the list and [`hasNextPage`](https://getstream.io/chat/docs/sdk/react-native/v3/contexts/channels-context#hasnextpage) is true.

| Type    |
| ------- |
| boolean |

### loadMoreThreshold

Sets the [`onEndReachedThreshold`](https://reactnative.dev/docs/flatlist#onendreachedthreshold) of the underlying FlatList.

| Type   | Default |
| ------ | ------- |
| number | 2       |

### loadNextPage

Function to load next page for the `ChannelList` component.

| Type     |
| -------- |
| function |

### refreshing

True if `ChannelList` component is refreshing the list (using [`refreshList`](#refreshlist) function call). Refreshing state will be triggered either when user executes pull-to-refresh gesture or if network connection is being recovered.
This value is attached to [refreshing](https://reactnative.dev/docs/flatlist#refreshing) prop of underlying `FlatList` component of `ChannelList`.

| Type    |
| ------- |
| boolean |

### `refreshList`

Function to manually re-sync or refresh the channels in `ChannelList` component.

<Admonition type="note">

Calling `refreshList` will trigger a [RefreshControl](https://reactnative.dev/docs/refreshcontrol) on underlying FlatList component.

</Admonition>

| Type     |
| -------- |
| function |

### `reloadList`

Function to manually reload the channels in `ChannelList` component.

<Admonition type="note">

Calling `reloadList` will wipe out the existing list of channels and show a loading indicator until new results are ready.

</Admonition>

| Type     |
| -------- |
| function |

### setFlatListRef

Callback function to access the underlying [FlatList](https://reactnative.dev/docs/flatlist) ref.

#### Example

```tsx
const flatListRef = useRef();

<ChannelList setFlatListRef={(ref) => (flatListRef.current = ref)} />;
```

| Type     |
| -------- |
| function |

| Parameter | Description  |
| --------- | ------------ |
| ref       | FlatList ref |

### EmptyStateIndicator

Rendered when the channel list is empty and not loading via the [ListEmptyComponent](https://reactnative.dev/docs/flatlist#listemptycomponent) prop on the FlatList.

| Type      | Default                                                                                                                                          |
| --------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| component | [EmptyStateIndicator](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Indicators/EmptyStateIndicator.tsx) |

### FooterLoadingIndicator

Rendered when [`loadingNextPage` from `ChannelsContext`](https://getstream.io/chat/docs/sdk/react-native/v3/contexts/channels-context#loadingnextpage) is true via the [`ListFooterComponent`](https://reactnative.dev/docs/flatlist#listfootercomponent) prop on the FlatList.

| Type      | Default                                                                                                                                                                       |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| component | [ChannelListFooterLoadingIndicator](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/ChannelList/ChannelListFooterLoadingIndicator.tsx) |

### ListHeaderComponent

Rendered when provided if the channel list is not empty via the [`ListHeaderComponent`](https://reactnative.dev/docs/flatlist#listheadercomponent) prop on the FlatList.

| Type      |
| --------- |
| component |

### LoadingErrorIndicator

Rendered when [`error` from `ChannelsContext`](https://getstream.io/chat/docs/sdk/react-native/v3/contexts/channels-context#error) is true, and the channel list is empty and not loading.

| Type      | Default                                                                                                                                              |
| --------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
| component | [LoadingErrorIndicator](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Indicators/LoadingErrorIndicator.tsx) |

### LoadingIndicator

Rendered when the channel list is empty and loading via the [ListEmptyComponent](https://reactnative.dev/docs/flatlist#listemptycomponent) prop on the FlatList.

| Type      | Default                                                                                                                                                           |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| component | [ChannelListLoadingIndicator](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/ChannelList/ChannelListLoadingIndicator.tsx) |


---

This page was last updated at 2026-08-19T08:17:01.695Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/v3/ui-components/channel-list-messenger/](https://getstream.io/chat/docs/sdk/react-native/v3/ui-components/channel-list-messenger/).