Expo Config Plugin @intercom/intercom-react-native

An unofficial Expo config plugin for easily setting up React Native Intercom with expo dev clients

Installation

Prerequisites

Versions >= 1.10

• App project using Expo SDK 48.
• Installed expo-cli@4.4.4 or later.
• Installed @intercom/intercom-react-native@4.0.1
• For Android it Intercom requires compileSdkVersion and targetSdkVersion to be set on 33 or higher. expo-build-properties is used to set it

Versions < 1.10

• App project using Expo SDK 45.
• Installed expo-cli@4.4.4 or later.
• Installed @intercom/intercom-react-native@4.0.1
• For Android it Intercom requires compileSdkVersion and targetSdkVersion to be set on 33 or higher. expo-build-properties is used to set it

Versions < 1.3

• App project using Expo SDK 44.
• Installed expo-cli@4.4.4 or later.
• Installed @intercom/intercom-react-native

With expo install

expo install config-plugin-react-native-intercom expo-build-properties

Without expo install

# using yarn
yarn add config-plugin-react-native-intercom expo-build-properties
# using npm
npm install config-plugin-react-native-intercom expo-build-properties

Open your app.json and update your plugins section:

{
"plugins": [
[
"expo-build-properties",
{ "android": { "compileSdkVersion": 33, "targetSdkVersion": 33 } }
],
"config-plugin-react-native-intercom"
]
}

Configuration

The plugin needs your intercom api key so that it can communicate with the intercom application.

{
"plugins": [
[
"config-plugin-react-native-intercom",
{
"iosApiKey": "<your-api-key>",
"androidApiKey": "<your-api-key>",
"appId": "<your-app-id>"
}
]
]
}

Other configuration options

Add a custom photo usage description

{
"plugins": [
[
"config-plugin-react-native-intercom",
{
//..."iosPhotoUsageDescription": "Upload to support center"
}
]
]
}

Add EU Region support

On iOS Add to app.json

{
"ios": {
"infoPlist:":{
"IntercomRegion": "EU"
}
}
}

On Android

{
"plugins": [
[
"config-plugin-react-native-intercom",
{
//..."intercomEURegion": "true"
}
]
]
}

Enable push notifications

On iOS

{
"plugins": [
[
"config-plugin-react-native-intercom",
{
//..."isPushNotificationsEnabledIOS": true
}
]
]
}

On Android

{
"plugins": [
[
"config-plugin-react-native-intercom",
{
//..."isPushNotificationsEnabledAndroid": true,
"androidIcon": "<string>"//Customize the icon for intercom push notifications from the intercom default
}
]
]
}

Android push notifications

If you want push notifications to fire when new messages are sent in a conversation, it is necesssary to create a push notification channel for these. Push notifications for new conversations require no additoonal setup.

useEffect(()=>{if(Platform.OS==='android'){Notifications.setNotificationChannelAsync('intercom_chat_replies_channel',{name: 'Intercom Replies Channel',description: 'Channel for intercom replies',importance: Notifications.AndroidImportance.MAX,})}},[])

Building and running

You can either:

• use expo prebuild or expo run:android/expo run:ios to update your native projects,
• use EAS Build to build your development client.
  • Keep in mind that if you are using environment variables for androidApiKey, iosApiKey and appId in your app.config.js, you need to configure these secrets with eas secret:create or at Expo.

Contributing

Contributions are very welcome! The package uses expo-module-scripts for most tasks. You can find detailed information at this link.

Please make sure to run yarn build/yarn rebuild to update the build directory before pushing. The CI will fail otherwise.

Credits

• the Expo team

• https://github.com/expo/config-plugins

License

MIT