import { useState, useEffect, useRef } from "react"; import { Text, View, Button, Platform } from "react-native"; import * as Device from "expo-device"; import * as Notifications from "expo-notifications"; import Constants from "expo-constants"; import { Session } from "@supabase/supabase-js"; import { supabase } from "../lib/supabase"; Notifications.setNotificationHandler({ handleNotification: async () => ({ shouldShowAlert: true, shouldPlaySound: false, shouldSetBadge: false, }), }); // Can use this function below or use Expo's Push Notification Tool from: https://expo.dev/notifications async function sendPushNotification(expoPushToken: string) { const message = { to: expoPushToken, sound: "default", title: "Original Title", body: "And here is the body!", data: { someData: "goes here" }, }; await fetch("https://exp.host/--/api/v2/push/send", { method: "POST", headers: { Accept: "application/json", "Accept-encoding": "gzip, deflate", "Content-Type": "application/json", }, body: JSON.stringify(message), }); } async function registerForPushNotificationsAsync() { let token; if (Platform.OS === "android") { Notifications.setNotificationChannelAsync("default", { name: "default", importance: Notifications.AndroidImportance.MAX, vibrationPattern: [0, 250, 250, 250], lightColor: "#FF231F7C", }); } 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 ""; } token = await Notifications.getExpoPushTokenAsync({ projectId: Constants?.expoConfig?.extra?.eas.projectId, }); console.log(token); } else { alert("Must use physical device for Push Notifications"); } return token?.data ?? ""; } export default function Push({ session }: { session: Session }) { const [expoPushToken, setExpoPushToken] = useState(""); const [notification, setNotification] = useState(); const notificationListener = useRef(); const responseListener = useRef(); useEffect(() => { registerForPushNotificationsAsync().then(async (token) => { setExpoPushToken(token); const { error } = await supabase .from("profiles") .upsert({ id: session?.user.id, expo_push_token: token }); console.log(error); }); notificationListener.current = Notifications.addNotificationReceivedListener((notification) => { setNotification(notification); }); responseListener.current = Notifications.addNotificationResponseReceivedListener((response) => { console.log(response); }); return () => { Notifications.removeNotificationSubscription( notificationListener.current! ); Notifications.removeNotificationSubscription(responseListener.current!); }; }, []); return ( Your expo push token: {expoPushToken} Title: {notification && notification.request.content.title}{" "} Body: {notification && notification.request.content.body} Data:{" "} {notification && JSON.stringify(notification.request.content.data)}