Bring Android React Native App to Foreground On Receipt of Data Only Firebase Cloud Message

Question

I am successfully using Firebase Cloud Messaging with react-native-firebase to send and receive data only messages between Android devices.

When a device receives a message, if the app is in the background or has been killed I would like to bring the app to the foreground. I am getting notifications that will display a console.log() under both circumstances, but I'm having trouble figuring out how to best approach 'waking up' the app / bring it to the foreground:

  firebase.messaging().onMessage((message) => {
    // Process your message as required
    console.log('You got a message!', message);
  });
}

The above code is executed as expected under both circumstances.

Are there React Native packages I can look at to help achieve what I'm trying to do or should I be considering having to write some Java?

Update

I am trying to achieve something like this but not sure if it's possible to add code like this straight in to my React Native application?

Update 2

I have discovered this package react-native-invoke-app that uses HeadlessJS.

HeadlessJS requires you to use this code in your index.js:

AppRegistry.registerHeadlessTask('SomeTaskName', () => require('SomeTaskName'));

However Firebase Cloud Messaging already needs you to provide this line of code in the same place, which I'm guessing does the same thing as above:

AppRegistry.registerHeadlessTask('RNFirebaseBackgroundMessage', () => backgroundMessaging);

Following the react-native-invoke-app docs I am then placing the call to invoke my app inside the firebase.messaging().onMessage((message)) callback like so:

firebase.messaging().onMessage((message) => {
    // Process your message as required
    invokeApp();
    console.log('You got message!', message);
  });
}

However this is not bringing my app to the foreground.

Update 3

I've now moved the invokeApp() call inside the Firebase backgroundNotificationListener function which is a headless task which seems like the correct approach:

import invokeApp from 'react-native-invoke-app';

const incomingMessage = async (message) => {
  // handle your message
  invokeApp();
  return Promise.resolve();
}
export default incomingMessage;

But the app will still not come to the foreground when the incomingMessage function is called.

Update 4

I have raised this issue on the react-native-invoke-app github page which has more details on the issues I'm facing.

Answer 1

The reason this doesn't work is that react-native-invoke-app doesn't support Android versions > 8. If anyone knows an alternative to this package please comment below, thank you.