notifications

App.js

@@ -1,11 +1,63 @@
 import { StatusBar } from 'expo-status-bar';
-import { useState, useRef } from 'react';
+import { useState, useRef, useEffect } from 'react';
 import { StyleSheet, Text, View, Button } from 'react-native';
+import * as Device from 'expo-device';
+import * as Notifications from 'expo-notifications';
 import Modal from "react-native-modal";
 
+
+
 export default function App() {
   const [modalVisible, setModalVisible] = useState(false);
+  const [expoPushToken, setExpoPushToken] = useState();
+  const [notification, setNotification] = useState();
+  useEffect(()=>{
+    registerForPushNotificationsAsync().catch((error) => {
+    console.log('There has been a problem with your fetch operation: ' + error.message);
+     // ADD THIS THROW error
+      throw error;
+    });
+    Notifications.setNotificationHandler({
+      handleNotification: async () => ({
+        shouldShowAlert: true,
+        shouldPlaySound: false,
+        shouldSetBadge: false,
+      }),
+    });
+    Notifications.addNotificationReceivedListener(() => setNotification(notification));
+    Notifications.addNotificationResponseReceivedListener((response) => console.log(response));
+  },[]);
 
+
+  registerForPushNotificationsAsync = async () => {
+    if (Device.isDevice) {
+      const { status: existingStatus } = await Notifications.getPermissionsAsync();
+      let finalStatus = existingStatus;
+      if (existingStatus !== 'granted') {
+        const { status } = await Notifications.requestPermissionsAsync();
+        finalStatus = status;
+      }
+      if (finalStatus !== 'granted') {
+        alert('Failed to get push token for push notification!');
+        return;
+      } else {
+        console.log(finalStatus)
+      }
+      const token = (await Notifications.getExpoPushTokenAsync()).data;
+      console.log(token);
+      setExpoPushToken(token);
+    } else {
+      alert('Must use physical device for Push Notifications');
+    }
+  
+    // if (Platform.OS === 'android') {
+    //   Notifications.setNotificationChannelAsync('default', {
+    //     name: 'default',
+    //     importance: Notifications.AndroidImportance.MAX,
+    //     vibrationPattern: [0, 250, 250, 250],
+    //     lightColor: '#FF231F7C',
+    //   });}
+  };
   return (
     <>
     {/* SWIPEABLE MODAL START */}
@@ -38,6 +90,7 @@ export default function App() {
 
         <Button title='ABCD' onPress={() => setModalVisible(true)} />
         <Button title='D' onPress={()=> {
+          console.log('D was clicked')
         }} />
         <Text>Open up App.js to start working on your app!</Text>
         <StatusBar style="auto" />

app.json

@@ -28,6 +28,11 @@
     },
     "web": {
       "favicon": "./assets/favicon.png"
+    },
+    "extra": {
+      "eas": {
+        "projectId": "0d400cb3-bf7c-4e8d-a3d8-3280bc4ab3f6"
+      }
     }
   }
 }

eas.json

@@ -0,0 +1,18 @@
+{
+  "cli": {
+    "version": ">= 2.4.0"
+  },
+  "build": {
+    "development": {
+      "developmentClient": true,
+      "distribution": "internal"
+    },
+    "preview": {
+      "distribution": "internal"
+    },
+    "production": {}
+  },
+  "submit": {
+    "production": {}
+  }
+}

notes.md

@@ -3,6 +3,10 @@ MODAL swipeable
 `npm install react-native-modal`
 
 
-FIREBASE
-`npm install firebase@9.2.0`
-`npm install firebase-messaging`
+EXPO NOTIFICATIONS
+
+npm install expo-device expo-notifications
+
+sudo npm install -g eas-cli
+eas login
+eas build:configure

package.json

@@ -10,6 +10,8 @@
   },
   "dependencies": {
     "expo": "~46.0.13",
+    "expo-device": "^4.3.0",
+    "expo-notifications": "^0.16.1",
     "expo-status-bar": "~1.4.0",
     "react": "18.0.0",
     "react-native": "0.69.6",