CodeLeap Docs

3.21.6

New Notification System

NotificationManager

A new and enhanced notification system.

Basic Migration

Inside the app's index.jsx, implement the headless check:

function HeadlessCheck({ isHeadless }) {
  return isHeadless ? null : <App />
}

AppRegistry.registerComponent(appName, () => HeadlessCheck)

In the AppDelegate.mm file inside the ios folder, import the Firebase Messaging module at the top of the file:

#import "RNFBMessagingModule.h"
#import "AppDelegate.h"

...

Add the following BackgroundMode configurations to the Info.plist:

...

<key>UIBackgroundModes</key>
	<array>
	  <string>fetch</string>
	<string>remote-notification</string>
</array>

...

Remove any and all mentions of the notifee library. It overrides some methods of Firebase Messaging, causing the getInitialNotification and setBackgroundMessageHandler handlers to not work properly.

Create a file named manager.ts for the NotificationManager.

import { Message, NotificationManager } from '@codeleap/mobile'

function parseNotification(message: Message) {
  const notification = {
    id: Number(message.data?.id),
    title: message.notification?.title,
    data: message.data as any,
    body: message.notification?.body,
  }

  return notification
}

export const notificationManager = new NotificationManager(logger, {
  parser: parseNotification,
})

notificationManager.registerEvent('handle_notification', (notification) => {
  // Handle the notification.
})

Create a file responsible for managing notification services.

import { React } from '@/app'
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()

      if (isLoggedIn && hasAuthorization) {
        notificationManager.initialize((token) => {
          APIClient.Notifications.registerDevice(token)
        })
      } else {
        notificationManager.deinitialize()
      }
    }

    func()
  }, [
    isLoggedIn,
    notificationManager.events.subscribers,
    permissions.state.notifications
  ])
}

Call the useNotificationsManager hook inside scenes/index.tsx.

import { useNotificationsManager } from 'path'

export default function App() {
  ...

  useNotificationsManager()

  ...
}

The old NotificationManager has been moved to utils/deprecated. If you want to continue using it without upgrading, you can do so.

Documentation

Visit the tool documentation for more information: click here.

Mobile Template

Added logic to remove the user's GCM Device when they log out or delete their account.
Refactored the notification and notificationEvents APIs to use @codeleap/common's QueryManager instead of usePagination.
Implemented the new notification system and removed the old one.
Fixed notificationEvents.
All notification and notificationEvents types have been moved to the @types folder.

Web Template

Added logic for email verification.
added usePageExitBlocker, hook that prevents the user from leaving the page.
Refactored the notification API to use @codeleap/common's QueryManager instead of usePagination.
All notification types have been moved to the @types folder.

Table of contents