Push Notifications
If you need to receive events for push notifications and get the content (deeplink) of your push, you can do the following:
iOS
Install the push notification ios library in your project
"@react-native-community/push-notification-ios": "^1.12.0",
Also add the pod of this library to your podspec expo module file like so:
s.dependency 'RNCPushNotificationIOS'
Change your subscriber class to implement the required methods:
import ExpoModulesCore
import AppsPanelSDK
import UserNotifications
import RNCPushNotificationIOS
public class APSDKSubscriber: ExpoAppDelegateSubscriber, UNUserNotificationCenterDelegate {
required public init() {}
public func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
try? AppsPanel.shared.configure(
withAppName: "appName",
appKey: "appKey",
privateKey: "privateKey"
)
try? AppsPanel.shared.startSession()
UNUserNotificationCenter.current().delegate = self
PushNotificationManager.shared.registerForPushNotifications(application: application)
PushNotificationManager.shared.checkReceivedNotification(
launchOptions: launchOptions,
state: application.applicationState
)
return true
}
public func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
PushNotificationManager.shared.registerDevice(token: deviceToken)
}
public func userNotificationCenter(
_ center: UNUserNotificationCenter,
willPresent notification: UNNotification,
withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void
) {
PushNotificationManager.shared.manageNotification(
notification,
show: true,
state: UIApplication.shared.applicationState,
completionHandler: completionHandler
)
}
public func userNotificationCenter(
_ center: UNUserNotificationCenter,
didReceive response: UNNotificationResponse,
withCompletionHandler completionHandler: @escaping () -> Void
) {
let userInfo = response.notification.request.content.userInfo
RNCPushNotificationIOS.didReceiveRemoteNotification(userInfo)
completionHandler()
}
}
Android
On android you will need to send a event from the native side to the react native side.
First you need to make changes your Kotlin lifecyle listener class
package APSDK
import com.appspanel.APSDK
import com.appspanel.manager.conf.APLocalConfiguration
import android.app.Application
import expo.modules.core.interfaces.ApplicationLifecycleListener
import com.appspanel.APSDKInterface
import android.content.Context
import android.content.Intent
import android.util.Log
class APSDKApplicationLifecycleListener : ApplicationLifecycleListener, APSDKInterface {
private lateinit var applicationContext: Context
override fun onCreate(application: Application) {
applicationContext = application.applicationContext
Log.d("APSDKLifecycle", "onCreate - registering APSDKInterface")
// Your setup code in `Application.onCreate`.
APSDK.install(
application,
APLocalConfiguration(
"appName",
"appKey",
"privateKey"
),
this // ----> IMPORTANT TO REGISTER THIS CLASS AS THE LISTENER
)
}
// Method called when receiving a push notification
override fun onPushReceived(from: Context, e: Intent): Boolean {
val extras = e.extras
val data = mutableMapOf<String, Any?>()
extras?.keySet()?.forEach { key ->
data[key] = extras.get(key)?.toString()
}
APSDKModule.sendPushReceivedEvent(data)
return false
}
// Method called when pressing a push notification with a url.
override fun onDeepLinkReceived(s: String) {
APSDKModule.sendPushClickedEvent(mapOf("link" to s))
}
}
After this you need to create the implemented methods in your Module:
class APSDKModule : Module() {
companion object {
private var instance: APSDKModule? = null
fun sendPushClickedEvent(link: String) {
instance?.sendEvent("onDeepLink", mapOf("link" to link))
}
fun sendPushReceivedEvent(data: Map<String, Any?>) {
instance?.sendEvent("onPushReceived", data)
}
}
}
You also might need to register those events in module typescript declaration:
export type APSDKModuleEvents = {
onPushReceived: (params: any) => void;
onPushClicked: (link: string) => void;
};
React Native
Finally, implementation on the JS side is pretty straightforward, you can add all supported methods of the PushNotificationIOS library, and implement the two eventListeners we created for android.
If you need to do deep linking within your app, you can use Linking from React Native to open the url present in the push.
useEffect(() => {
const iOS = Platform.OS === 'ios'
if (iOS) {
PushNotificationIOS.addEventListener('notification', (notification) => {
console.log('ON REMOTE NOTIFICATION', JSON.stringify(notification?.getData()))
})
return () => {
PushNotificationIOS.removeEventListener('notification')
}
} else {
const onReceived = APSDK.addListener('onPushReceived', (data) => {
console.log('ON DEEP LINK', data)
})
const onClick = APSDK.addListener('onPushClicked', (link) => {
console.log('ON PUSH CLICKED', link)
})
return () => {
onReceived.remove()
onClick.remove()
}
}
}, [])Updated 3 days ago
