react-native-intercom

To install the package, use yarn or npm to add the dependency and then link the native dependencies.

Note: This package is marked as DEPRECATED. Intercom recommends using the official package: https://github.com/intercom/intercom-react-native.

yarn add react-native-intercom  # or npm install react-native-intercom

react-native link react-native-intercom

Follow these steps to set up Intercom on iOS:

1. Install Intercom for iOS via CocoaPods or manual installation.
2. Link the library in Xcode:
   • Add RNIntercom.xcodeproj from node_modules/react-native-intercom/iOS to your project's Libraries folder.
   • In Xcode, go to General Settings -> Build Phases -> Link Binary with Libraries and add libRNIntercom.a.
3. Initialize in AppDelegate.m:
   • Add #import "Intercom/intercom.h" at the top.
   • Call `[Intercom setApiKey:@

Use the following methods to manage the identity of the user currently using your app:

• registerIdentifiedUser(options): Registers a user with a known identity (e.g., via userId or email).
• registerUnidentifiedUser(): Registers a user without a known identity.
• updateUser(options): Updates attributes for the currently registered user.
• setUserHash(userHash): Sets a user hash for identity validation (optional).
• logout(): Logs the current user out of Intercom.
• sendTokenToIntercom(token): Sends an authentication token to Intercom.

import Intercom from 'react-native-intercom';

// Register an identified user
Intercom.registerIdentifiedUser({ userId: 'user_id_123' });

// Update user metadata
Intercom.updateUser({ name: 'John Doe' });

// Log out
Intercom.logout();

Use these methods to manage the visibility and presentation of Intercom UI components:

• displayMessenger(): Opens the Intercom messenger.
• hideMessenger(): Closes the Intercom messenger.
• displayMessageComposer(): Opens the message composer.
• displayMessageComposerWithInitialMessage(message): Opens the composer with a pre-filled message.
• displayConversationsList(): Shows the list of conversations.
• displayHelpCenter(): Opens the Intercom Help Center.
• presentCarousel(carousel): Presents a specific carousel.
• presentArticle(articleId): Presents a specific help article.
• setLauncherVisibility(visibility): Sets whether the Intercom launcher is VISIBLE or GONE.
• setInAppMessageVisibility(visibility): Sets whether in-app messages are VISIBLE or GONE.
• setBottomPadding(padding): Adjusts the bottom padding for the UI.

The IntercomClient allows you to subscribe to specific Intercom events using addEventListener and removeEventListener.

Available event types are found in Intercom.Notifications:

• Intercom.Notifications.UNREAD_COUNT: Triggered when the unread conversation count changes.
• Intercom.Notifications.WINDOW_DID_HIDE: Triggered when the Intercom window is hidden.
• Intercom.Notifications.WINDOW_DID_SHOW: Triggered when the Intercom window is shown.

import Intercom from 'react-native-intercom';

const onUnreadChange = (count) => {
  console.log('Unread count changed:', count);
};

// Subscribe to event
Intercom.addEventListener(Intercom.Notifications.UNREAD_COUNT, onUnreadChange);

// Unsubscribe
Intercom.removeEventListener(Intercom.Notifications.UNREAD_COUNT, onUnreadChange);

The IntercomClient is the primary interface for interacting with Intercom in your React Native application. It provides methods for user registration, event logging, messenger control, and push notification setup. The client is exported as a singleton, so you can import it directly and call its methods.

import Intercom from 'react-native-intercom';

// Example: Registering an identified user
Intercom.registerIdentifiedUser({ userId: '123', email: 'user@example.com' });

// Example: Logging an event
Intercom.logEvent('button_clicked', { buttonId: 'signup' });

// Example: Displaying the messenger
Intercom.displayMessenger();

To enable push notifications via Intercom, use the following methods:

• registerForPush(): Registers the device for push notifications.
• setupAPN(deviceToken): Configures Apple Push Notification service (APN) with a device token.
• handlePushMessage(): Handles incoming push messages.

The IntercomClient allows you to subscribe to specific Intercom events using addEventListener(type, handler) and removeEventListener(type, handler).

Available notification types are found in IntercomClient.Notifications:

• UNREAD_CHANGE_NOTIFICATION: Triggered when the unread conversation count changes.
• WINDOW_DID_HIDE_NOTIFICATION: Triggered when the Intercom window is hidden.
• WINDOW_DID_SHOW_NOTIFICATION: Triggered when the Intercom window is shown.

import Intercom from 'react-native-intercom';

const onUnreadChange = (count) => {
  console.log('Unread count changed:', count);
};

// Subscribe to unread count changes
Intercom.addEventListener(Intercom.Notifications.UNREAD_COUNT, onUnreadChange);

// Unsubscribe later
Intercom.removeEventListener(Intercom.Notifications.UNREAD_COUNT, onUnreadChange);

You can manage user identity using the following methods:

• registerIdentifiedUser(options): Registers a user with specific details (e.g., email, name, attributes).
• registerUnidentifiedUser(): Registers a user without identifying information.
• updateUser(options): Updates the attributes of the currently registered user.
• logout(): Logs the current user out of Intercom.
• setUserHash(userHash): Sets a user hash for identity validation (optional).

import Intercom from 'react-native-intercom';

// Register an identified user
Intercom.registerIdentifiedUser({
  email: 'user@example.com',
  name: 'John Doe',
  userAttributes: {
    plan: 'premium'
  }
});

// Or register an unidentified user
Intercom.registerUnidentifiedUser();

The IntercomClient is the primary interface for interacting with Intercom services in your React Native application. It provides methods for user registration, event logging, messenger control, and event listening. The module exports a default instance of IntercomClient, allowing you to import and use it directly without manual instantiation.

import Intercom from 'react-native-intercom';

// Use the default instance
Intercom.logEvent('button_clicked', { id: 'signup' });

When using methods like setLauncherVisibility or setInAppMessageVisibility, use the IntercomClient.Visibility enum to specify the state:

• IntercomClient.Visibility.VISIBLE
• IntercomClient.Visibility.GONE

import Intercom from 'react-native-intercom';

Intercom.setLauncherVisibility(Intercom.Visibility.GONE);