Skip to main content
The AppDNA SDK provides a complete push notification module for registering device tokens, handling notification delivery, and tracking user interactions in React Native.

Platform Setup

Before using push notifications, configure the native push services for each platform:

iOS

  1. In Xcode, enable the Push Notifications capability under your target’s Signing & Capabilities tab.
  2. Generate an APNs authentication key (.p8 file) in the Apple Developer Portal.
  3. Upload the .p8 key to the AppDNA Console under Settings > Push > iOS Configuration.

Android

  1. Add your google-services.json file to the android/app directory.
  2. Upload the Firebase Server Key to the AppDNA Console under Settings > Push > Android Configuration.
Without the platform-specific push credentials uploaded to the Console, push notifications will not be delivered to your users.

Static Methods

The AppDNA class exposes top-level static methods for common push operations:

Set Token

Pass a device push token to the SDK manually:
await AppDNA.setPushToken("device-token-string");

Set Permission Status

Update the SDK with the current push permission status:
await AppDNA.setPushPermission(true);

Track Delivery

Track when a push notification is delivered to the device:
await AppDNA.trackPushDelivered("push-123");

Track Tap

Track when a user taps on a push notification, with an optional action identifier:
await AppDNA.trackPushTapped("push-123", "open_workout");

Push Module

Access the push module through the AppDNA.push property for advanced usage:
const push = AppDNA.push;

Module Methods

MethodSignatureDescription
setTokensetToken(token: string): Promise<void>Register a device push token
setPermissionsetPermission(granted: boolean): Promise<void>Update the push permission status
trackDeliveredtrackDelivered(pushId: string): Promise<void>Track notification delivery
trackTappedtrackTapped(pushId: string, action?: string): Promise<void>Track notification tap with optional action
requestPermissionrequestPermission(): Promise<boolean>Request push permission from the user
getTokengetToken(): Promise<string | null>Returns the current device token, or null
setDelegatesetDelegate(delegate: AppDNAPushDelegate): voidSet a delegate for push notification callbacks

Request Permission

Request push notification permission from the user. This presents the system permission dialog:
const granted = await AppDNA.push.requestPermission();

if (granted) {
  console.log("Push permission granted");
} else {
  console.log("Push permission denied");
}

Get Current Token

Retrieve the current device push token:
const token = await AppDNA.push.getToken();
if (token) {
  console.log("Current token:", token);
}

AppDNAPushDelegate

Set a delegate to receive push notification lifecycle callbacks:
interface AppDNAPushDelegate {
  onPushTokenRegistered(token: string): void;
  onPushReceived(notification: Record<string, unknown>, inForeground: boolean): void;
  onPushTapped(notification: Record<string, unknown>, actionId?: string): void;
}

Example Implementation

AppDNA.push.setDelegate({
  onPushTokenRegistered(token: string) {
    console.log("Token registered:", token);
  },

  onPushReceived(notification: Record<string, unknown>, inForeground: boolean) {
    if (inForeground) {
      // Show in-app notification banner
      showBanner(notification.title, notification.body);
    }
  },

  onPushTapped(notification: Record<string, unknown>, actionId?: string) {
    if (actionId) {
      // Handle custom action
      handleAction(actionId);
    }
  },
});

Standalone AppDNAPush Class

For a more React-idiomatic approach, use the standalone AppDNAPush class with callback-based listeners:
import { AppDNAPush } from '@appdna/react-native-sdk';

Methods

MethodSignatureDescription
requestPermissionrequestPermission(): Promise<boolean>Request push permission from the user
onPushReceivedonPushReceived(callback: (payload: PushPayload) => void): () => voidListen for received notifications
onPushTappedonPushTapped(callback: (payload: PushPayload) => void): () => voidListen for notification taps

Example with Listeners

import { AppDNAPush } from '@appdna/react-native-sdk';

// Request permission
const granted = await AppDNAPush.requestPermission();

// Listen for received push notifications
const unsubReceived = AppDNAPush.onPushReceived((payload) => {
  console.log("Push received:", payload.title);
});

// Listen for push notification taps
const unsubTapped = AppDNAPush.onPushTapped((payload) => {
  console.log("Push tapped:", payload.push_id);
  if (payload.action_value) {
    navigateTo(payload.action_value);
  }
});

// Clean up listeners when component unmounts
unsubReceived();
unsubTapped();
Always call the unsubscribe function returned by onPushReceived and onPushTapped when the component unmounts to prevent memory leaks.

PushPayload

The PushPayload type contains the notification content:
PropertyTypeDescription
push_idstringUnique identifier for the notification
titlestringNotification title
bodystringNotification body text
image_urlstring | undefinedURL to a rich notification image
dataRecord<string, unknown> | undefinedCustom data payload
action_typestring | undefinedAction type (e.g., “deep_link”, “url”)
action_valuestring | undefinedAction value (e.g., a URL or screen ID)

NativeEventEmitter Events

The SDK emits the following events through React Native’s NativeEventEmitter:
EventPayloadTriggered When
onPushTokenRegistered{ token: string }Device token is successfully registered
onPushReceivedPushPayload & { inForeground: boolean }A push notification is received
onPushTappedPushPayload & { actionId?: string }User taps on a push notification
You do not need to subscribe to NativeEventEmitter events directly. The AppDNAPush class and delegate interface handle event bridging for you. Use the native events only if you need custom low-level handling.

Auto-Tracked Events

The SDK automatically tracks the following push-related events:
EventTriggered When
push_token_registeredDevice token is successfully registered
push_permission_grantedUser grants push permission
push_permission_deniedUser denies push permission
push_deliveredA push notification is delivered
push_tappedUser taps on a push notification
Auto-tracked events are sent alongside any manually tracked events. You do not need to track these events yourself.

Full Example

import { useEffect } from 'react';
import { AppDNA, AppDNAPush } from '@appdna/react-native-sdk';

function App() {
  useEffect(() => {
    async function setupPush() {
      // Configure the SDK
      await AppDNA.configure("adn_live_xxx", "production");

      // Set delegate for lifecycle callbacks
      AppDNA.push.setDelegate({
        onPushTokenRegistered(token) {
          console.log("Token:", token);
        },
        onPushReceived(notification, inForeground) {
          if (inForeground) {
            showInAppBanner(notification);
          }
        },
        onPushTapped(notification, actionId) {
          handleDeepLink(notification, actionId);
        },
      });

      // Request permission
      const granted = await AppDNA.push.requestPermission();
      console.log("Push permission:", granted);
    }

    setupPush();
  }, []);

  // Listener-based approach for component-scoped handling
  useEffect(() => {
    const unsubReceived = AppDNAPush.onPushReceived((payload) => {
      console.log("Received:", payload.title);
    });

    const unsubTapped = AppDNAPush.onPushTapped((payload) => {
      console.log("Tapped:", payload.push_id);
    });

    return () => {
      unsubReceived();
      unsubTapped();
    };
  }, []);

  return <MainNavigator />;
}