Search code examples
firebasereact-nativenotificationsreact-native-push-notification

React Native Local Notification with icon from url

I am developing a react native app with chatting functionality. I use FCM for the notifications which are sent from my django server using fcm-django plugin. For receiving the notifications in the client I use react-native-firebase. I send a data type message (not notification, see here) and from the app, when the message is received, I am creating a local notification using react-native-push-notification.

What I want now is to be able to change the notification icon (largeIcon, see properties here) and set it to be the profile image of the user who sent the message.

enter image description here

profile_image = 'http://...'

PushNotification.localNotification({
        title: from_user.username,
        message: message_text,
        priority: "max",
        importance: "max",
        largeIcon: "???"   <--------
});

The problem is that the largeIcon property (as far as I know) accepts a string with the name of the icon that is located in the app's folder (res/mipmap folder for android etc.) while I have a url for the image. What should I do?

  • Should I download the image and save it in that folder (if it is possible)?

  • Should I use notification type when sending the message from server?

  • Should I try another react native plugin for local notifications?

I am currently concerned for making it work at least on Android. Any help would be appreciated.

Solution

  • Finally I solved it using the react-native-firebase plugin I already had installed. It also has functions for creating local notifications, and for the icon it accepts url. I found out about this from this SO answer and then read more about creating local notifications from the react-native-firebase documentation.