The props object for the ChatRoomProvider.
Props for the ChatRoomProvider component.
Optional
children?: ReactNode | ReactNode[]Children nodes.
The name of the room.
Optional
options?: RoomOptionsOverriding options to use when creating the room.
Important: The options
should be memoized to prevent unnecessary room recreations. Passing a new object reference
on each render will cause the room to be released and recreated.
const MyRoomComponent = () => {
const [typing, setTyping] = useState(true);
const roomOptions = useMemo(() => ({
typing: { timeoutMs: 5000 },
reactions: { enabled: true }
}), []); // Stable reference - options don't change
return (
<ChatRoomProvider name="my-room" options={roomOptions}>
<MyChat />
</ChatRoomProvider>
);
};
The ChatRoomProvider component.
const MyRoomComponent = () => {
const [typing, setTyping] = useState(true);
const roomOptions = useMemo(() => ({
typing: { timeoutMs: 5000 },
reactions: { enabled: true }
}), []); // Stable reference - options don't change
return (
<ChatRoomProvider name="my-room" options={roomOptions}>
<MyChat />
</ChatRoomProvider>
);
};
Provider for a Room. Must be wrapped in a ChatClientProvider.
The provider automatically manages room attachment and release based on reference counting. The first provider for a room will attach it, and the last provider to unmount will release it.
Important: The
props.options
should be memoized to prevent unnecessary room recreations. Passing a new object reference on each render will cause the room to be released and recreated.