Send GetSocial Notifications from React Native SDK

Prerequisite

Send Notifications

You can send GetSocial Notification to any user in you application. To send notification you have to:

  1. Create a list of receivers. The list should contain GetSocial user IDs.
  2. Create a notification content.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
// The list of GetSocial user IDs whom we will send notification to
const receivers: string[] = ... ;

// The content of the notification
const mediaAttachment: MediaAttachment = ... ; // Create and instance of MediaAttachment from image or video
const action: Action = ... ; // Create an Action instance
const notificationContent = NotificationContent
        .withText('Notification text')
        .withTitle('Greetings!')
        .withTemplateName('template-name')
        .withAction(action)
        .withMediaAttachment(media);

GetSocialUser.sendNotification(receivers, notificationContent).then((notificationSummary) => {
  console.log('Successfully sent ' + notificationSummary.successfullySentCount + ' notifications!');
}, (error) => {
  console.log('Failed to send notification.');
});

Receivers

  • Receivers list can not be empty.
  • It may contain up to 25 unique user IDs and one or many placeholders like Notification.Receivers.FRIENDS, Notification.Receivers.REFERRER or Notification.Receivers.REFERRED_USERS.

    1
    2
    3
    4
    5
    const receivers = [
          Notification.Receivers.REFERRED_USERS,
          Notification.Receivers.REFERRER,
          '[put user 1 id here]',
          '[put user 2 id here]'];
    
  • If you will send more that 25 user IDs - method will fail and notification will not be sent.

  • If you mentioned one user twice or user is in two or more placeholder groups - the notification will be sent only once.
  • If our service can not send the notification to one or many users, it will be delivered to all other users. You can check the number of successfully sent notifications in the response.

Notification Content

There are two ways to create a notification content:

  1. Create all the content on the client side. You can customize notification text (mandatory), title, configure notification click action and attach media or add action buttons.

    1
    2
    const notificationContent = NotificationContent
        .withText('Notification text');
    
  2. Use templates provided by GetSocial or create your custom template on the GetSocial Dashboard. You can override any content in the template dynamically on the client side.

    1
    2
    const notificationContent = NotificationContent
        .withTemplate('template-name');
    

Action

To set an action to the notification click, use notification.withAction(action).

1
2
3
const action = Action.withType(Action.Types.OPEN_INVITES);
const notificationContent = NotificationContent.withText('Invite friends!')
  .withAction(action);

Read how to create actions.

Action Buttons

To add an action button use notification.addActionButton(button) or notification.addActionButtons(actionButtons) to add multiple buttons at once.

1
2
3
4
5
const notificationContent = NotificationContent
  .withText('Add' + NotificationContent.Placeholder.SENDER_DISPLAY_NAME + ' to friends')
  .withAction(Action.withType(Action.Types.ADD_FRIEND))
  .addActionButton(ActionButton.create('Accept', ActionButton.CONSUME)
  .addActionButton(ActionButton.create('Decline', ActionButton.IGNORE);

Media Attachment

It’s possible to send image and video content in notification. To set image or video use NotificationContent.withMediaAttachment():

1
2
3
4
const mediaAttachment = ... ;
const notificationContent = NotificationContent
  .withText('Check this cool image!')
  .withMediaAttachment(attachment);

Check full Media Attachment guide to learn about supported image, GIF and video formats and limitations.

Notification Templates

To create a template for notifications:

  1. Login to the GetSocial Dashboard.

  2. Go to the Notifications section → Templates tab.

  3. Press New Template button.

    GetSocial Dashboard - Create New Template

  4. Create a new template by giving a unique name and meaningful description.

  5. Setup the notification content. You can add translations, emojis, default placeholders (Sender/Receiver display name) or custom placeholders that can be replaced on the SDK. Also you can set the fallback value for each placeholder which will be used if it wasn’t sent from the SDK side.

  6. To check the list of your custom templates switch to Custom tab using radio button.

Now create and setup notification using GetSocial React Native SDK:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
// Text for the template 'new_level_achieved' on the Dashboard:
// 'Your friend [SENDER_DISPLAY_NAME] just reached [USER_LEVEL] lvl! Try to beat his score!'

const notification = NotificationContent.withTemplate('new_level_achieved');
... // set up your notification
notification.addTemplatePlaceholder('USER_LEVEL', '7'); // add replacement for your placeholders without brackets

GetSocialUser.sendNotification(users, notification).then();
// Your recipients will receive text:
// "Your friend John Doe just reached 7 lvl! Try to beat his score!"

[SENDER_DISPLAY_NAME] is automatically replaced with sender display name.

Notification Sounds

Sound customization is supported via Templates only. But first you have to add it to your application:

  1. Prepare your audio files for both platfroms(or you can support it only for a single platform).

    • Android: It should not contain any special symbols or spaces in its name.
    • iOS: It should be in aiff, wav, or caf formats and not longer than 30 seconds. You can read more about this on the official Apple documentation in Preparing Custom Alert Sounds section.
  2. Add your files to the application.

    • Android: Put your file into your application’s res/raw directory of your Android project.
    • iOS: Add your file to your application target in the XCode. Make sure it’s added by checking if the file is listed in Copy Bundle Resources section of your target.
  3. After file is added you should create a template on the Dashboard.

    • Android: Specify file name without extension in Android Sound configuration.
    • iOS: Specify file name with extension in iOS Sound configuration.
  4. Build the application and run it on a device.

  5. Send notification to the user authenticated on this device. You can send notification via Smart Targeting or SDK. When the notification arrives to the device you should hear custom sound instead of the default one. Make sure your device is not muted and volume is on.

Badges

You can send badges only to iOS users, on Android it will be ignored.

Make sure you’ve completed setup guide for badges.

Currently you can not send badges from React Native SDK, but it is supported on the Dashboard through Templates and Smart Targeting.

Next Steps

Give us your feedback! Was this article helpful?

😀 🙁