React Native Push Notification

import React, { useEffect } from "react";
import {
  initialize,
  initializeEventHandler,
  registerForRemoteNotifications,
  setOnRetenoPushReceivedListener,
  setOnRetenoPushClickedListener,
} from "reteno-react-native-sdk";

useEffect(() => {
  let listeners: Array<{ remove: () => void }> = [];

  const bootstrap = async () => {
    // 1. Initialize
    await initialize({
      apiKey: "YOUR_SDK_ACCESS_KEY",
    });

    // 2. Register all listeners BEFORE flushing the queue
    listeners = [
      setOnRetenoPushReceivedListener((event) => {
        // ...
      }),
      setOnRetenoPushClickedListener((event) => {
        // ...
      }),
    ];

    // 3. Flush queued events and start live delivery — call once
    initializeEventHandler();

    // 4. Ask for the push token
    await registerForRemoteNotifications();
  };

  bootstrap();

  return () => listeners.forEach((l) => l?.remove());
}, []);

await initialize({
  apiKey: "YOUR_SDK_ACCESS_KEY",
  iosDeviceTokenHandlingMode: "manual",
});

import React, { useCallback, useEffect } from "react";

import { Alert } from "react-native";
import { setOnRetenoPushReceivedListener } from "reteno-react-native-sdk";

const onRetenoPushReceived = useCallback((event) => {
  Alert.alert("onRetenoPushReceived", event ? JSON.stringify(event) : event);
}, []);

useEffect(() => {
  const pushListener = setOnRetenoPushReceivedListener(onRetenoPushReceived);
  return () => pushListener.remove();
}, [onRetenoPushReceived]);

import React, { useCallback, useEffect } from "react";

import { Alert } from "react-native";
import { setOnRetenoPushClickedListener } from "reteno-react-native-sdk";

const onRetenoPushClicked = useCallback((event) => {
  Alert.alert("onRetenoPushClicked", event ? JSON.stringify(event) : event);
}, []);

useEffect(() => {
  const pushClickListener = setOnRetenoPushClickedListener(onRetenoPushClicked);
  return () => pushClickListener.remove();
}, [onRetenoPushClicked]);

import React, { useEffect } from "react";
import { Platform } from "react-native";
import {
  setAutoOpenLinks,
  setOnRetenoPushClickedListener,
  addInAppMessageCustomDataHandler,
  initializeEventHandler,
} from "reteno-react-native-sdk";

useEffect(() => {
  // Stop the SDK from opening URLs in the browser.
  // In-app links on both platforms; push links on iOS only.
  setAutoOpenLinks(false);

  const pushClickListener = setOnRetenoPushClickedListener((event) => {
    // On Android, do not navigate here for pushes that carry a link —
    // the native SDK has already opened it.
    if (Platform.OS === "ios") {
      // Route the push destination through your own navigator
    }
  });

  const inAppListener = addInAppMessageCustomDataHandler((data) => {
    if (data.url) {
      // e.g. navigation.navigate("WebView", { url: data.url });
    }
  });

  // initializeEventHandler() is called once in your root setup,
  // after every listener has been registered — see "Initialize SDK and event handler".

  return () => {
    pushClickListener?.remove();
    inAppListener?.remove();
  };
}, []);

type InAppCustomData = {
  customData?: Record<string, any>; // custom data attached to the message
  url?: string; // the URL that was clicked
  inapp_id?: string; // in-app message ID (Android)
  inapp_source?: "DISPLAY_RULES" | "PUSH_NOTIFICATION"; // source (Android)
};

import { useEffect } from "react";
import { Platform } from "react-native";
import {
  getInitialNotification,
  setOnRetenoPushClickedListener,
  initializeEventHandler,
} from "reteno-react-native-sdk";

useEffect(() => {
  const openFromPush = (notification: any) => {
    // your routing
  };

  // Register listeners first — on Android this is what lets the queued
  // cold-start click be delivered when the queue is flushed below.
  const clickListener = setOnRetenoPushClickedListener(openFromPush);

  // iOS only: the launching push never reaches the listener.
  if (Platform.OS === "ios") {
    getInitialNotification().then((notification) => {
      if (notification) openFromPush(notification);
    });
  }

  // The single call from your root setup — it flushes the queue, so it must
  // come after the listener above, not before it.
  initializeEventHandler();

  return () => clickListener?.remove();
}, []);

import React, { useEffect } from "react";

import { Alert } from "react-native";
import { setOnRetenoPushDismissedListener } from "reteno-react-native-sdk";

useEffect(() => {
  const dismissedListener = setOnRetenoPushDismissedListener((event) => {
    Alert.alert("onRetenoPushDismissed", event ? JSON.stringify(event) : event);
  });

  return () => {
    if (dismissedListener) dismissedListener.remove();
  };
}, []);

import React, { useEffect } from "react";

import { Alert } from "react-native";
import { setOnRetenoCustomPushDataListener } from "reteno-react-native-sdk";

useEffect(() => {
  const customPushListener = setOnRetenoCustomPushDataListener((event) => {
    Alert.alert("onRetenoCustomPushData", event ? JSON.stringify(event) : event);
  });

  return () => {
    if (customPushListener) customPushListener.remove();
  };
}, []);

import {
  requestNotificationPermission,
  getNotificationPermissionStatus,
} from "reteno-react-native-sdk";

requestNotificationPermission().then((granted) => {
  console.log("Notification permission granted:", granted);
});

getNotificationPermissionStatus().then((status) => {
  // ALLOWED | DENIED | PERMANENTLY_DENIED
  console.log("Notification permission status:", status);
});

import {
  pausePushInAppMessages,
  setPushInAppMessagesPauseBehaviour,
} from "reteno-react-native-sdk";

pausePushInAppMessages(true); // pause
pausePushInAppMessages(false); // unpause

setPushInAppMessagesPauseBehaviour("SKIP_IN_APPS");
setPushInAppMessagesPauseBehaviour("POSTPONE_IN_APPS");

import { setNotificationGroupingRule } from "reteno-react-native-sdk";

// Group by a payload value, e.g. all pushes for the same chat
await setNotificationGroupingRule({ payloadKey: "chatId" });

// Group under a constant ID, regardless of payload
await setNotificationGroupingRule({ groupId: "messages" });

// Disable grouping
await setNotificationGroupingRule(null);

import android.Manifest
import android.app.NotificationChannel
import android.app.NotificationManager
import android.content.pm.PackageManager
import android.os.Bundle
import android.os.Handler
import android.os.Looper
import androidx.core.app.ActivityCompat
import androidx.core.app.NotificationCompat
import androidx.core.app.NotificationManagerCompat
import com.reteno.push.RetenoNotifications
import com.retenosdk.RetenoNotificationGroupingRuleProvider

class MainApplication : Application(), ReactApplication {

  companion object {
    private const val SUMMARY_CHANNEL_ID = "reteno_group_summary"
    // The "received" event fires on the main thread while the SDK posts the push's own
    // notification on a background thread — there's no ordering guarantee between the two,
    // and posting can take longer than usual (e.g. downloading a BigPictureStyle image). A
    // fixed delay is a heuristic, not a guarantee: if posting is slower than this, the summary
    // is simply skipped for this push and shown on the next one instead of undercounting silently.
    private const val SUMMARY_CHECK_DELAY_MS = 500L
  }

  override fun onCreate() {
    super.onCreate()
    // ... existing onCreate body ...
    createSummaryNotificationChannel()
    RetenoNotifications.received.addListener { bundle -> onPushReceivedForGrouping(bundle) }
  }

  private fun createSummaryNotificationChannel() {
    val channel = NotificationChannel(
      SUMMARY_CHANNEL_ID,
      "Grouped notifications summary",
      NotificationManager.IMPORTANCE_DEFAULT
    )
    NotificationManagerCompat.from(this).createNotificationChannel(channel)
  }

  private fun onPushReceivedForGrouping(bundle: Bundle) {
    val payload = bundle.keySet().associateWith { bundle.getString(it) }
    val group = RetenoNotificationGroupingRuleProvider.resolveGroup(this, payload) ?: return
    Handler(Looper.getMainLooper()).postDelayed(
      { showGroupSummaryNotification(group) },
      SUMMARY_CHECK_DELAY_MS
    )
  }

  private fun showGroupSummaryNotification(group: String) {
    val manager = NotificationManagerCompat.from(this)
    // Exclude the summary itself from the count — once posted, it also carries this group key.
    val groupedCount = manager.activeNotifications.count {
      it.notification.group == group && !NotificationCompat.isGroupSummary(it.notification)
    }
    if (groupedCount < 2) return

    if (ActivityCompat.checkSelfPermission(
        this,
        Manifest.permission.POST_NOTIFICATIONS
      ) != PackageManager.PERMISSION_GRANTED
    ) return

    val summary = NotificationCompat.Builder(this, SUMMARY_CHANNEL_ID)
      .setContentTitle("New notifications")
      .setContentText("You have $groupedCount new notifications")
      .setSmallIcon(R.mipmap.ic_launcher)
      .setGroup(group)
      .setGroupSummary(true)
      // Prevent a duplicate alert (sound/vibration) on top of the child notification's own alert.
      .setGroupAlertBehavior(NotificationCompat.GROUP_ALERT_CHILDREN)
      .setOnlyAlertOnce(true)
      .setAutoCancel(true)
      .build()

    manager.notify(group.hashCode(), summary)
  }
}

import React, { useEffect } from "react";

import { updatePushPermissionStatusAndroid } from "reteno-react-native-sdk";

useEffect(() => {
  PermissionsAndroid.request(
    PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS!
  ).then((result) => {
    if (result === "granted") {
      updatePushPermissionStatusAndroid().then((status) => {
        console.log("Update status:", status);
      });
    }
  });
}, []);