### Display Intercom Message Composer with Initial Message in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript example shows how to open the Intercom message composer with a pre-filled initial message. This is useful for guiding users or providing context when they start a new conversation, such as pre-populating a support query. ```javascript Intercom.displayMessageComposerWithInitialMessage('Initial Message'); ``` -------------------------------- ### Install react-native-intercom package Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Instructions to add the `react-native-intercom` package to your project using yarn or npm. ```bash yarn add react-native-intercom # or npm install react-native-intercom ``` -------------------------------- ### Initialize Intercom SDK in iOS AppDelegate Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Objective-C code to initialize the Intercom SDK with your API Key and App ID in the `didFinishLaunchingWithOptions` method of `AppDelegate.m`. ```obj-c - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // Intercom [Intercom setApiKey:@"YOUR_IOS_API_KEY_HERE" forAppId:@"YOUR_APP_ID_HERE"]; } ``` -------------------------------- ### Add Google Maven repository to Android build.gradle Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Gradle configuration to add the Google Maven repository to `allprojects.repositories` in `android/build.gradle`. ```gradle allprojects { repositories { //...other configuration here... maven { url "https://maven.google.com" } } } ``` -------------------------------- ### Link React Native native dependencies Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Command to automatically link native modules for `react-native-intercom`. ```bash react-native link react-native-intercom ``` -------------------------------- ### Configure Info.plist for iOS Photo Library access Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md XML configuration to add the `NSPhotoLibraryUsageDescription` key to `Info.plist` to allow Intercom access to the photo library on iOS. ```xml ...other configuration here... NSPhotoLibraryUsageDescription Send photos to help resolve app issues ...other configuration here... ``` -------------------------------- ### Log Custom Events with Intercom in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript example shows how to log custom events to Intercom using `Intercom.logEvent()`. You can include optional metadata to provide more context about the event, which is useful for tracking user behavior and interactions. ```javascript Intercom.logEvent('viewed_screen', { extra: 'metadata' }); ``` -------------------------------- ### Sign Out User from Intercom in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript example shows how to log out the current user from Intercom using `Intercom.logout()`. This action clears the current user session and is typically called when a user signs out of your application. ```javascript Intercom.logout() ``` -------------------------------- ### Initialize Intercom SDK in Android MainApplication Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Java code to import Intercom classes and initialize the SDK with your Android API Key and App ID in the `onCreate` method of `MainApplication.java`. Also includes adding `IntercomPackage` to `getPackages`. ```java // ...other configuration here... import com.robinpowered.react.Intercom.IntercomPackage; import io.intercom.android.sdk.Intercom; public class MainApplication extends Application { @Override public void onCreate() { super.onCreate(); Intercom.initialize(this, "YOUR_ANDROID_API_KEY_HERE", "YOUR_APP_ID_HERE"); // ...other configuration here... } public List getPackages() { // ...other configuration here... packages.add(new IntercomPackage()); // ...other configuration here... } } ``` -------------------------------- ### Register Unidentified User with Intercom in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript example shows how to register an anonymous user with Intercom using `Intercom.registerUnidentifiedUser()`. This is useful for tracking users who are not yet logged in or identified, allowing them to interact with Intercom features. ```javascript Intercom.registerUnidentifiedUser(); ``` -------------------------------- ### Display Intercom Conversations List (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet demonstrates how to open the list of all previous Intercom conversations. Users can browse their conversation history from this view. ```javascript Intercom.displayConversationsList(); ``` -------------------------------- ### Display Latest Intercom Conversation (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet shows how to programmatically display the latest Intercom conversation screen. It directly opens the messenger interface for the user. ```javascript Intercom.displayMessenger(); ``` -------------------------------- ### Display Intercom Help Center (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet opens the Intercom Help Center, allowing users to access self-service support articles. It requires enabling the Help Center in Intercom settings before use. ```javascript Intercom.displayHelpCenter(); ``` -------------------------------- ### Present Intercom Carousel (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet allows presenting a specific Intercom carousel to the user. Carousels must be enabled and created in Intercom settings, and a valid 'carouselID' is required. ```javascript Intercom.presentCarousel(carouselID); ``` -------------------------------- ### Add Intercom SDK dependencies for Android push notifications Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Gradle dependency configurations for Intercom SDK, allowing selection between a base SDK (no push) or a full SDK with Firebase Cloud Messaging (FCM) support for push notifications. ```gradle dependencies { implementation 'io.intercom.android:intercom-sdk-base:5.+' } ``` ```gradle dependencies { //...other configuration here... implementation 'io.intercom.android:intercom-sdk-base:9.+' implementation 'io.intercom.android:intercom-sdk:9.+' } ``` -------------------------------- ### Configure AndroidManifest for Intercom FCM Service Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This XML snippet shows how to declare the `MainMessagingService` in your `AndroidManifest.xml` file. It registers the service to listen for `com.google.firebase.MESSAGING_EVENT` actions, enabling Intercom to receive push notifications through FCM. ```xml ``` -------------------------------- ### Display Intercom Message Composer in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript snippet demonstrates how to open the Intercom message composer, allowing the user to initiate a new conversation or send a message. This method is typically called when a user wants to contact support or send feedback. ```javascript Intercom.displayMessageComposer(); ``` -------------------------------- ### Intercom Window Visibility Notifications (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet lists other available Intercom notifications related to the messenger window's visibility. 'WINDOW_DID_HIDE' is triggered when the window is hidden, and 'WINDOW_DID_SHOW' when it becomes visible. ```javascript // The window was hidden Intercom.Notifications.WINDOW_DID_HIDE // The window was shown Intercom.Notifications.WINDOW_DID_SHOW ``` -------------------------------- ### Set device token for iOS push notifications Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md Optional Objective-C code to set the device token for Intercom to receive push notifications for new messages in `didRegisterForRemoteNotificationsWithDeviceToken`. ```obj-c - (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken { // Intercom [Intercom setDeviceToken:deviceToken]; } ``` -------------------------------- ### Import or Require the Intercom Module in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet demonstrates how to import the `react-native-intercom` module into your JavaScript files using either ES6 `import` syntax or CommonJS `require` syntax. This is the first step to using any Intercom functionalities in your React Native application. ```javascript import Intercom from 'react-native-intercom'; ``` ```javascript var Intercom = require('react-native-intercom'); ``` -------------------------------- ### Register Identified User with Intercom in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript snippet demonstrates how to register a logged-in user with Intercom using `Intercom.registerIdentifiedUser()`. Providing a `userId` allows Intercom to associate user activities and messages with a specific, known user profile. ```javascript Intercom.registerIdentifiedUser({ userId: 'bob' }); ``` -------------------------------- ### Set Intercom Messenger Bottom Padding (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet sets the bottom padding for the Intercom messenger window. This is useful for adjusting the messenger's position to avoid overlapping with other UI elements, such as navigation bars. ```javascript Intercom.setBottomPadding(64); ``` -------------------------------- ### Set User Hash for Identity Validation in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript snippet illustrates how to set a user hash received from your backend for identity validation. This optional security measure ensures that user data sent to Intercom is legitimate and prevents unauthorized access or manipulation of user profiles. ```javascript Intercom.setUserHash(hash_received_from_backend) ``` -------------------------------- ### Handle Intercom Push Notifications with FirebaseMessagingService in Java Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This Java code extends `ReactNativeFirebaseMessagingService` to process Intercom push notifications. It checks if an incoming message is from Intercom and handles it using `IntercomPushClient`, otherwise it defers to the superclass for other FCM messages. This is crucial for applications already using FCM. ```java package com.YOUR_APP; import io.invertase.firebase.messaging.*; import android.content.Intent; import android.content.Context; import io.intercom.android.sdk.push.IntercomPushClient; import io.invertase.firebase.messaging.ReactNativeFirebaseMessagingService; import com.google.firebase.messaging.RemoteMessage; import android.util.Log; import java.util.Map; public class MainMessagingService extends ReactNativeFirebaseMessagingService { private static final String TAG = "MainMessagingService"; private final IntercomPushClient intercomPushClient = new IntercomPushClient(); @Override public void onMessageReceived(RemoteMessage remoteMessage) { Map message = remoteMessage.getData(); if (intercomPushClient.isIntercomPush(message)) { Log.d(TAG, "Intercom message received"); intercomPushClient.handlePush(getApplication(), message); } else { super.onMessageReceived(remoteMessage); } } } ``` -------------------------------- ### Send FCM Token to Intercom for Push Notifications (Android, React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet shows how to retrieve the Firebase Cloud Messaging (FCM) token and send it to Intercom. This is crucial for enabling push notifications for Android devices through Intercom. ```javascript Firebase.messaging().getToken() .then((token) => { console.log('Device FCM Token: ', token); Intercom.sendTokenToIntercom(token); }); ``` -------------------------------- ### Update User Attributes and Custom Data with Intercom in JavaScript Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This JavaScript code demonstrates how to update a user's predefined attributes and custom attributes after they have been registered. It allows you to send detailed user information, such as email, name, phone, companies, and custom key-value pairs, to Intercom for richer user profiles. ```javascript 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: [{ company_id: 'your company id', name: 'your company name' }], custom_attributes: { my_custom_attribute: 123 } }); ``` -------------------------------- ### Listen for Intercom Unread Conversation Count Changes (React Native) Source: https://github.com/tinycreative/react-native-intercom/blob/master/README.md This snippet demonstrates how to subscribe and unsubscribe to Intercom's unread conversation count notifications. It uses 'addEventListener' in 'componentDidMount' and 'removeEventListener' in 'componentWillUnmount' to manage the listener lifecycle, updating a state or performing actions based on the 'count'. ```javascript componentDidMount() { Intercom.addEventListener(Intercom.Notifications.UNREAD_COUNT, this._onUnreadChange) } componentWillUnmount() { Intercom.removeEventListener(Intercom.Notifications.UNREAD_COUNT, this._onUnreadChange); } _onUnreadChange = ({ count }) => { //... } ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.