HMS Location Kit - Can we send a local notification in react native?

Question

I need to send a notification from the device (not the back-end) is there a way to do that ?

Thanks for response I ll be grateful

Answer 1

as mentioned by the others, you can use some libraries for this purpose. Among them I believe 'react-native-push-notification' is more widely endorsed: https://www.npmjs.com/package/react-native-push-notification

Note that if you are using RN0.60.+ it will autolink for you and you don't have to go through steps like react-native link or adding packages in MainApplication.java. If not, the repo itself has detailed instruction on installation too.

Moreover, part of this library has dependencies on gms/firebase, so in a HMS context you cannot use some of its features, e.g. remote notification. If your purpose is solely local notification then you are good to go.

Also note that if you plan on handling the click of your local notification, you'll need to configure onNotificaiton to listen to the click. One important point to note is on HMS devices the requestPermission param must be set to false otherwise a firebase dependency will be called and cause errors.

Sample code snippets:

import PushNotification from 'react-native-push-notification'

export default class App extends Component {
...
  componentDidMount() {
     ...
     PushNotification.configure({
      // (required) Called when a remote is received or opened, or local notification is opened
      onNotification: function (notification) {
        console.log("NOTIFICATION:", notification);
    
        // process the notification
    
        // (required) Called when a remote is received or opened, or local notification is opened
        notification.finish(...);
      },

      // Should the initial notification be popped automatically
      // default: true
      popInitialNotification: true,
    
      /**
       * (optional) default: true
       * - Specified if permissions (ios) and token (android and ios) will requested or not,
       * - if not, you must call PushNotificationsHandler.requestPermissions() later
       * - if you are not using remote notification or do not have Firebase installed, use this:
       *     requestPermissions: Platform.OS === 'ios'
       */
      requestPermissions: false,
    });
    ...
  }
    
    ...
    
  onSendLocalNotification = () => {
    PushNotification.localNotification({
      /* Android Only Properties */
      id: 0, // (optional) Valid unique 32 bit integer specified as string. default: Autogenerated Unique ID
      ticker: "My Notification Ticker", // (optional)
      autoCancel: true, // (optional) default: true
      largeIcon: "ic_launcher", // (optional) default: "ic_launcher"
      smallIcon: "ic_notification", // (optional) default: "ic_notification" with fallback for "ic_launcher"
      bigText: "My big text that will be shown when notification is expanded", // (optional) default: "message" prop
      subText: "This is a subText", // (optional) default: none
      color: "red", // (optional) default: system default
      vibrate: true, // (optional) default: true
      vibration: 300, // vibration length in milliseconds, ignored if vibrate=false, default: 1000
      tag: "some_tag", // (optional) add tag to message
      group: "group", // (optional) add group to message
      ongoing: false, // (optional) set whether this is an "ongoing" notification
      priority: "high", // (optional) set notification priority, default: high
      visibility: "private", // (optional) set notification visibility, default: private
      importance: "high", // (optional) set notification importance, default: high
      allowWhileIdle: false, // (optional) set notification to work while on doze, default: false
      ignoreInForeground: false, // (optional) if true, the notification will not be visible when the app is in the foreground (useful for parity with how iOS notifications appear)
     
      /* iOS only properties */
      alertAction: "view", // (optional) default: view
      category: "", // (optional) default: empty string
      userInfo: {}, // (optional) default: {} (using null throws a JSON value '<null>' error)
     
      /* iOS and Android properties */
      title: "My Notification Title", // (optional)
      message: "My Notification Message", // (required)
      playSound: false, // (optional) default: true
      soundName: "default", // (optional) Sound to play when the notification is shown. Value of 'default' plays the default sound. It can be set to a custom sound such as 'android.resource://com.xyz/raw/my_sound'. It will look for the 'my_sound' audio file in 'res/raw' directory and play it. default: 'default' (default sound is played)
      number: 10, // (optional) Valid 32 bit integer specified as string. default: none (Cannot be zero)
      repeatType: "day", // (optional) Repeating interval. Check 'Repeating Notifications' section for more info.
      actions: '["Yes", "No"]', // (Android only) See the doc for notification actions to know more
    });
  }
  ...
  
}

I hope you can use the code pattern.