react-native-newestapps-push

Getting Started

This package configures and handle in app settings for the device. So every time your application in installed in another device, it will generate unique ids and props for that device. All settings should be stored in user's account in the server, so you can use push notifications from server side with ease.

Also, this package is a MUST when using Newestapps-OfflineFirst structure, because it configure UUID for device, and proper sync times for every push and pull routines, that your app will run.

Requirements

• @react-native-firebase/app - Properly installed and setup for usage
• @react-native-firebase/messaging - Installed and linked in your app
• @react-native-community/async-storage - Installed and linked in your app
• react-native-uuid - Installed and linked in your app

Install all of them:

npm install @react-native-community/async-storage react-native-uuid @react-native-firebase/messaging --save

And run link when necessary:

npx react-native link @react-native-community/async-storage
npx react-native link @react-native-firebase/app
npx react-native link @react-native-firebase/messaging

Installation

Run npm install

npm install react-native-newestapps-push --save

*Note: you must have access to newestapps organization in Github, and SSH key configured in your own Github account.

Usage

You must encapsulate your "device" related features, in the PushProvider provided by this package.. See the example below

import { PushProvider } from 'react-native-newestapps-push';

export default function MyApp() => {

	return (
		<>

			<PushProvider>

				{/** My app components and children, here! */}

			</PushProvider>

		</>
	)
}

And in your children components, you can access the device information, using the hook useDevice

import { useDevice } from 'react-native-newestapps-push'

// ...

const [deviceUuid, devicePushToken] = useDevice();

// ...

In most cases, setting the provider in the right place, should work fine.. You only need device information, when syncing to the server, to provide a configuration for push notifications, and device Sync (if using a Newestapps-OfflineFirst structure)

Receiving Remote Messages from FCM

An event is emitted through DeviceEventEmitter, with key @Newestapps:Push:REMOTE_MESSAGE, all listeners added to your components that watch this event, will receve a remoteMessage (FOREGROUND ONLY)

Alternatively, we provide a component based alternative for this event watchers. See below:

import { MessageListener, RemoteMessage } from 'react-native-newestapps-push'

export default function DoSomethingAmazingWithPush() => {
	return (
		<>
			{/** ... My component code*/}

			<MessageListener
				onMessage={(remoteMessage: RemoteMessage) => {
					console.log('Just received this: ', remoteMessage);
				}}
			/>
		</>
	)
}