In-App UI
React Native
UI components
Components

React Native SDK pre-built components

How to use Knock's UI components in your React Native application.

NotificationFeed

Overview

NotificationFeed is a React component that renders a list of notifications using data from Knock. It provides a customizable and interactive user interface for displaying notifications within your React Native application.

Properties

initialFilterStatusFilterStatus
The initial filter applied to the notification feed. Defaults to 'All'.
notificationRowStyleNotificationFeedCellStyle
Customizes the style of the notification rows in the feed.
headerConfigNotificationFeedHeaderConfig
Configures the header of the notification feed.
emptyFeedStyleEmptyNotificationFeedStyle
Customizes the appearance of the empty state when there are no notifications.
onCellActionButtonTap(params: { button: ActionButton, item: FeedItem }) => void
Callback triggered when an action button in a notification row is tapped.
onRowTap(item: FeedItem) => void
Callback triggered when a notification row is tapped.

Examples


NotificationIconButton

Overview

NotificationIconButton is a React component that renders a button with a badge showing the count of unread or unseen notifications. This can be used to open the NotificationFeed when tapped.

Properties

onClick() => void
Callback triggered when the button is pressed.
badgeCountTypeBadgeCountType
Specifies whether to display the count of 'unread', 'unseen', or 'all' notifications.
styleOverrideViewStyle
Customizes the overall style of the button.

Example