node package manager
Orgs are free. Discover, share, and reuse code in your team. Create a free org »

react-native-intercom

react-native-intercom

React Native wrapper for Intercom.io. Based off of intercom-cordova

Install

IOS

Run npm install react-native-intercom Run react-native link

CocoaPods

Add the following to your podfile

pod 'react-native-intercom', :path => '../node_modules/react-native-intercom'

Manual

Follow how to manually link a library here https://facebook.github.io/react-native/docs/linking-libraries-ios.html#content

Android

Run npm install react-native-intercom

Necessary Code Bits

IOS

More instructions here: Intercom for iOS

Initialize Intercom in your AppDelegate.m

#import "Intercom/intercom.h"

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Initialize Intercom
    [Intercom setApiKey:@"<#ios_sdk-...#>" forAppId:@"<#your-app-id#>"];
}
  1. Intercom's documentation suggests adding the following call in order to receive push notifications for new messages:
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken {
     [Intercom setDeviceToken:deviceToken];
}

Android

More instructions here: Intercom for Android

Intercom.initialize(getApplicationContext(), "your api key", "your app id");

And in your AndroidManifest.xml file add the following lines within the <application> ... </application> tags

<service
     android:name="com.robinpowered.react.Intercom.IntercomIntentService"
     android:exported="false">
     <intent-filter
        android:priority="999">
        <action android:name="com.google.android.c2dm.intent.RECEIVE"/>
    </intent-filter>
</service>
 
 <receiver
     android:name="io.intercom.android.sdk.push.IntercomPushBroadcastReceiver"
     tools:replace="android:exported"
     android:exported="true" />

Make sure to add xmlns:tools="http://schemas.android.com/tools" in your main <application> tag

Usage

Require the module

var Intercom = require('react-native-intercom');

Log an event

Intercom.logEvent('viewed_screen', { extra: 'metadata' });

Register a Logged In user

Intercom.registerIdentifiedUser({ userId: 'bob' });

Register Unidentified user

Intercom.registerUnidentifiedUser();

Register a Logged In user and post extra metadata

Intercom.registerIdentifiedUser({ userId: 'bob' })
Intercom.updateUser({
    // Pre-defined user attributes
    email: 'mimi@intercom.com',
    user_id: 'user_id',
    name: 'your name',
    phone: '010-1234-5678',
    language_override: 'language_override',
    signed_up_at: 1004,
    unsubscribed_from_emails: true,
    companies: [{
        // Only supported for iOS now
        // Parameters: IntercomUserAttribtesBuilder.m -> companyForDictionary()
    }],
    custom_attributes: {
        my_custom_attribute: 123
    },
});

Sign Out

Intercom.reset()

Show Message Composer

Intercom.displayMessageComposer();

Show Message Composer with an Initial Message

Intercom.displayMessageComposerWithInitialMessage('Initial Message');

Set Bottom Padding

Intercom.setBottomPadding(64);

Listen for Unread Conversation Notifications

componentDidMount() {
    Intercom.addEventListener(Intercom.Notifications.UNREAD_COUNT, this._onUnreadChange)
}
 
componentWillUnmount() {
    Intercom.removeEventListener(Intercom.Notifications.UNREAD_COUNT, this._onUnreadChange);
}
 
_onUnreadChange = ({ count }) => {
    //...
}
 
 

Send FCM token directly to Intercom

Firebase.messaging().getToken()
  .then((token) => {
    console.log('Device FCM Token: ', token);
    Intercom.sendTokenToIntercom(token);
});