Added simple notifications

Examples/simple-fcm-client/.gitignore

@@ -43,3 +43,4 @@ android/keystores/debug.keystore
 # FCM
 ios/SimpleFcmClient/GoogleService-Info.plist
 android/app/google-services.json
+app/FirebaseConstants.js

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

+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ * @flow
+ */
+
+import React, { Component } from 'react';
+import {
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  View
+} from 'react-native';
+
+import PushController from "./PushController";
+import firebaseClient from  "./FirebaseClient";
+
+export default class App extends Component {
+  render() {
+    return (
+      <View style={styles.container}>
+        <PushController />
+        <Text style={styles.welcome}>
+          Welcome to Simple Fcm Client!
+        </Text>
+
+        <TouchableOpacity onPress={() => firebaseClient.sendNotification()} style={styles.button}>
+          <Text style={styles.buttonText}>Send Notification</Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity onPress={() => firebaseClient.sendData()} style={styles.button}>
+          <Text style={styles.buttonText}>Send Data</Text>
+        </TouchableOpacity>
+      </View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#F5FCFF',
+  },
+  welcome: {
+    fontSize: 20,
+    textAlign: 'center',
+    margin: 10,
+  },
+  instructions: {
+    textAlign: 'center',
+    color: '#333333',
+    marginBottom: 5,
+  },
+  button: {
+    backgroundColor: "teal",
+    paddingHorizontal: 20,
+    paddingVertical: 10,
+    marginVertical: 5,
+    borderRadius: 10
+  },
+  buttonText: {
+    color: "white",
+    backgroundColor: "transparent"
+  },
+});

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

+import FirebaseConstants from "./FirebaseConstants";
+
+const API_URL = "https://fcm.googleapis.com/fcm/send";
+
+class FirebaseClient {
+
+  sendNotification() {
+    let body = {
+    	"to": FirebaseConstants.TO,
+    	"notification":{
+    		"icon": "appLogo",
+    		"title": "Notification Title",
+    		"body": "Notification Body",
+    		"sound": "default",
+    		"click_action": "fcm.ACTION.HELLO"
+    	},
+    	"priority": 10
+    }
+
+    this._send(JSON.stringify(body), "notification");
+  }
+
+  sendData() {
+    let body = {
+    	"to": FirebaseConstants.TO,
+      "data":{
+    		"icon": "appLogo",
+    		"title": "Notification Title",
+    		"body": "Notification Body",
+    		"sound": "default",
+    		"click_action": "fcm.ACTION.HELLO"
+    	},
+    	"priority": 10
+    }
+
+    this._send(JSON.stringify(body), "data");
+  }
+
+  _send(body, type) {
+  	let headers = new Headers({
+  		"Content-Type": "application/json",
+  		"Content-Length": parseInt(body.length),
+      "Authorization": "key=" + FirebaseConstants.KEY
+  	});
+
+  	fetch(API_URL, { method: "POST", headers, body })
+  		.then(response => console.log("Send " + type + " response", response))
+  		.catch(error => console.log("Error sending " + type, error));
+  }
+
+}
+
+let firebaseClient = new FirebaseClient();
+export default firebaseClient;

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

+import React, { Component } from "react";
+
+import FCM from "react-native-fcm";
+
+export default class PushController extends Component {
+  componentDidMount() {
+    FCM.requestPermissions();
+
+    FCM.getFCMToken().then(token => {
+      console.log("TOKEN (getFCMToken)", token);
+    });
+
+    FCM.getInitialNotification().then(notif => {
+      console.log("INITIAL NOTIFICATION", notif)
+    });
+
+    this.notificationUnsubscribe = FCM.on("notification", notif => {
+      console.log("Notification", notif);
+    });
+
+    this.refreshUnsubscribe = FCM.on("refreshToken", token => {
+      console.log("TOKEN (refreshUnsubscribe)", token);
+    });
+  }
+
+  componentWillUnmount() {
+    this.refreshUnsubscribe();
+    this.notificationUnsubscribe();
+  }
+
+
+  render() {
+    return null;
+  }
+}

Examples/simple-fcm-client/index.android.js

@@ -12,42 +12,12 @@ import {
   View
 } from 'react-native';
 
+import App from "./app/App";
+
 export default class SimpleFcmClient extends Component {
   render() {
-    return (
-      <View style={styles.container}>
-        <Text style={styles.welcome}>
-          Welcome to React Native!
-        </Text>
-        <Text style={styles.instructions}>
-          To get started, edit index.android.js
-        </Text>
-        <Text style={styles.instructions}>
-          Double tap R on your keyboard to reload,{'\n'}
-          Shake or press menu button for dev menu
-        </Text>
-      </View>
-    );
+    return (<App />);
   }
 }
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: '#F5FCFF',
-  },
-  welcome: {
-    fontSize: 20,
-    textAlign: 'center',
-    margin: 10,
-  },
-  instructions: {
-    textAlign: 'center',
-    color: '#333333',
-    marginBottom: 5,
-  },
-});
-
 AppRegistry.registerComponent('SimpleFcmClient', () => SimpleFcmClient);

Examples/simple-fcm-client/index.ios.js

@@ -12,42 +12,12 @@ import {
   View
 } from 'react-native';
 
+import App from "./app/App";
+
 export default class SimpleFcmClient extends Component {
   render() {
-    return (
-      <View style={styles.container}>
-        <Text style={styles.welcome}>
-          Welcome to React Native!
-        </Text>
-        <Text style={styles.instructions}>
-          To get started, edit index.ios.js
-        </Text>
-        <Text style={styles.instructions}>
-          Press Cmd+R to reload,{'\n'}
-          Cmd+D or shake for dev menu
-        </Text>
-      </View>
-    );
+    return (<App />);
   }
 }
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: '#F5FCFF',
-  },
-  welcome: {
-    fontSize: 20,
-    textAlign: 'center',
-    margin: 10,
-  },
-  instructions: {
-    textAlign: 'center',
-    color: '#333333',
-    marginBottom: 5,
-  },
-});
-
 AppRegistry.registerComponent('SimpleFcmClient', () => SimpleFcmClient);