Skip to content

NotificationIcon

NotificationIcon maps a notification's severity to an icon. It is rendered by Notification and replaceable via component overrides.

Usage

The icon is selected automatically. You do not usually render NotificationIcon yourself. To customize the mapping, register a replacement with WithComponents:

import { Chat, WithComponents } from "stream-chat-react-native";
import { CustomNotificationIcon } from "./CustomNotificationIcon";

<WithComponents overrides={{ NotificationIcon: CustomNotificationIcon }}>
  <Chat client={client}>{/* ... */}</Chat>
</WithComponents>;

Props

Prop Description Type
notification (required) The notification being rendered. Notification

Built-in Severity Mapping

The default NotificationIcon maps these severities to icons. Any other severity renders no icon (the component returns null).

Severity Icon Color
'error' Exclamation circle semantics.textOnInverse
'warning' Exclamation circle semantics.textOnInverse
'success' Checkmark semantics.textOnInverse
'info' No icon N/A
'loading' Refresh (spinning) semantics.textOnInverse

See the Snackbar cookbook for a working override.