react-native-acoustic-mobile-push-inbox.md

Acoustic Mobile Push Inbox Plugin

Requirements

  • Acoustic Mobile Push Plugin (react-native-acoustic-mobile-push)

Description

This plugin is used to add inbox functionality to your application. The messages are created on the server and passed to the device over a periodic sync process. They are displayed via templates that provide a means to display their content in both list form and full screen. These templates are designed to be customized for your application. You can also create additional inbox templates and register them with the server so other types of messages can be displayed to the user.

Installation

npm install --save <sdk folder>/plugins/react-native-acoustic-mobile-push-inbox

Post Installation Steps

Link the plugin with

react-native link react-native-acoustic-mobile-push-inbox

Template files in this plugins javascript directory will need to be integrated into your application and the templates will need to be imported so they can register with the SDK at startup like this:

import {DefaultInbox} from './inbox/default-inbox-template';
import {PostInbox} from './inbox/post-inbox-template';
import {InboxAction} from './inbox/inbox-action';

Additionally, you will need to create pages to display the list of messages and the full screen messages. See the sample project's inbox-message-screen.js and inbox-screen.js for examples of how this can be done.

Module API

inboxMessageCount(callback)

Description

This function can be used to determine how many inbox messages are in the inbox and how many are unread. The counts are delivered to the callback function as an object with unread and messages keys.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

RNAcousticMobilePushInbox.inboxMessageCount(function(counts) { 
	console.log("There are " + counts.messages + " messages in the inbox and " + counts.unread + " are unread");
});

deleteInboxMessage(inboxMessageId)

Description

This function can be used to delete the inbox message with the provided inboxMessageId value. Note that the inboxMessageId comes from an inbox message that is currently displayed.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

var inboxMessageId = "abc";
RNAcousticMobilePushInbox.deleteInboxMessage(inboxMessageId);

readInboxMessage(inboxMessageId)

Description

This function can be used to mark an inbox message as read via the inbox message with the provided inboxMessageId value. Note that the inboxMessageId comes from an inbox message that is currently displayed.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

var inboxMessageId = "abc";
RNAcousticMobilePushInbox.readInboxMessage(inboxMessageId);

syncInboxMessages()

Description

This function requests the SDK to sync the inbox messages with the server.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

RNAcousticMobilePushInbox.syncInboxMessages();

listInboxMessages(ascending, callback)

Description

This function can be used to list the contents of the inbox. The ascending parameter can be true for messages sorted in ascending order of send date and false to sort the messages in descending order. The messages are provided to the callback function for processing.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

RNAcousticMobilePushInbox.listInboxMessages(false, (inboxMessages) => {
	inboxMessages.forEach( (inboxMessage) => {
		console.log("Inbox message found with inboxMessageId: " + inboxMessage.inboxMessageId + ", content: " + JSON.stringify(inboxMessage.content) + ", expirationDate: " + inboxMessage.expirationDate + ", sendDate: " + inboxMessage.sendDate +  ", displayed using template: " + inboxMessage.templateName + ", the message is" +  (inboxMessage.isRead ? "" : " NOT" ) + " read, the message is" + (inboxMessage.isDeleted ? "" : " NOT" ) + " deleted, and is" + (inboxMessage.isRead ? "" : " NOT" ) + " expired.");
	})
});

clickInboxAction(action, inboxMessageId)

Description

This function can be used to trigger an inbox message action. The action is defined in the message which is referenced by it's inboxMessageId. Note: these should both come from valid inbox messages in the inbox. See default and post inbox templates for concrete examples.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

var action = {type: "url", value: "http://accoustic.co"};
var inboxMessageId = "abc";
clickInboxAction(actionFromMessage, inboxMessageId);

registerInboxComponent(module)

Description

This function registers the root view for the inbox message push action handler. Typically this is setup in inbox-action.js and registers the InboxAction class to handle inbox push events. However, this can be customized if desired.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

RNAcousticMobilePushInbox.registerInboxComponent("InboxAction");

hideInbox()

Description

This function hides the inbox message overlay that is popped up when an inbox message action is handled.

Example

import {RNAcousticMobilePushInbox} from 'NativeModules';

RNAcousticMobilePushInbox.hideInbox();

Events Emitted

SyncInbox

Description

This event is emitted when the contents of the inbox have changed due to a sync with the server.

Example

import {NativeEventEmitter} from 'react-native';
import {RNAcousticMobilePushInbox} from 'NativeModules';

const emitter = new NativeEventEmitter(RNAcousticMobilePushInbox);

emitter.addListener('SyncInbox', () => { 
	// Update the list of messages displayed to the user here
});

InboxCountUpdate

Description

Thie event is emitted when the number of messages or unread messages changes.

Example

import {NativeEventEmitter} from 'react-native';
import {RNAcousticMobilePushInbox} from 'NativeModules';

const emitter = new NativeEventEmitter(RNAcousticMobilePushInbox);

emitter.addListener('InboxCountUpdate', () => { 
	// Update interfaces that show the current number of messages or unread messages
});

Sample Action Payload

{
	"type": "openInboxMessage",
	"template": "post", 
	"value": "A8HMqDEU"
}