const flatListProps = { bounces: true }; <ChannelList additionalFlatListProps={flatListProps} />;ChannelListMessenger
Component to render list of channels, within the ChannelList component. This is the default component provided to the prop List on the ChannelList component.
Props
additionalFlatListProps
Additional props provided to the underlying FlatList.
Example
Don’t use additionalFlatListProps to access the FlatList ref, use setFlatListRef instead.
| Type |
|---|
| Object |
channels
Array of channels currently loaded within the ChannelList component.
| Type |
|---|
| Array |
error
True if a call to query channels API call within ChannelList component results in error, either during first load or during pagination.
| Type |
|---|
Error Object | 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 is true.
| Type |
|---|
| Boolean |
loadMoreThreshold
Sets the onEndReachedThreshold of the underlying FlatList. We recommend using 0.1 as the default value for this prop, as changing it might hit additional channelQuery calls, and you might reach the limit.
| Type | Default |
|---|---|
| Number | 0.1 |
loadNextPage
Function to load next page for the ChannelList component.
| Type |
|---|
| Function |
refreshing
True if ChannelList component is refreshing the list (using 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 prop of underlying FlatList component of ChannelList.
| Type |
|---|
| Boolean |
refreshList
Function to manually re-sync or refresh the channels in ChannelList component.
Calling refreshList will trigger a RefreshControl on underlying FlatList component.
| Type |
|---|
| Function |
reloadList
Function to manually reload the channels in ChannelList component.
Calling reloadList will wipe out the existing list of channels and show a loading indicator until new results are ready.
| Type |
|---|
| Function |
setFlatListRef
Callback function to access the underlying FlatList ref.
Example
const flatListRef = useRef(); <ChannelList setFlatListRef={(ref) => (flatListRef.current = ref)} />;| Type |
|---|
| Function |
| Parameter | Description |
|---|---|
React ref | FlatList ref |
UI Component Props
EmptyStateIndicator
Rendered when the channel list is empty and not loading via the ListEmptyComponent prop on the FlatList.
| Type | Default |
|---|---|
| ComponentType | EmptyStateIndicator |
FooterLoadingIndicator
Rendered when loadingNextPage from ChannelsContext is true via the ListFooterComponent prop on the FlatList.
| Type | Default |
|---|---|
ComponentType | ChannelListFooterLoadingIndicator |
ListHeaderComponent
Rendered when provided if the channel list is not empty via the ListHeaderComponent prop on the FlatList.
| Type |
|---|
| ComponentType |
LoadingErrorIndicator
Rendered when error from ChannelsContext is true, and the channel list is empty and not loading.
| Type | Default |
|---|---|
| ComponentType | LoadingErrorIndicator |
LoadingIndicator
Rendered when the channel list is empty and loading via the ListEmptyComponent prop on the FlatList.
| Type | Default |
|---|---|
| ComponentType | ChannelListLoadingIndicator |