najvareactnative v0.0.1

najvaReactNative

ReactNative plugin for implementing NajvaSDK in your ReactNative application

Implementation guide

Here is a simple way to implement najva-ReactNative-plugin

Add plugin

First create libs folder at android/app then add Reactnativeplugin-1.0.0.aar at this.

Changes in your Android code

Add the following plugins to build.gradle in dependencies:

dependencies{
      implementation fileTree(dir: "libs", include: ["*.jar","*.aar"])   // notice that just add "*.aar"
      ...
      implementation 'com.google.firebase:firebase-core:9.0.0'
      implementation 'com.google.firebase:firebase-messaging:17.3.4'
      implementation 'com.google.android.gms:play-services-location:16.0.0'
      implementation 'com.najva.sdk:najva-android-sdk:1.0.6'
      implementation 'io.sentry:sentry-android:1.7.5'
      implementation 'com.android.volley:volley:1.1.1'
}

Add the following code in MainApplication.java:

    @Override
    protected List<ReactPackage> getPackages() {
      @SuppressWarnings("UnnecessaryLocalVariable")
      List<ReactPackage> packages = new PackageList(this).getPackages();
     
      packages.add(new CustomPackage()); // add this line
      
      return packages;
    }

Changes in your JavaScript code

To initialize Najva Push Notification Service you must add the following code in App.js :

    import React, {Component} from 'react';
    import {NativeModules,DeviceEventEmitter} from 'react-native';
    var Najva = NativeModules.NajvaModule;
    ...
    export default class App extends Component {
    	constructor(props) {
	    	super(props);
	    	
	    	Najva.initializeNajva(YOUR_CHAMPAIGN_ID,     
	    	                      YOUR_WEBSITE_ID,
	                              YOUR_API_KEY,
	    	                      LOCATION_ENABLED);
	    }
	}

Receive Data as JSON

Handle Users

you can send notification to certain users by using token, for this you should add the following code and handel token in App.js;

    import {DeviceEventEmitter} from 'react-native';
    ...
    export default class App extends Component {
    ...
        componentDidMount(){
        
	    	this.subscription = DeviceEventEmitter.addListener('userHandler',
	    	function(token) {
		    	// handle token
		    	console.log("REGISTER_TOKEN: " +token );// cna see token in log
		
		    });
	    }	
    
    }

now your App is ready to use Najva Push Notification Service!

Implementation without using the plugin code

this is another way to implementation Najva Push Notification Service If you don't want to use the Najva-ReactNative-plugin, you must implementation manualy. we'll help you to do better.

Changes in android file

Add the following plugins to build.gradle in dependencies:

dependencies{
      ...
      implementation 'com.google.firebase:firebase-core:9.0.0'
      implementation 'com.google.firebase:firebase-messaging:17.3.4'
      implementation 'com.google.android.gms:play-services-location:16.0.0'
      implementation 'com.najva.sdk:najva-android-sdk:1.0.6'
      implementation 'io.sentry:sentry-android:1.7.5'
      implementation 'com.android.volley:volley:1.1.1'
  }

Add the following code in MainApplication.java:

    @Override
    protected List<ReactPackage> getPackages() {
      @SuppressWarnings("UnnecessaryLocalVariable")
      List<ReactPackage> packages = new PackageList(this).getPackages();
     
      packages.add(new CustomPackage()); // add this line
      
      return packages;
    }

Create a java class and name it CustomPackage then implements ReactPackageand add the following code in it:

    import com.facebook.react.ReactPackage;
    import com.facebook.react.bridge.NativeModule;
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.uimanager.ViewManager;
    import java.util.ArrayList;
    import java.util.Collections;
    import java.util.List;
    import javax.annotation.Nonnull;

    public class CustomPackage implements ReactPackage {
        public CustomPackage() {
        }

        @Nonnull
        public List<NativeModule> createNativeModules(@Nonnull ReactApplicationContext reactContext) {
            List<NativeModule> modules = new ArrayList();
            modules.add(new CustomModule(reactContext));
            return modules;
        }

        @Nonnull
        public List<ViewManager> createViewManagers(@Nonnull ReactApplicationContext reactContext) {
            return Collections.emptyList();
        }
}

this class use to Register CustomModule that we'll talk about it later.

Create a java class and name it CustomMudole as your mudole, extents ReactContextBaseJavaModule and add the following code in it:

    import android.util.Log; 
    import com.facebook.react.bridge.ReactApplicationContext;
    import com.facebook.react.bridge.ReactContextBaseJavaModule;
    import com.facebook.react.bridge.ReactMethod;
    import com.najva.najvasdk.Class.Najva;
    import javax.annotation.Nonnull;

    public class InitializeModule extends ReactContextBaseJavaModule {
        public static final String TAG = "InitializeModule";

        public InitializeModule(@Nonnull ReactApplicationContext reactContext) {
            super(reactContext);
        }

        @Nonnull
        public String getName() {
            return "NajvaModule";
        }

        @ReactMethod
        public void initializeNajva(int YOUR_CHAMPAIGNID, int YOUR_WEBSITE_ID, String YOUR_APO-KEY, boolean LOCATION_ENABLED) {
            Najva.initialize(this.getCurrentActivity(),
            YOUR_CHAMPAIGNID,
            YOUR_WEBSITE_ID,
            YOUR_APO-KEY, 
            LOCATION_ENABLED);
            Log.i(TAG, "initializeNajva: ");
        }
}

ReactContextBaseJavaModule requires that a method called getName is implemented. The purpose of this method is to return the string name of the NajvaModule which represents this class in JavaScript. So here we will call this 'NajvaModule' so that we can access it through React.NativeModules.NajvaModule in JavaScript. To expose a method to JavaScript a Java method must be annotated using @ReactMethod. The return type of bridge methods is always void. React Native bridge is asynchronous, so the only way to pass a result to JavaScript is by using callbacks or emitting events

Changes in JavaScript

To initialize Najva Push Notification Service you must add the following code in App.js :

    import React, {Component} from 'react';
    import {NativeModules,DeviceEventEmitter} from 'react-native';
    var Najva = NativeModules.NajvaModule;
    ...
    export default class App extends Component {
    	constructor(props) {
	    	super(props);
	    	
	    	Najva.initializeNajva(YOUR_CHAMPAIGN_ID,     
	    	                      YOUR_WEBSITE_ID,
	                              YOUR_API_KEY,
	    	                      LOCATION_ENABLED);
	    }
	}

now your App is ready to use Najva Push Notification Service!