Client event doesn't detect user.presence.changed, user.watching.start, etc.

[iamacatperson]

Basically I have this current set-up for livestream chat:

const chatClient = new StreamChat(OUR_KEY);

chatClient.setUser(
{
    id: OUR_USERID,
    name: USERNAME
},
STREAM_TOKEN
);

const channel = chatClient.channel("livestream", STREAM_CHANNEL_ID, {
    image: "",
    name: "Event Name"
});

channel.watch({ presence: true });

channel.on(event => {
    console.log("CHANNEL EVENT");
    console.log(event);
});

chatClient.on(event => {
    console.log("CLIENT EVENT");
    console.log(event);
});

I tried sending messages on the channel or adding reactions and I do get the log for that event. I also get health.check and connection.changed logs from client events.

However, it can't seem to detect user.presence.changed, user.watching.start, etc. I simulated this by logging-in as 2 different users (one in normal browser, the other in incognito). Then I trigger stopWatching() method upon some button click:

const stopWatching = async () => {
    const response = await channel.stopWatching();
    console.log(response);
};

And I also triggered:

chatClient.disconnect();

I also tried initialising the members of the chat as in:

const channel = chatClient.channel("livestream", STREAM_CHANNEL_ID, {
    image: "",
    name: "Event Name",
    members: ["member-id-1", "member-id-2"]
});

But I still don't get any logs. Anything wrong with the implementation and am I missing something?

Below are the react components that I use to render the chat:

<Chat client={chatClient} theme={"livestream light"}>
      <Channel channel={channel} Message={MessageLivestream}>
            <Window hideOnThread>
                <ChannelHeader live />
                <MessageList />
                <MessageInput Input={MessageInputSmall} focus />
            </Window>
            <Thread fullWidth />
     </Channel>
</Chat>

[vishalnarkhede]

Hey @iamacatperson , I will check and get back to you!

[vishalnarkhede]

@iamacatperson by default presence related events are disabled for livestream type channel. You can enable them in dashboard (dashboard -> your app -> chat overview -> livestream -> connect events toggle)

It has certain limit though. @bogdan-getstream can you explain a bit on limits on number of watcher for presence events?

[iamacatperson]

@vishalnarkhede I restructured the component to use class-based component instead of functional with hooks. It's now working without me having to change the settings in the dashboard.

My question is, does the current react api not fully support functional component with hooks?

Yup it would be good to know about the limits also. And is it the same even for a paid account? As there may be up to a thousand+ participants in the chat at a point in time, although we would only query 10 users or so in one page.

[bogdan-getstream]

Currently we have no limits other that rate limit.

Limits will be added soon, in case you need to disable such events on some amount of channel watchers, that setting will be configurable from dashboard

[vishalnarkhede]

@vishalnarkhede I restructured the component to use class-based component instead of functional with hooks. It's now working without me having to change the settings in the dashboard.

My question is, does the current react api not fully support functional component with hooks?

class or functional components shouldn't matter. Could you share some code please?

[vishalnarkhede]

@iamacatperson I guess this question was resolved in https://github.com/GetStream/stream-chat-react/issues/207. So closing it for now. Please reopen if you have any more question!