Inbox

In this article you'll learn how to build an app inbox with all the options at your disposal to create a great messaging experience for your users.

With our library it's extremely easy to implement an in-app inbox. Implementing an inbox increases considerably the engagement rate of your notifications simply because messages will always be available inside your app.

Device-level inbox

The standard approach is to use the device-level inbox. Each device will have its own independent inbox, regardless of the associated user. The device-level inbox is available via the capacitor-notificare-inbox package. The inbox itself is exposed via events from NotificareInbox, so it is really easy to hook up your views to a list of inbox items, for example:

NotificareInbox.onInboxUpdated((items) => {
  // Do something with the items.
});

In the same way, you can listen for the number of unread messages.

NotificareInbox.onBadgeUpdated((badge) => {
  // Do something with the badge.
});

If you want to get the data at any point in time, you can still get the items and the badge in the inbox.

// Items
const items = await NotificareInbox.getItems();

// Badge
const badge = await NotificareInbox.getBadge();

Managing inbox items

Assuming that you hold a reference to an item, to open an inbox item you would simply do something like this:

const notification = await NotificareInbox.open(item);

// Optional: Present the notification with Push UI.
await NotificarePushUI.presentNotification(notification);

To remove items from the inbox you would invoke the following method:

await NotificareInbox.remove(item);

Additionally, you can also mark a message as read by invoking the following method:

await NotificareInbox.markAsRead(item);

Or mark all messages as read by invoking the following method:

await NotificareInbox.markAllAsRead();

To remove all items in the inbox you would do the following:

await NotificareInbox.clear();