| Link | -Style | -
|---|---|
-
- Default Example
-
- |
-
-
- Default
-
- |
-
-
- Styled Example
-
- |
-
-
- Styled
-
- |
-
-
- Custom Example
-
- |
-
-
- Custom
-
- |
-
| Feature | -Description | -iOS | -Android | -
|---|---|---|---|
- Automatic Token Management
- |
- - Push notification tokens automatically sync to the Courier studio. - | -- ✅ - | -- ✅ - | -
- Notification Tracking
- |
- - Track if your users received or clicked your notifications even if your app is not runnning or open. - | -- ✅ - | -- ✅ - | -
- Permission Requests & Checking
- |
- - Simple functions to request and check push notification permission settings. - | -- ✅ - | -- ✅ - | -
| Requirement | -Reason | -
|---|---|
-
- Authentication
-
- |
- - Needs Authentication to sync push notification device tokens to the current user and Courier. - | -
-
- A Configured Provider
-
- |
- - Courier needs to know who to route the push notifications to so your users can receive them. - | -
| Provider | -iOS Token Sync | -Android Token Sync | -
|---|---|---|
-
- (APNS) - Apple Push Notification Service
-
- |
-
- Automatic
- |
-
- Not Supported
- |
-
-
- (FCM) - Firebase Cloud Messaging
-
- |
-
- Manual
- |
-
- Automatic
- |
-
-
- OneSignal
-
- |
-
- Manual
- |
-
- Manual
- |
-
-
- Expo
-
- |
-
- Manual
- |
-
- Manual
- |
-
| Requirement | -Reason | -
|---|---|
-
- Apple Developer Membership
-
- |
- - Apple requires all iOS developers to have a membership so you can manage your push notification certificates. - | -
| - A phyical iOS device - | -- Although you can setup the Courier SDK without a device, a physical device is the only way to fully ensure push notification tokens and notification delivery is working correctly. Simulators are not reliable. - | -
| Requirement | -Reason | -
|---|---|
-
- Firebase Account
-
- |
- - Needed to send push notifications out to your Android devices. Courier recommends you do this for the most ideal developer experience. - | -
| - A phyical Android device - | -- Although you can setup the Courier SDK without a physical device, a physical device is the best way to fully ensure push notification tokens and notification delivery is working correctly. Simulators are not reliable. - | -
| Provider | -Link | -
|---|---|
-
- (APNS) - Apple Push Notification Service
-
- |
-
-
- Testing Docs
-
- |
-
-
- (FCM) - Firebase Cloud Messaging
-
- |
-
-
- Testing Docs
-
- |
-
here
diff --git a/Docs/4_Preferences.md b/Docs/4_Preferences.md
deleted file mode 100644
index e9227f5..0000000
--- a/Docs/4_Preferences.md
+++ /dev/null
@@ -1,212 +0,0 @@
-| Requirement | -Reason | -
|---|---|
-
- Authentication
-
- |
- - Needed to view preferences that belong to a user. - | -
-
-
-```javascript
-import { CourierPreferencesView } from '@trycourier/courier-react-native';
-
-
-
-
-```javascript
-import { CourierPreferencesView } from '@trycourier/courier-react-native';
-
-const styles = {
- Fonts: {
- heading: Platform.OS === 'ios' ? 'Avenir Medium' : 'fonts/poppins_regular.otf',
- title: Platform.OS === 'ios' ? 'Avenir Medium' : 'fonts/poppins_regular.otf',
- subtitle: Platform.OS === 'ios' ? 'Avenir Medium' : 'fonts/poppins_regular.otf'
- },
- Colors: {
- heading: isDark ? '#9747FF' : '#9747FF',
- title: isDark ? '#FFFFFF' : '#000000',
- subtitle: isDark ? '#9A9A9A' : '#BEBEBE',
- option: isDark ? '#1F1F1F' : '#F0F0F0',
- action: isDark ? '#9747FF' : '#9747FF',
- },
- TextSizes: {
- heading: 24,
- title: 18,
- subtitle: 16,
- },
- Corners: {
- button: 100
- }
-}
-
-const theme = {
- brandId: 'ASDFASDF',
- sectionTitleFont: {
- family: styles.Fonts.heading,
- size: styles.TextSizes.heading,
- color: styles.Colors.heading
- },
- topicTitleFont: {
- family: styles.Fonts.title,
- size: styles.TextSizes.title,
- color: styles.Colors.title
- },
- topicSubtitleFont: {
- family: styles.Fonts.subtitle,
- size: styles.TextSizes.subtitle,
- color: styles.Colors.subtitle
- },
- topicButton: {
- font: {
- family: styles.Fonts.subtitle,
- size: styles.TextSizes.subtitle,
- color: styles.Colors.title
- },
- backgroundColor: styles.Colors.option,
- cornerRadius: styles.Corners.button
- },
- sheetTitleFont: {
- family: styles.Fonts.heading,
- size: styles.TextSizes.heading,
- color: styles.Colors.heading
- },
- infoViewStyle: {
- font: {
- family: styles.Fonts.title,
- size: styles.TextSizes.title,
- color: styles.Colors.title
- },
- button: {
- font: {
- family: styles.Fonts.subtitle,
- size: styles.TextSizes.subtitle,
- color: styles.Colors.action
- },
- backgroundColor: styles.Colors.title,
- cornerRadius: styles.Corners.button
- }
- },
- iOS: {
- topicCellStyles: {
- separatorStyle: 'none'
- },
- sheetSettingStyles: {
- font: {
- family: styles.Fonts.title,
- size: styles.TextSizes.title,
- color: styles.Colors.title
- },
- toggleColor: styles.Colors.action
- },
- sheetCornerRadius: 20,
- sheetCellStyles: {
- separatorStyle: 'none'
- }
- },
- android: {
- topicDividerItemDecoration: 'vertical',
- sheetDividerItemDecoration: 'vertical',
- sheetSettingStyles: {
- font: {
- family: styles.Fonts.title,
- size: styles.TextSizes.title,
- color: styles.Colors.title
- },
- toggleThumbColor: styles.Colors.action,
- toggleTrackColor: styles.Colors.option,
- }
- }
-}
-
-
-
-You can control your branding from the [`Courier Studio`](https://app.courier.com/designer/brands).
-
-| Supported Brand Styles | -Support | -
|---|---|
Primary Color |
- ✅ | -
Show/Hide Courier Footer |
- ✅ | -
here
-
-👋 `Preference APIs` can be found here
diff --git a/Docs/5_Client.md b/Docs/5_Client.md
deleted file mode 100644
index 560ce16..0000000
--- a/Docs/5_Client.md
+++ /dev/null
@@ -1,134 +0,0 @@
-> **Note**: These docs have moved to [courier.com/docs/sdk-libraries/react-native](https://www.courier.com/docs/sdk-libraries/react-native/). The content below may be outdated.
-
-# `CourierClient`
-
-Base layer Courier API wrapper.
-
-## Initialization
-
-Creating a client stores request authentication credentials only for that specific client. You can create as many clients as you'd like. See the "Going to Production" section here for more info.
-
-```typescript
-// Creating a client
-const client = new CourierClient({
- userId: "...", // Optional. Likely needed for your use case. See above for more authentication details
- showLogs: "...", // Optional. Defaults to your current BuildConfig
- jwt: "your_user_id",
- clientKey: "...", // Optional. Used only for Inbox
- tenantId: .., // Optional. Used for scoping a client to a specific tenant
- connectionId: "...", // Optional. Used for inbox websocket
- apiUrls: getCourierApiUrlsForRegion("eu"), // Optional. Use for EU-hosted workspaces
-});
-
-// Details about the client
-const options = client.options;
-
-// Remove the api client
-client.remove();
-```
-
-## Token Management APIs
-
-All available APIs for Token Management
-
-```typescript
-// To customize the device of the token being saved
-// You do not need this
-const device = {
- appId: "...", // Optional
- adId: "...", // Optional
- deviceId: "...", // Optional
- platform: "...", // Optional
- manufacturer: "...", // Optional
- model: "...", // Optional
-}
-
-await client.tokens.putUserToken({
- token: "...",
- provider: "firebase-fcm",
- device: device // Optional
-)
-
-// Deletes the token from Courier Token Management
-await client.tokens.deleteUserToken({
- token: "..."
-})
-```
-
-## Inbox APIs
-
-All available APIs for Inbox
-
-```typescript
-// Get all inbox messages
-// Includes the total count in the response
-const messages = await client.inbox.getMessages({
- paginationLimit: 123, // Optional
- startCursor: undefined, // Optional
-});
-
-// Returns only archived messages
-// Includes the total count of archived message in the response
-const archivedMessages = await client.inbox.getArchivedMessages({
- paginationLimit: 123, // Optional
- startCursor: undefined, // Optional
-});
-
-// Gets the number of unread messages
-const unreadCount = await client.inbox.getUnreadMessageCount();
-
-// Tracking messages
-await client.inbox.open({ messageId: "..." });
-await client.inbox.read({ messageId: "..." });
-await client.inbox.unread({ messageId: "..." });
-await client.inbox.archive({ messageId: "..." });
-await client.inbox.readAll();
-```
-
-## Preferences APIs
-
-All available APIs for Preferences
-
-```typescript
-// Get all the available preference topics
-const preferences = await client.preferences.getUserPreferences({
- paginationCursor: undefined // Optional
-});
-
-// Gets a specific preference topic
-const topic = await client.preferences.getUserPreferenceTopic({
- topicId: "..."
-});
-
-// Updates a user preference topic
-await client.preferences.putUserPreferenceTopic({
- topicId: "...",
- status: CourierUserPreferencesStatus.OptedIn,
- hasCustomRouting: true,
- customRouting: [CourierUserPreferencesChannel.DirectMessage]
-});
-```
-
-## Branding APIs
-
-All available APIs for Branding
-
-```typescript
-const brandRes = await client.brands.getBrand({
- brandId: "..."
-});
-```
-
-## URL Tracking APIs
-
-All available APIs for URL Tracking
-
-```swift
-// Pass a trackingUrl, usually found inside of a push notification payload or Inbox message
-// Tell which event happened.
-// All available events: .clicked, .delivered, .opened, .read, .unread
-await client.tracking.postTrackingUrl({
- url: "courier_tracking_url",
- event: CourierTrackingEvent.Clicked
-});
-```
diff --git a/Docs/6_Expo.md b/Docs/6_Expo.md
deleted file mode 100644
index c1c959e..0000000
--- a/Docs/6_Expo.md
+++ /dev/null
@@ -1,336 +0,0 @@
-> **Note**: These docs have moved to [courier.com/docs/sdk-libraries/react-native](https://www.courier.com/docs/sdk-libraries/react-native/). The content below may be outdated.
-
-# Expo
-
-This is how to using `CourierReactNative` in an Expo app.
-
-
-
-# iOS
-
-## Push Notifications
-
-If you want to automatically sync [`Push Notification`](https://github.com/trycourier/courier-react-native/blob/master/Docs/3_PushNotifications.md) tokens you will need to update your `AppDelegate` files.
-
-
-
-
-
-Swift
- -### 1. Add this file to your iOS Project - -```swift -import UIKit -import UserNotifications -import Courier_iOS -import React - -@objc class CourierExpoDelegate: NSObject, UNUserNotificationCenterDelegate { - - private var notificationPresentationOptions: UNNotificationPresentationOptions = [] - private var cachedMessage: [AnyHashable: Any]? - private var isReactNativeReady = false - - private let courierForegroundOptionsDidChangeNotification = Notification.Name("iosForegroundNotificationPresentationOptions") - - override init() { - super.init() - - // Set the user agent - Courier.agent = CourierAgent.reactNativeExpoIOS("5.6.7") - - // Register for remote notifications - UIApplication.shared.registerForRemoteNotifications() - - // Set notification center delegate - UNUserNotificationCenter.current().delegate = self - - // Observe notifications - NotificationCenter.default.addObserver( - self, - selector: #selector(notificationPresentationOptionsUpdate(_:)), - name: courierForegroundOptionsDidChangeNotification, - object: nil - ) - - NotificationCenter.default.addObserver( - self, - selector: #selector(onBridgeWillReload), - name: NSNotification.Name.RCTBridgeWillReload, - object: nil - ) - - NotificationCenter.default.addObserver( - self, - selector: #selector(onReactNativeReady(_:)), - name: NSNotification.Name.RCTContentDidAppear, - object: nil - ) - } - - // MARK: - React Native lifecycle - - /// Called when React Native is loaded and ready - @objc private func onReactNativeReady(_ note: Notification) { - isReactNativeReady = true - - // Flush any cached message - if let message = cachedMessage { - NotificationCenter.default.post( - name: Notification.Name("pushNotificationClicked"), - object: nil, - userInfo: message - ) - cachedMessage = nil - } - } - - /// Called when there is a reload in React Native - @objc private func onBridgeWillReload() { - isReactNativeReady = false - } - - // MARK: - Foreground options update - - @objc private func notificationPresentationOptionsUpdate(_ notification: Notification) { - if let userInfo = notification.userInfo, - let options = userInfo["options"] as? NSNumber { - notificationPresentationOptions = UNNotificationPresentationOptions(rawValue: options.uintValue) - } - } - - // MARK: - UNUserNotificationCenterDelegate - - /// User tapped on a notification - func userNotificationCenter(_ center: UNUserNotificationCenter, didReceive response: UNNotificationResponse, withCompletionHandler completionHandler: @escaping () -> Void) { - let content = response.notification.request.content - let message = content.userInfo - - // Track click event - Task { - await message.trackMessage(event: .clicked) - } - - let pushNotification = Courier.formatPushNotification(content: content) - - DispatchQueue.main.async { [weak self] in - guard let self = self else { return } - if self.isReactNativeReady { - NotificationCenter.default.post( - name: Notification.Name("pushNotificationClicked"), - object: nil, - userInfo: pushNotification - ) - } else { - self.cachedMessage = pushNotification - } - completionHandler() - } - } - - /// Notification delivered while app is in foreground - func userNotificationCenter(_ center: UNUserNotificationCenter, willPresent notification: UNNotification, withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void) { - let content = notification.request.content - let message = content.userInfo - - // Track delivery event - Task { - await message.trackMessage(event: .delivered) - } - - DispatchQueue.main.async { [weak self] in - guard let self = self else { return } - let pushNotification = Courier.formatPushNotification(content: content) - NotificationCenter.default.post( - name: Notification.Name("pushNotificationDelivered"), - object: nil, - userInfo: pushNotification - ) - completionHandler(self.notificationPresentationOptions) - } - } - - // MARK: - Push Registration - - @objc func application(_ application: UIApplication, didFailToRegisterForRemoteNotificationsWithError error: Error) { - print("[Courier] Failed to register for remote notifications: \(error.localizedDescription)") - } - - @objc func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) { - Task { @CourierActor in - Courier.setAPNSToken(deviceToken) - } - } - - deinit { - cachedMessage = nil - isReactNativeReady = false - NotificationCenter.default.removeObserver(self) - } -} -``` - -### 2. Update your `AppDelegate.swift` to add these lines - -```swift -@UIApplicationMain -public class AppDelegate: ExpoAppDelegate { - - .. - - // == ADD THIS LINE == - private let courierExpoDelegate = CourierExpoDelegate() - - .. - - // == ADD THIS LINE == - public override func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) { - courierExpoDelegate.application(application, didRegisterForRemoteNotificationsWithDeviceToken: deviceToken) - } - -} -``` - -
-
-
-#import
-#import
-#import
-
-@interface AppDelegate : EXAppDelegateWrapper
-
-// Add a property for the Courier delegate so we can forward calls
-@property (nonatomic, strong) CourierReactNativeDelegate *courierDelegate;
-
-@end
-```
-
-`AppDelegate.mm`
-
-```objc
-#import "AppDelegate.h"
-
-#import
-#import
-
-@implementation AppDelegate
-
-- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
-{
- self.moduleName = @"main";
- self.initialProps = @{};
-
- // Instantiate CourierReactNativeDelegate
- self.courierDelegate = [[CourierReactNativeDelegate alloc] init];
-
- return [super application:application didFinishLaunchingWithOptions:launchOptions];
-}
-
-#pragma mark - Push Notification Registration
-
-- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
-{
- // Forward to CourierReactNativeDelegate
- if ([self.courierDelegate respondsToSelector:@selector(application:didRegisterForRemoteNotificationsWithDeviceToken:)]) {
- [self.courierDelegate application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
- }
-
- // And call super to keep Expo / React Native happy
- [super application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
-}
-
-- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
-{
- // Forward to CourierReactNativeDelegate
- if ([self.courierDelegate respondsToSelector:@selector(application:didFailToRegisterForRemoteNotificationsWithError:)]) {
- [self.courierDelegate application:application didFailToRegisterForRemoteNotificationsWithError:error];
- }
-}
-
-#pragma mark - UNUserNotificationCenterDelegate
-
-// Called when a notification is delivered while the app is foregrounded
-- (void)userNotificationCenter:(UNUserNotificationCenter *)center
- willPresentNotification:(UNNotification *)notification
- withCompletionHandler:(void (^)(UNNotificationPresentationOptions))completionHandler
-{
- // Forward to CourierReactNativeDelegate
- if ([self.courierDelegate respondsToSelector:@selector(userNotificationCenter:willPresentNotification:withCompletionHandler:)]) {
- [self.courierDelegate userNotificationCenter:center
- willPresentNotification:notification
- withCompletionHandler:completionHandler];
- } else {
- // If the Courier delegate doesn't handle it, provide a default
- completionHandler(UNNotificationPresentationOptionNone);
- }
-}
-
-// Called when the user taps on a notification
-- (void)userNotificationCenter:(UNUserNotificationCenter *)center
-didReceiveNotificationResponse:(UNNotificationResponse *)response
- withCompletionHandler:(void (^)(void))completionHandler
-{
- // Forward to CourierReactNativeDelegate
- if ([self.courierDelegate respondsToSelector:@selector(userNotificationCenter:didReceiveNotificationResponse:withCompletionHandler:)]) {
- [self.courierDelegate userNotificationCenter:center
- didReceiveNotificationResponse:response
- withCompletionHandler:completionHandler];
- } else {
- completionHandler();
- }
-}
-
-..
-
-@end
-```
-
-
-
-# Android
-
-You must extend your `MainActivity` with `CourierReactNativeActivity`
-
-Kotlin
-```kotlin
-import com.courierreactnative.CourierReactNativeActivity;
-
-class MainActivity : CourierReactNativeActivity() {
- ..
-}
-```
-
-## Inbox
-
-Because Courier Inbox uses Android's Material theme and your app's styles as the default colors, you need to make sure your `styles.xml` theme parent extends `MaterialComponents`.
-
-In your `res/values/styles.xml` set the follow:
-
-```xml
-Objective C
- - - -`AppDelegate.h` - -```objc -#import| - | Feature | -Description | -
|---|---|---|
| - 1 - | -
-
- Authentication
-
- |
-
- Manages user credentials between app sessions. Required if you would like to use Courier Inbox and Push Notifications.
- |
-
| - 2 - | -
-
- Inbox
-
- |
- - An in-app notification center you can use to notify your users. Comes with a prebuilt UI and also supports fully custom UIs. - | -
| - 3 - | -
-
- Push Notifications
-
- |
- - Automatically manages push notification device tokens and gives convenient functions for handling push notification receiving and clicking. - | -
| - 4 - | -
-
- Preferences
-
- |
- - Allow users to update which types of notifications they would like to receive. - | -
| - 5 - | -
-
- CourierClient
-
- |
- - The base level API wrapper around the Courier endpoints. Useful if you have a highly customized user experience or codebase requirements. - | -
| Project Link | -
|---|
-
- Example (React Native 0.85+, New Architecture)
-
- |
-