Chat UIKit React Native v3
Chat UIKit React Native
Chat UIKit
React Native
Version 3


Copy link

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.

How to use context

Copy link

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>;