ChannelContext

ChannelContext is provided by Channel component. If you are not familiar with React Context API, please read about it on React docs.

Basic Usage

ChannelContext can be consumed by any of the child component of Channel component as following:

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

const { lastRead, reloadChannel, watcherCount } = useContext(ChannelContext);

Alternatively, you can also use useChannelContext hook provided by library to consume ChannelContext.

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

const { lastRead, reloadChannel, watcherCount } = useChannelContext();

Value

channel

Channel instance from the StreamChat client.

enforceUniqueReaction

Limits reactions to one per user. If a user selects another reaction, their previous reaction will be replaced. This is similar to reaction UX of iMessage.

disabled

True if channel is frozen and disableIfFrozenChannel is true.

error

True if any API call to channel.query() during first load or pagination fails.

giphyEnabled

True if Giphy command is enabled on channel type.

hideDateSeparators

Hide inline date separators in MessageList component.

hideStickyDateHeader

Note: This prop is available only in SDK version >= v3.9.0

Hide sticky date header in MessageList component.

isAdmin

True if current user (connected to chat client) has admin role on application level or channel level. Please read more about User Roles for details.

const isAdmin =
  client?.user?.role === "admin" || channel?.state.membership.role === "admin";

isModerator

True if current user (connected to chat client) has moderator role on application level or channel level. Please read more about User Roles for details.

const isModerator =
  channel?.state.membership.role === "channel_moderator" ||
  channel?.state.membership.role === "moderator";

isOwner

True if current user (connected to chat client) has owner level permissions for current channel type. Please read User Permission section for details.

const isOwner = channel?.state.membership.role === "owner";

lastRead

Timestamp of when current user marked the channel as read - channel.markRead()

loadChannelAroundMessage

Function to load channel with messages around a particular message in history.

loadChannelAroundMessage({
  messageId,
});

loading

True if channel is loading messages during first load.

LoadingIndicator

Component to render full screen error indicator, when channel fails to load.

markRead

Function to mark current channel as read, for current user. This function internally makes a throttled call to channel.markRead(), if read events are enabled

maxTimeBetweenGroupedMessages

Maximum time in milliseconds between consecutive messages from the same user to still consider them grouped together.

members

Members of current channel. This value is received from backend when you query a channel, either using client.queryChannels() or channel.watch() API call.

Record<
  string, // userId
  {
    banned?: boolean;
    created_at?: string;
    invite_accepted_at?: string;
    invite_rejected_at?: string;
    invited?: boolean;
    is_moderator?: boolean;
    role?: string;
    shadow_banned?: boolean;
    updated_at?: string;
    user?: UserResponse<UserType>;
    user_id?: string;
  }
>;

read

Read statuses of members of current channel. This value is received from backend when you query a channel, either using client.queryChannels() or channel.watch() API call.

Record<
  string, // userId
  {
    last_read: Date;
    user: UserResponse<UserType>;
  }
>;

reloadChannel

Function to reload a channel at most recent message. Promise returned by this function will be resolved, when the channel has finished reloading.

scrollToFirstUnreadThreshold

Minimum number of unread messages a channel should have in order to set the initial scroll position to first unread message. This value is only used when initialScrollToFirstUnreadMessage is set to true.

setLastRead

Setter function for react state lastRead of Channel component.

setTargetedMessage

Setter function for react state targetedMessage of Channel component

targetedMessage

Id of message, which is highlighted currently. This value gets set when you load a channel at particular message in history, using loadChannelAroundMessage.

watchers

Watchers of current channel. This value is received from backend when you query a channel, either using client.queryChannels() or channel.watch() API call.

Record<
  string, // string
  UserResponse<UserType>
>;

watcherCount

Total number of users, currently watching a channel.

EmptyStateIndicator

Component to render, when channel has no messages.

NetworkDownIndicator

Component to render an indicator at top of the channel, which shows up when there is some issue with network or connection.