Create Mass Notification Inbox

This guide covers how to use the getNotificationInbox function to get mass push notification data to be used to create your Mass Notification Inbox.

This video walks through the setup guide below:

Mass Notification Inbox Preview

Here's how the Mass Notification Inbox creation process works:

  • Get Mass Notifications Sent: Use the native-notify 'getNotificationInbox' function to get a history of all the mass push notifications you have sent in the past.
  • Use: Use the Mass Notification Inbox data from the 'getNotificationInbox' function to create an In-App Notification Inbox.

Prerequisites

1

Create a free Native Notify account

Create a free NativeNotify.com account to get your Native Notify App ID and App Token.

Setup and Use

1

Import getNotificationInbox

In your Notification Inbox screen, include these imports:

import React, { useState, useEffect } from 'react-native';
import { getNotificationInbox } from 'native-notify';
2

Check for Hook function

Make sure you are using a Hook function as your Notification Inbox function. Here is an example:

export default function NotificationInbox() {
    ...
}

This link explains Hooks in detail: https://react.dev/reference/react/hooks

3

Create a data Hook

Inside of your Notification Inbox screen, create a useState to store your Notification Inbox data like this:

const [data, setData] = useState([]);
4

Create a useEffect

Paste this 'useEffect' function into your Notification Inbox function:

useEffect(() => {
    const fetchNotifications = async () => {
        try {
            const notifications = await getNotificationInbox(
                "app-id-number",
                "app-token-string",
                take-number,
                skip-number
            );
            console.log("notifications: ", notifications);
            setData(notifications);
        } catch (error) {
            console.error("Error fetching notifications: ", error);
        }
    };

    fetchNotifications();
}, []);

Notes:

5
6

Create your Mass Notification Inbox

Create your Mass Notification Inbox using the data received by running your getNotificationInbox function.

Complete example

import React, { useState, useEffect } from 'react';
import { getNotificationInbox } from 'native-notify';

export default function NotificationInbox() {
    const [data, setData] = useState([]);

    useEffect(() => {
        const fetchNotifications = async () => {
            try {
                const notifications = await getNotificationInbox(
                    "app-id-number",
                    "app-token-string",
                    take-number,
                    skip-number
                );
                console.log("notifications: ", notifications);
                setData(notifications);
            } catch (error) {
                console.error("Error fetching notifications: ", error);
            }
        };

        fetchNotifications();
    }, []);

    return (
      ... // create a Mass Notification Inbox using getNotificationInbox data
    )
}