Skip to Content
DocumentationGuidesPush Notification

Push Notification

The AppCatalyst RN Starter Kit includes a simple utility for sending local push notifications using the expo-notifications library.

And It can be getting notifications from a remote server using services like OneSignal  or Firebase Cloud Messaging (FCM) .

🔔 Notification Sender (sender.ts)

The sendNotification function provides a simplified, synchronous interface for instantly sending a local notification within your Expo application. It uses the expo-notifications library to fire a notification with a full range of custom options, including sound, attachments, and platform-specific settings.

🚀 Usage

This function is intended for local testing and debugging of your notification display logic and UI.

Before sending any notification, you must first request and verify that the user has granted the necessary permissions using the useNotificationPermissions hook.

import { useNotificationPermissions } from '@/hooks/useNotificationPermissions';
import { sendNotification } from '@/lib/notification/sender';
 
const TestNotificationButton = () => {
  // 1. Get current permission status and the request function
  const { isGranted, requestPermissions } = useNotificationPermissions();
 
  const handleSend = async () => {
    if (!isGranted) {
      // 2. Request permissions if not yet granted
      await requestPermissions();
    }
 
    if (isGranted) {
      // 3. Send the notification payload
      sendNotification({
        title: 'AppCatalyst RN',
        body: 'Main body content of the notification',
        // Full ExpoNotificationContent payload is supported
        ios: {
          sound: 'default',
          interruptionLevel: 'timeSensitive',
          attachments: [
            {
              url: 'https://images.unsplash.com/photo-1484557052118-f32bd25b45b5?q=80&w=1024&auto=format&fit=crop',
            },
          ],
        },
      })
        .then((id) => console.log('Notification sent with ID:', id))
        .catch(console.error);
    }
  };
 
  return <Button title='Send Test Notification' onPress={handleSend} />;
};
NavigationState Management