Merge branch 'master' of github.com:evollu/react-native-fcm

Examples/simple-fcm-client/android/app/build.gradle

@@ -127,9 +127,15 @@ android {
 }
 
 dependencies {
+    compile(project(':react-native-maps')) {
+        exclude group: 'com.google.android.gms', module: 'play-services-base'
+        // This resolution make compiler ignoring play-service-base's version requirement in react-native-maps
+        // so that it only read from react-native-fcm
+        // you can also lock the version in this gradle file and ignore all module declaration
+        // or you can use ResolutionStragety
+    }
     compile project(':react-native-fcm')
     compile fileTree(dir: "libs", include: ["*.jar"])
-    compile "com.android.support:appcompat-v7:23.0.1"
     compile "com.facebook.react:react-native:+"  // From node_modules
 }
 

Examples/simple-fcm-client/android/app/src/main/java/com/google/firebase/quickstart/fcm/MainActivity.java

@@ -1,5 +1,7 @@
 package com.google.firebase.quickstart.fcm;
 
+import android.content.Intent;
+
 import com.facebook.react.ReactActivity;
 
 public class MainActivity extends ReactActivity {
@@ -12,4 +14,11 @@ public class MainActivity extends ReactActivity {
     protected String getMainComponentName() {
         return "SimpleFcmClient";
     }
+
+    @Override
+    public void onNewIntent(Intent intent) {
+        super.onNewIntent(intent);
+        setIntent(intent);
+    }
+
 }

Examples/simple-fcm-client/android/app/src/main/java/com/google/firebase/quickstart/fcm/MainApplication.java

@@ -4,6 +4,7 @@
 import android.util.Log;
 
 import com.facebook.react.ReactApplication;
+import com.airbnb.android.react.maps.MapsPackage;
 import com.evollu.react.fcm.FIRMessagingPackage;
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactNativeHost;
@@ -25,6 +26,7 @@ public boolean getUseDeveloperSupport() {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new MainReactPackage(),
+            new MapsPackage(),
             new FIRMessagingPackage()
       );
     }

Examples/simple-fcm-client/android/settings.gradle

@@ -1,4 +1,6 @@
 rootProject.name = 'SimpleFcmClient'
+include ':react-native-maps'
+project(':react-native-maps').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-maps/lib/android')
 
 include ':app'
 include ':react-native-fcm'

Examples/simple-fcm-client/app/App.js

@@ -11,17 +11,20 @@ import {
   TouchableOpacity,
   View,
   Clipboard,
-  Platform
+  Platform,
+  ScrollView
 } from 'react-native';
 
-import FCM from "react-native-fcm";
+import { StackNavigator } from 'react-navigation';
+
+import FCM, {NotificationActionType} from "react-native-fcm";
 
 import {registerKilledListener, registerAppListener} from "./Listeners";
 import firebaseClient from  "./FirebaseClient";
 
 registerKilledListener();
 
-export default class App extends Component {
+class MainPage extends Component {
   constructor(props) {
     super(props);
 
@@ -32,11 +35,16 @@ export default class App extends Component {
   }
 
   async componentDidMount(){
-    registerAppListener();
+    registerAppListener(this.props.navigation);
     FCM.getInitialNotification().then(notif => {
       this.setState({
         initNotif: notif
       })
+      if(notif && notif.targetScreen === 'detail'){
+        setTimeout(()=>{
+          this.props.navigation.navigate('Detail')
+        }, 500)
+      }
     });
 
     try{
@@ -55,20 +63,37 @@ export default class App extends Component {
         console.log("APNS TOKEN (getFCMToken)", token);
       });
     }
+
+	  // topic example
+	  // FCM.subscribeToTopic('sometopic')
+	  // FCM.unsubscribeFromTopic('sometopic')
   }
 
   showLocalNotification() {
     FCM.presentLocalNotification({
-      vibrate: 500,
-      title: 'Hello',
-      body: 'Test Notification',
-      big_text: 'i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large, i am large',
-      priority: "high",
-      sound: "bell.mp3",
-      large_icon: "https://image.freepik.com/free-icon/small-boy-cartoon_318-38077.jpg",
-      show_in_foreground: true,
-      group: 'test',
-      number: 10
+      id: new Date().valueOf().toString(),                // (optional for instant notification)
+      title: "Test Notification with action",             // as FCM payload
+      body: "Force touch to reply",                       // as FCM payload (required)
+      sound: "bell.mp3",                                  // "default" or filename
+      priority: "high",                                   // as FCM payload
+      click_action: "com.myapp.MyCategory",               // as FCM payload - this is used as category identifier on iOS.
+      badge: 10,                                          // as FCM payload IOS only, set 0 to clear badges
+      number: 10,                                         // Android only
+      ticker: "My Notification Ticker",                   // Android only
+      auto_cancel: true,                                  // Android only (default true)
+      large_icon: "https://image.freepik.com/free-icon/small-boy-cartoon_318-38077.jpg",                           // Android only
+      icon: "ic_launcher",                                // as FCM payload, you can relace this with custom icon you put in mipmap
+      big_text: "Show when notification is expanded",     // Android only
+      sub_text: "This is a subText",                      // Android only
+      color: "red",                                       // Android only
+      vibrate: 300,                                       // Android only default: 300, no vibration if you pass 0
+      wake_screen: true,                                  // Android only, wake up screen when notification arrives
+      group: "group",                                     // Android only
+      picture: "https://google.png",                      // Android only bigPicture style
+      ongoing: true,                                      // Android only
+      my_custom_data:'my_custom_field_value',             // extra data you want to throw
+      lights: true,                                       // Android only, LED blinking (default false)
+      show_in_foreground: true                           // notification when app is in foreground (local & remote)
     });
   }
 
@@ -84,7 +109,9 @@ export default class App extends Component {
       large_icon: "https://image.freepik.com/free-icon/small-boy-cartoon_318-38077.jpg",
       show_in_foreground: true,
       picture: 'https://firebase.google.com/_static/af7ae4b3fc/images/firebase/lockup.png',
-      wake_screen: true
+      wake_screen: true,
+      extra1: {a: 1},
+      extra2: 1
     });
   }
 
@@ -97,10 +124,11 @@ export default class App extends Component {
       	"data":{
 					"custom_notification": {
 						"title": "Simple FCM Client",
-						"body": "This is a notification with only NOTIFICATION.",
+						"body": "Click me to go to detail",
 						"sound": "default",
 						"priority": "high",
-						"show_in_foreground": true
+            "show_in_foreground": true,
+            targetScreen: 'detail'
         	}
     		},
     		"priority": 10
@@ -110,9 +138,12 @@ export default class App extends Component {
 				"to": token,
 				"notification":{
 					"title": "Simple FCM Client",
-					"body": "This is a notification with only NOTIFICATION.",
+					"body": "Click me to go to detail",
 					"sound": "default"
-				},
+        },
+        data: {
+          targetScreen: 'detail'
+        },
 				"priority": 10
 			}
 		}
@@ -134,41 +165,33 @@ export default class App extends Component {
     firebaseClient.send(JSON.stringify(body), "data");
   }
 
-  sendRemoteNotificationWithData(token) {
-    let body = {
-      "to": token,
-      "notification":{
-    		"title": "Simple FCM Client",
-    		"body": "This is a notification with NOTIFICATION and DATA (NOTIF).",
-				"sound": "default"
-    	},
-    	"data":{
-    		"hello": "there"
-    	},
-    	"priority": "high"
-    }
-
-    firebaseClient.send(JSON.stringify(body), "notification-data");
+  showLocalNotificationWithAction() {
+    FCM.presentLocalNotification({
+      title: 'Test Notification with action',
+      body: 'Force touch to reply',
+      priority: "high",
+      show_in_foreground: true,
+      click_action: "com.myidentifi.fcm.text", // for ios
+      android_actions: JSON.stringify([{
+        id: "view",
+        title: 'view'
+      },{
+        id: "dismiss",
+        title: 'dismiss'
+      }]) // for android, take syntax similar to ios's. only buttons are supported
+    });
   }
 
   render() {
     let { token, tokenCopyFeedback } = this.state;
 
     return (
       <View style={styles.container}>
+      <ScrollView style={{paddingHorizontal: 20}}>
         <Text style={styles.welcome}>
           Welcome to Simple Fcm Client!
         </Text>
 
-        <Text>
-          Init notif: {JSON.stringify(this.state.initNotif)}
-
-        </Text>
-
-        <Text selectable={true} onPress={() => this.setClipboardContent(this.state.token)} style={styles.instructions}>
-          Token: {this.state.token}
-        </Text>
-
         <Text style={styles.feedback}>
           {this.state.tokenCopyFeedback}
         </Text>
@@ -185,17 +208,32 @@ export default class App extends Component {
           <Text style={styles.buttonText}>Send Remote Data</Text>
         </TouchableOpacity>
 
-        <TouchableOpacity onPress={() => this.sendRemoteNotificationWithData(token)} style={styles.button}>
-          <Text style={styles.buttonText}>Send Remote Notification With Data</Text>
+        <TouchableOpacity onPress={() => this.showLocalNotification()} style={styles.button}>
+          <Text style={styles.buttonText}>Show Local Notification</Text>
         </TouchableOpacity>
 
-        <TouchableOpacity onPress={() => this.showLocalNotification()} style={styles.button}>
-          <Text style={styles.buttonText}>Send Local Notification</Text>
+        <TouchableOpacity onPress={() => this.showLocalNotificationWithAction(token)} style={styles.button}>
+          <Text style={styles.buttonText}>Show Local Notification with Action</Text>
         </TouchableOpacity>
 
         <TouchableOpacity onPress={() => this.scheduleLocalNotification()} style={styles.button}>
           <Text style={styles.buttonText}>Schedule Notification in 5s</Text>
         </TouchableOpacity>
+
+        <Text style={styles.instructions}>
+          Init notif:
+        </Text>
+        <Text>
+          {JSON.stringify(this.state.initNotif)}
+        </Text>
+
+        <Text style={styles.instructions}>
+          Token:
+        </Text>
+        <Text selectable={true} onPress={() => this.setClipboardContent(this.state.token)}>
+          {this.state.token}
+        </Text>
+        </ScrollView>
       </View>
     );
   }
@@ -211,6 +249,25 @@ export default class App extends Component {
   }
 }
 
+class DetailPage extends Component {
+  render(){
+    return <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
+      <Text>Detail page</Text>
+    </View>
+  }
+}
+
+export default StackNavigator({
+  Main: {
+    screen: MainPage,
+  },
+  Detail: {
+    screen: DetailPage
+  }
+}, {
+  initialRouteName: 'Main',
+});
+
 const styles = StyleSheet.create({
   container: {
     flex: 1,
@@ -236,8 +293,8 @@ const styles = StyleSheet.create({
   button: {
     backgroundColor: "teal",
     paddingHorizontal: 20,
-    paddingVertical: 10,
-    marginVertical: 15,
+    paddingVertical: 15,
+    marginVertical: 10,
     borderRadius: 10
   },
   buttonText: {