0

I'm using Notifee library for showing notification in my react-native application. based on this documentation it seems I should use html tags for styling the title and body of notification.

In my case, I want to add a fontAwsome icon inside of notification body.

Now the following html tags work in the html file but don't work on notification

<i class="far fa-clock"></i>

This is the result in web page:

enter image description here

Bu the result of notification body is empty:

enter image description here

Also you can see my code;

const customBody =
      '<html><head><meta name="viewport" content="width=device-width, initial-scale=1"><script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script><!--Get your own code at fontawesome.com--></head><body><i class="far fa-clock"></i></body></html>';

    await notifee.displayNotification({
      id: notification.id,
      title: 'This is title',
      body: customBody,
      data: {
        [notification.key]: notification.data,
      },
      android: androidConfig,
      ios: iOSConfig,
    });

And also any alternative solution is appreciated. :)

Nava
  • 368
  • 2
  • 11

1 Answers1

0

interesting scenario! I think this can be possible but not by embedding any scripts. There are only a handful of HTML tags that are supported (see string-resource#StylingWithHTML).

I'm wondering if you could do something like adding a custom typeface or exploring using FontAwesome as a font family.

This is an interesting thread on how to use FontAwesome as a typeface.

An alternative solution would be to use emojis

Helena Ford
  • 1