Sendbird Chat React Total number of channels with unread messages React + Next.js

Question

I want to implement a hook to update my view with unread messages count without constantly making a request to the server to get the total number of channels with unread messages with this request . I am using React + Next.js, I can't seem to find any documentation on how to get into the channels unread messages properties via sdk or <ChannelList /> ui component. Sendbird support is practically useless, if anyone knows please help

Answer 1

Disclaimer, I work for Sendbird.

When utilizing the UIKit, you'll need to access the underlying SDK instance in order to utilize methods like getTotalUnreadMessageCount() or getTotalUnreadChannelCount(). First you'll need to get an instance of the current context which can be obtained by calling useSendbirdStateContext() which can be imported from sendbird-uikit. Note that this does need to be called within a component that is wrapped in the SendBirdProvider HOC.

const context = useSendbirdStateContext();
const sdkInstance = sendBirdSelectors.getSdk(context);

I created an example of this for you on codesandbox: https://codesandbox.io/s/usesendbirdstatecontext-example-s8eful