# Notifications

Starting in `stream-chat-react@13.1.0`, you can render notifications created by the `StreamClient`:

```js
client.notifications.add({ message, origin, options }); // low-level method called by addError/addWarning/...
client.notifications.addError({ message, origin, options }); // adds severity: 'error'
client.notifications.addWarning({ message, origin, options }); // adds severity: 'warning'
client.notifications.addInfo({ message, origin, options }); // adds severity: 'info'
client.notifications.addSuccess({ message, origin, options }); // adds severity: 'success'
```

`MessageListNotifications` renders these notifications. You can swap it with a custom component:

```tsx
<Channel MessageListNotifications={CustomMessageListNotifications}>
```

## Best Practices

- Use severity levels to keep notifications meaningful.
- Keep notification copy concise and actionable.
- Prefer custom `MessageListNotifications` only for layout or branding changes.
- Translate notifications via the notification topic for consistency.
- Avoid over-notifying; throttle noisy sources.

To build and translate notification text, register translator functions for the `notification` topic. See [the notification translation guide](/chat/docs/sdk/react/guides/theming/translations/#translation-builder).

The sections below cover notification management in `NotificationManager`.

<partial id="shared/chat/js/notifications/_notification-service"></partial>


---

This page was last updated at 2026-03-06T17:06:47.532Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react/guides/notifications/](https://getstream.io/chat/docs/sdk/react/guides/notifications/).