@prescrire/push_notifications

A react component for cordova-powered hybrid application handling push notifications

Usage no npm install needed!

<script type="module">
  import prescrirePushNotifications from 'https://cdn.skypack.dev/@prescrire/push_notifications';
</script>

README

Installation

Make sure all peer dependencies related to cordova have been installed in config.xml

Debug

iOS: http://localhost:[PORT] Android: http://10.0.2.2:[PORT]

Android settings

Credentials to access FCM:

<resource-file src="google-services.json" target="app/google-services.json" />

Icons for push notification (pay attention the name of the icon should be 'ic_push.png') :

<resource-file src="res/android/push/icon_24x24.png" target="app/src/main/res/drawable-mdpi/ic_push.png" />
<resource-file src="res/android/push/icon_36x36.png" target="app/src/main/res/drawable-hdpi/ic_push.png" />
<resource-file src="res/android/push/icon_48x48.png" target="app/src/main/res/drawable-xhdpi/ic_push.png" />
<resource-file src="res/android/push/icon_72x72.png" target="app/src/main/res/drawable-xxhdpi/ic_push.png" />
<resource-file src="res/android/push/icon_96x96.png" target="app/src/main/res/drawable-xxxhdpi/ic_push.png" />

UPD: it is not required:

<edit-config file="AndroidManifest.xml" mode="add" target="/manifest/application">
  <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/ic_push" />
</edit-config>

Set correct launch mode (this mode is required to correctly bring the app to foreground if the payload of the notification message is data):

<preference name="AndroidLaunchMode" value="singleTask" />.

Reference

Notification kinds

The app is in a certain state when it receives a notification. StateBackground if the app is in background, StateInactive if a user taps the notification from Notification Center, StateForeground if the app is in foreground. That is reflected by Push plugin in additionalData parameters: additionalData.coldstart and additionalData.foreground. coldstart stands for StateInactive. foreground stands for StateForeground and StateBackground.

Notification navigation

The app receives a notification only in two cases:

  • the app is in foreground
  • the app is in background and a user tapped a notification badge

The app doesn't receive a notification event if user opens the app without tapping the notification badge even if the notification center contains the notification.