pushologies-notifications
TypeScript icon, indicating that this package has built-in type declarations

0.3.1 • Public • Published

React Native Integration

Package Installation

Install the package using Yarn or NPM

  • Yarn
    yarn add pushologies-notifications
  • NPM
    npm install --save pushologies-notifications

(back to top)

Android Integration

  1. Generate and upload your certificate

  2. Add the following to your root level build.gradle file

    dependencies {
        ...
        classpath 'com.google.gms:google-services:4.3.15'
    }
  3. Add the following to your app level build.gradle file

    apply plugin: 'com.google.gms.google-services'
  4. Place the google-services.json got from Step 1 in the Android app folder ex: project-dir/android/app

  5. You have to integrate Firebase Service as explained here

  6. You must request the Notifications, Locations permissions for user to get the notifications and geofence notifications to come through. You can refer example code

        const requestNotificationPermission = async () => {
        const notificationPerm = PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS;
        const granted = PermissionsAndroid.RESULTS.GRANTED;
        try {
        const grantedPerm =
            (await PermissionsAndroid.requestMultiple([notificationPerm]))[
            notificationPerm
            ] === granted;
        console.log(`Notification Permisson: ${grantedPerm}\n`);
        return grantedPerm;
        } catch (err) {
        setResult('Error');
        console.warn(err);
        }
        return false;
    };
    
    const requestLocationPermissionAndroid = async () => {
        const finePerm = PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION;
        const bckgPerm = PermissionsAndroid.PERMISSIONS.ACCESS_BACKGROUND_LOCATION;
        const granted = PermissionsAndroid.RESULTS.GRANTED;
        try {
        const grantedFine =
            (await PermissionsAndroid.requestMultiple([finePerm]))[finePerm] ===
            granted;
        const grantedBckg =
            (await PermissionsAndroid.requestMultiple([bckgPerm]))[bckgPerm] ===
            granted;
        console.log(
            `Fine Location: ${grantedFine}\nBackground Location: ${grantedBckg}\n`,
        );
        return grantedFine && grantedBckg;
        } catch (err) {
        setResult('Error');
        console.warn(err);
        }
        return false;
    };
  7. There is no way you can initialise the SDK from the React native layer yet. So you need to initialise it in native side. You can get the API key and secret from the Pushologies portal. Initialise your SDK as follows in the Application class. Application class is usually found in this path: /android/app/src/main/java/com/project_name/MainApplication.java

    @Override
    public void onCreate() {
        super.onCreate();
        Log.i("PushSDKModule", "onCreate");
        PushSDKModule.initSDKWithPushSDKConfig(this,
                new PushSDKConfig(
                        <API KEY>,
                        <API SECRET>,
                        null,
                        null,
                        PushSDKConnectionType.WIFI,
                        true, true, true, 20,
                        R.drawable.your_large_icon,
                        R.drawable.your_small_icon,
                        R.drawable.your_icon_background_colour)
        );
        ...
    }
  8. You should start receiving the Pushologies notifications, Refer here for additional APIs

(back to top)

Android Firebase Service Integration

Broadly there are two ways you can handle Firebase notifications, One from the react native if you are using some react Native Firebase library, and another is to handle it in the native modules, Please do the following based on your needs.

  1. If you don't have your own FirebaseMessagingService implemented in the native Android module, you just have add the following to your AndroidManifest.xml

    <application>
        <service
            android:name="com.pushologies.pushologiesnotifications.PushSDKFirebaseService"
            android:exported="false">
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>
    </application>
  2. If you have your FirebaseMessagingService implemented and you're ok to inherit PushSDKFirebaseService, then you have to inherit

    class MyFirebaseService: PushSDKFirebaseService() {
        override fun onMessageReceived(remoteMessage: RemoteMessage) {
            super.onMessageReceived(remoteMessage)
        }
    
        override fun onNewToken(token: String) {
            super.onNewToken(token)
        }
    }

    and it your AndroidManifest.xml as follows

    <application>
    <service
        android:name=".MyFirebaseService"
        android:exported="false">
        <intent-filter>
            <action android:name="com.google.firebase.MESSAGING_EVENT" />
        </intent-filter>
    </service>
    </application>
  3. If you have your own FirebaseMessagingService implemented NOT okay to inherit PushSDKFirebaseService then you can do following in your service

    class MyFirebaseService: FirebaseMessagingService() {
        override fun onMessageReceived(remoteMessage: RemoteMessage) {
            super.onMessageReceived(remoteMessage)
            PushSDKModule.onFirebaseMessageReceived(remoteMessage)
        }
    }
  4. If you are using React Native solution for Firebase notification needs, then you have to pass the remote message down to PushSDKModule. with this method

    PushSDKModule.onFirebaseMessageReceived(data);

    The example code below illustrates that. Note that below example uses the third party package to show the usage.

     ```sh
     function configureFirebase() {
         messaging().setBackgroundMessageHandler(async remoteMessage => {
             var data = JSON.stringify(remoteMessage.data)
             PushSDKModule.onFirebaseMessageReceived(data);
         });
    
         messaging().onMessage(async remoteMessage => {
             var data = JSON.stringify(remoteMessage.data);
             console.log(`Push Message: ${data}`);
             PushSDKModule.onFirebaseMessageReceived(data);
         });
     }
    
    
    

iOS Integration

  1. Apple Developer Portal Configuration

  2. Pushologies Portal Configuraration

  3. Xcode Project Configuration

    • Follow the Steps mentioned in this guide
    • Make sure to apply those configuratons to proect-dir/ios/
    • Pod for the app target in the Podfile is not necesary. However you need to add it to your extensions
    • Make sure you correctly setup the NotificationServiceExtension and NotificationContentExtension as mentioned in the guide linked to the step
  4. You may have to rename your AppDelegate.mm to AppDelegate.m so that you don't get the compilation errors importing the @import pushologies_notifications

  5. Add following Push notifications delegates to your AppDelegate

    @import pushologies_notifications;
    
    ...
    
    - (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken {
        [PushSDKModule application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
    }
    
    - (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary * userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler {
        [PushSDKModule application:application didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
    }
    
    - (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error {
        [PushSDKModule application:application didFailToRegisterForRemoteNotificationsWithError:error];
    }
    
    - (void)application:(UIApplication *)application handleEventsForBackgroundURLSession:(NSString*)identifier completionHandler:(void (^)(void))completionHandler {
        [PushSDKModule application:application handleEventsForBackgroundURLSession:identifier completionHandler:completionHandler];
    }
    
  6. Initialise your SDK as follows in the AppDelegate class. ApppDelegate is usally found in ios/project_name/AppDelegate.m Also note that you must rename your AppDelegate.mm to AppDelegate.m for you to use @import pushologies_notifications; without any compilation errors

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
        self.moduleName = @"TestProject";
        // You can add your custom initial props in the dictionary below.
        // They will be passed down to the ViewController used by React Native.
        self.initialProps = @{};
        
        //Initialise the PushSDK here
        [PushSDKModule initPushSDK:<API KEY> secret:<API SECRET>];
    
        return [super application:application didFinishLaunchingWithOptions:launchOptions];
    }
  7. You should start receiving the Pushologies notifications, Refer here for additional APIs

(back to top)

Additional APIs

  • To subscribe and unsubscribe tags
    const subscribeTag = async () => {
        try {
            await PushSDKModule.subscribeTag(TAG);
        } catch {}
    };
    
    const unsubscribeTag = async () => {
        try {
            await PushSDKModule.unsubscribeTag(TAG);
        } catch {}
    };
  • To set and get customer id
    const setCustomerId = async () => {
        try {
            await PushSDKModule.setCustomerId(TAG);
        } catch {}
    };
    
    const getCustomerId = async () => {
        try {
            await PushSDKModule.getCustomerId();
        } catch {}
    };
  • To get the device id
    const getDeviceId = async () => {
        try {
            await PushSDKModule.getDeviceId(TAG);
        } catch {}
    };

(back to top)

Reference

Readme

Keywords

none

Package Sidebar

Install

npm i pushologies-notifications

Weekly Downloads

0

Version

0.3.1

License

MIT

Unpacked Size

50.5 kB

Total Files

16

Last publish

Collaborators

  • pushdev