CodeLeap Docs

CommonWebMobileCLIConceptsUpdates

Notification Manager

Tools

Tool for managing app notifications

Source

View source code

Package

@codeleap/mobile

How to use

import { NotificationManager } from '@codeleap/mobile'
export const notificationManager = new NotificationManager(logger, options)

You can pass two arguments:

  • logger: will be used to debug any essential events.
  • options: important configurations.

Options

  • handleInitialNotification(boolean - default is true): enable or disable the app's initial notification.
import { NotificationManager } from '@codeleap/mobile'
export const notificationManager = new NotificationManager(logger, {
handleInitialNotification: true,
})
  • debug(boolean - default is false): enable or disable debug mode, which logs various useful information to understand what is happening with notifications.
import { NotificationManager } from '@codeleap/mobile'
export const notificationManager = new NotificationManager(logger, {
debug: IsDev,
})
  • slackDebug(boolean - default is false): enable or disable logs to Slack. If enabled, all debug information goes to the Slack channel.

This can be very useful for understanding what is happening with notifications in release.

import { NotificationManager } from '@codeleap/mobile'
export const notificationManager = new NotificationManager(logger, {
slackDebug: false,
})
  • parser(function - default is null): a function that is called in the handlers to process the notification before passing it to the events.

This function receives a message of type Message, which is the notification received from Firebase without any processing. It should return the type passed as the first argument to the NotificationManager.

import { NotificationManager, Message } from '@codeleap/mobile'
type Notification = {
text: string
}
function parser(message: Message): Notification {
return {
text: message.body
}
}
export const notificationManager = new NotificationManager<Notification>(logger, {
parser: false,
})

Important Methods

registerEvent

Function that registers an event to be called by the notification services, returning an unsubscribe function if necessary.

const unsubscribe = notificationManager.registerEvent('event_name', (notification) => {
...
})

It receives two arguments:

  • The name of the event, the typing of which must be passed as the second type argument to the NotificationManager.
type NotificationEventName = 'event_name' | 'other_event'
export const notificationManager = new NotificationManager<Notification, NotificationEventName>(logger)
  • The event-related function that receives a notification with data (the return from the parser function) and type (the type of notification), and you can handle or execute whatever you need.

getToken

Async function that retrieves the current device token. If the return is null, an error occurred while trying to obtain the token.

const deviceToken = await notificationManager.getToken()

getHasAuthorization

Async function that checks if the application has authorization to initialize notification services. It returns a boolean true if it does.

const hasAuthorization = await notificationManager.getHasAuthorization()

initialize

Function that initializes all notification services and retrieves the device token to return in the callback function.

notificationManager.initialize((token) => {
...
})

The following services are started:

  • onNotificationOpenedApp: Triggered when the app is in the background and is opened by a notification. Its notification type is 'press'.

  • getInitialNotification: Triggered when the app is closed and is opened by a notification. Its notification type is 'initial'.

  • onBackgroundMessage: Triggered when the app is in the background. Its notification type is 'background'.

  • onMessage: Triggered when the app is in the foreground. Its notification type is 'foreground'.

  • onTokenRefresh: Triggered when the device token is refreshed. The callback function is called.

After initializing these services, it registers the unsubscribe event of each one, and always executes all of them before initialization, ensuring that a service is not duplicated.

deinitialize

Function that removes all active notification services by unsubscribing from each one. You can pass a callback function that will be called when the process is completed.

Implementation

Create a hook that will be responsible for either initializing or deinitializing the notification service, and call it in your main file, typically located in scenes/index.tsx.

import React from 'react'
import { APIClient, usePermissions } from '@/services'
import { notificationManager } from './manager'
export const useNotificationsManager = () => {
const { isLoggedIn } = APIClient.Session.useSession()
const permissions = usePermissions()
React.useEffect(() => {
const func = async () => {
const hasAuthorization = await notificationManager.getHasAuthorization()
// Check if the user is logged in and if the application has notification permissions
if (isLoggedIn && hasAuthorization) {
// Initialize notification services
notificationManager.initialize((token) => {
// Register the device token
APIClient.Notifications.registerDevice(token)
})
} else {
// Remove notification services
notificationManager.deinitialize()
}
}
func()
}, [
// Watch if the user is logged in
isLoggedIn,
// Watch notification events
notificationManager.events.subscribers,
// Watch notification permissions for any changes
permissions.state.notifications
])
}
import { useNotificationsManager } from 'path'
export default function App() {
...
useNotificationsManager()
...
}

Table of contents

How to use
Options