Push Notifications

Overview

We are using Expo Push Notifications to send push notifications to your users.

Setup

Actually I handled this in codebase. If you interested, you can go to the @/hooks/usePushNotifications.ts file. With this hook, your user can get notifications in background, on lock screen, and in notification center automatically. You don’t need to do anything else but I want to give you some hints:
1

Go to your @/hooks/usePushNotifications file. You’ll see bunch of codes. But Important part is:
    const { expoPushToken, sendPushNotification, notification } = usePushNotification();
2

expoPushToken is your user’s push token. You can use this token to send push notifications to your user.
3

sendPushNotification is a function to send push notifications to your user.
4

notification is a hook to get the notification data.

Types

import * as Notifications from 'expo-notifications';

interface PushNotificationReturnType {
  expoPushToken: string | undefined;
  notification: Notifications.Notification | null;
  sendPushNotification: (expoPushToken: string) => Promise<void>;
}

Advanced

If you want to send advanced notifications, you should create Supabase Edge Functions. Let me tell you step by step. But I am not going to code this in this documentation. Because it is project specific.
1

I assumed you already set up Supabase and created your tables. Such as profiles, likes, comments, etc.
2

Go to Supabase Edge Function documentation. Which is: Supabase Edge Functions.
3

Click Get Started button and open your terminal.
    supabase init
You should have Supabase CLI installed. If you don’t have, follow the documentation.
4

Then you need to create a new Edge Function. Like:
    supabase functions new send-push-notification
5

Open your supabase/functions/send-push-notification folder. And you will see the index.ts file.
6

Now we need to integrate with Expo Push Notifications. You can follow this link: Sending Notifications
7

If you got stuck, you can watch this video:
8

Now you can use Edge Functions and send push notifications to your users.
Don’t forget to use webhooks.