Context

Contexts provide a way to deliver data from Chat SDK to the module and its components that build the UI of the screen. Each fragment has more than one context and each context serves a different purpose to allow access to a specific type of data.

Note: In order to use a context, the module component getting access to the data must be a component directly rendered in the corresponding module. For example, the GroupChannelListContext.Fragment context cannot be used for a user list component because the component doesn't exist in the GroupChannelListFragment.

You can use the context in a module component by calling the useContext hook.

import React, { useContext } from 'react';
import { Text } from 'react-native';
import { GroupChannelContexts } from '@sendbird/uikit-react-native';

const CustomTypingUsersComponent = () => {
    const { typingUsers } = useContext(GroupChannelContexts.TypingIndicator);
    if (typingUsers.length === 0) return null;
    return <Text>{`several people are typing (${typingUsers.length})`}</Text>;
};