Navigation concept when a new notification

[kefahB]

@NathanWalker what do you think about a blog post about handling the navigation when we receive notification or a deep link .. I have found a solution It work fine but I don't know if it is the best practice! it will be really useful if you can (when you have time 😰 ) to explain the concept :slight_smile:

I am used to put a dispatcher-page as a root and from there I check if the user is logged in, then I navigate user to the home-page.

Now with notification:
All the navigation is made from the home-page I register a event listener on the rootLayout getRootFrame().addEventListener("new_notification", (args: EventData) => {}) and the the callback I use the data to navigate to the desired page.

App in the background

In app.ts I register Firebase.onNotificationTap inside I save the notification data in the application settings

ApplicationSettings.setString(NOTIFICATION_DATA, JSON.stringify({
   path: "some-page",
   data: {} // if needed for the navigation context
}));

Now the stack will be like this:

1. app.ts -> Firebase.onNotificationTap fired -> save notification data in the appSettings
2. dispatcher-page -> navigate to the home-page
3. home-page -> I fetch the application settings to see if NOTIFICATION_DATA is populated, if yes I reset it and navigate:

   const _args = ApplicationSettings.getString("NOTIFICATION_DATA", null);
   const args = JSON.parse(_args);
   ApplicationSettings.remove(NOTIFICATION_DATA); // reset
   getRootFrame().navigate({
     moduleName: args.path,
     context: args.data
   });

App in the foreground

I use locale notification instead of firebase messaging.showNotificationsWhenInForeground = false and I register LocalNotifications.LocalNotifications.addOnMessageReceivedCallback on the main-page

In app.ts I register Firebase.onMessage I schedule locale notification after 6 seconds with the data needed as a payload

Now when the user is in any page and he tap the local notification:

       LocalNotifications.LocalNotifications.addOnMessageReceivedCallback((notification) => {
        // check if the user is in the same page !!
        getRootFrame().navigate({
            moduleName: notification.payload.module_name,
            context: notification?.payload?.data
        });
    })

As you can see the way that I've found it is tricky and maybe a lot of people like me struggle with this navigation concept :)