Live Chat

Every live stream comes with a chat, so viewers can ask questions and the host can answer live. Think of the comment feed next to a webinar or a creator's live video.

Where this fits: it's a normal Livqeno Chat conversation, created together with the stream. You don't call livqeno.chat.createConversation, add members, or make chat tokens yourself. addHost and createViewerToken do all of that, and the chat token is already inside each person's credential.

Send and receive messages

In your app (host or viewer), after LiveStream.join(), stream.chat is already connected to the stream's conversation:

await stream.chat.sendMessage({ text: 'Hey everyone!' });
stream.chat.on('message', (message) => console.log(message.senderId, message.text));

import { useMessages } from '@livqeno/react';
 
function LiveChatPanel() {
  const { messages, send } = useMessages(); // works inside <LivqenoLiveStream> — no separate hook
  return (
    <div>
      {messages.map((m) => <p key={m.id}>{m.senderId}: {m.text}</p>)}
      <input onKeyDown={(e) => e.key === 'Enter' && send(e.currentTarget.value)} />
    </div>
  );
}

await stream.chat!.send('Hey everyone!');
stream.chat!.on('message', (message) => console.log(message.senderId, message.text));

await stream.chat?.send('Hey everyone!');
stream.chat?.messages.listen((message) => print('${message.senderId}: ${message.text}'));

stream.chat is a normal chat client on every SDK. Everything in Chat works on it.

In React, there's no useLiveStreamChat(). Just use useMessages() and the other chat hooks inside <LivqenoLiveStream>.

Chat roles

Each person's chat scope is set from their stream role. The scope decides what they can do in the chat, for example only moderators and admins can delete other people's messages:

What each scope can do: Authentication and Chat → Moderation.

When stream.chat is missing

stream.chat only exists if the join credentials include a chat field. Credentials from the Live Streaming API always include it.

If you build credentials by hand and leave out chat:

• stream.chat is undefined.
• stream.react() throws an error.

Next steps

• Reactions: the ❤️ button, built on this chat.
• Moderation: remove bad messages during a stream.
• Chat: everything else stream.chat can do, like typing indicators and message history.