In-app notifications allow users to receive real-time updates when a message or reply is received from a support agent while the app is in the foreground. These notifications appear as banners at the top of the app, ensuring users do not miss important updates. 

You can either use the: 

1. Sprinklr-provided Messenger Notification Banner 

2. Customize the notification view to match your app's design. 

​

1) Enable/Disable In-App Notifications 

Using Sprinklr’s Default Notification Banner 

To enable Sprinklr's in-app notification banner, add MessengerNotificationBanner parallel to the root view of your application. 

​

Implementation 

​

import { MessengerNotificationBanner } from '@sprinklrjs/chat-native-client';  function onTapNotificationBanner(notification) {  // open sprinklr messenger view with launch options  const launchOptions = { type: 'NOTIFICATION', data: notification };  presentMessengerView(launchOptions); // provide your presentMessengerView.. we need to open conversation in messenger corresponding to the notification }  function MainApp () {  return (    <>      <RootView />      <MessengerNotificationBanner onTapBanner={onTapNotificationBanner} />    </>  ) } 

​

Disabling In-App Notifications 

If you want to disable in-app notifications, avoid adding MessengerNotificationBanner to your UI or handle notifications through custom logic (explained in the next section). 

2) Customizing In App Notification as per Preference 

If you prefer a custom notification banner instead of Sprinklr’s default banner, follow these additional steps: 

Register a Custom Notification Handler 

You need to register your own notification handler to process received notifications and display them in your custom banner. 

Implementation 

​

import MessengerClient from '@sprinklrjs/chat-native-client'  // Custom notification handler  function notificationHandler(notification) {      // Implement your custom logic to display notification in your custom banner }  MessengerClient.registerNotificationHandler(notificationHandler) ​

Notification Object Structure 

The notification object follows this format: 

{ "data": { "messageId": "<MESSAGE_ID>", "title": "<NOTIFICATION_TITLE>", //live chat account display name "description": "<NOTIFICATION_DESCRIPTION>", //notification message "cId": "<CONVERSATION_ID>", // Conversation Id "imageURI": "<IMAGE_URI>" // Image to display inside the notification banner } } 

​

​

Additional Resources

See All Integration Steps

​

​