React
iOS
Android
Flutter
Angular
JavaScript
Unity
Unreal
Node
Python
Ruby
PHP
Java
.NET
Go
RESTThis is documentation for Stream Chat React SDK v13, which is no longer actively maintained. For up-to-date documentation, see the latest version (v14).
System Message
A system message is generated by backend events (for example, banning or muting a user). The SDK renders them automatically in VirtualizedMessageList and MessageList. This guide shows how to override the default component.
Best Practices
- Keep system messages visually distinct but not disruptive.
- Preserve the message text and timestamp for audit clarity.
- Avoid exposing sensitive actor details unless your policy allows it.
- Use
MessageSystemoverride for layout changes, not just styling. - Test system messages for moderation events and permission changes.
Default System Message Component
The default system message component is EventComponent. It renders when message.type === "system".
Custom System Message Component
Our custom component shows the message text, date, and actor (user who triggered the event). To override the default, pass MessageSystem to Channel, which injects it into ComponentContext.
To see your component in action, try muting a user with the /mute command followed by an @mention. These commands must be enabled in the Dashboard.
