Channels

[0x2539]

This PR brings the ability to create custom notification channels from javascript. This is how to use it:

import {Notifications} from 'react-native-notifications';

Notifications.setNotificationChannel({
    channelId: 'my-channel',
    name: 'My Channel',
    importance: 5,
    description: 'My Description',
    enableLights: true,
    enableVibration: true,
    // groupId: 'your-group',
    showBadge: true,
    soundFile: 'custom_sound.mp3',  // place this in <project_root>/android/app/src/main/res/raw/custom_sound.mp3
    vibrationPattern: [200, 1000, 500, 1000, 500],
})

I've also fixed a bug (I think it is a bug?) where the notification would be shown in the drawer if it is received while the app is opened (the changes in src/main/java/com/wix/reactnativenotifications/core/notification/PushNotification.java). I think this is a bug, because with the react-native-firebase v5 I've never had this behaviour. Also the notification was displayed wrong (the title and body were missing).

This may be related to #488 and #80

This should be the API call to FCM to send a notification (I think this is the legacy API version, you can use this one as a reference if you use the new API version):

• url: https://fcm.googleapis.com/fcm/send
• method: POST
• headers (you can find the authorization key in your firebase console -> project settings -> cloud messaging -> server key):

{
    "Authorization": "key=AAA...."
}

• body:

{
    "to": "<fcm_token>",
    "priority": "high",
    "notification": {
        "title": "Title",
        "body": "You have received a new notification yayyy :) :) :)",
        "android_channel_id": "my-channel",
        "badge": "0",
        "sound": "custom_sound.mp3"
    },
    "data": {
        "some": "data here"
    }
}

There are 4 ways to use this PR in case you want to test it or actually use it:

1. Using patch-package (the recommended way):
   • checkout this branch in your node_modules/react-native-notifications
   • run npm run build
   • use patch-package and commit your changes to git (don't forget to add a postinstall to package.json as it says in the patch-package guide)
2. Forking my branch:
   • run npm run build
   • remove lib/dist/ from .gitignore
   • commit to git
   • use your fork in package.json
3. Same as 2. but you can directly fork my release branch found here
4. Using my release branch found here (I do not recommend this one, as there is a possibility to delete the repo).

[simonasdev]

needed so much!

[JaioSkura]

Need this a lot! Will it be aproved?

[euharrison]

Thanks for update!

Is there a possibility to create multiple channels if executing Notifications.setNotificationChannel() more than once?

[0x2539]

Thanks for update!

Is there a possibility to create multiple channels if executing Notifications.setNotificationChannel() more than once?

I did not test this, but I'm very sure it should work. Just make sure to use a different channelId for each channel, otherwise it would update the previous one.

There is more information in the google's documentation and I think the most important part is that some settings of the channels cannot be updated after they are created (vibration, lights, etc):

But remember that once you create the channel, you cannot change these settings and the user has final control of whether these behaviors are active.

I think that if you set up a channel wrong in production (wrong lights or vibration pattern), your only solution would be to create a new one with the correct settings and use the new one.

[SaeedZhiany]

@yogevbd

would you please review and merge this?

[SaeedZhiany]

@alexbuicescu

Thanks for adding android Channels support to this library.

I have a problem in my typescript based project, it seems the new types and the method setNotificationChannel are not exported, can you add new types to type definition file in a new PR, please?

[JaioSkura]

Thanks a lot for this job. Documentation should be updated too.

[anisimov74]

@alexbuicescu it's a bit strange, but after this PR has been merged remote notifications never come.
@yogevbd

[0x2539]

@anisimov74 do you have more details?

1. does it come when in background or in foreground?
2. what did you use to send the notifications? (if you can pass the http request's body, that would be great)
3. is it just on android? (I hope so, as I didn't touch any iOS files)
4. do the notifications show up in the drawer, but not in the in JS hook (eg: Notifications.events().registerNotificationReceivedForeground)?

I just tried with the latest version (3.1.4-snapshot.114) and works fine for me, I'm using this to send the notification with a POST to https://fcm.googleapis.com/fcm/send:

{
    "to": "<your_fcm_token_here>",
    "priority": "normal",
    "notification": {
        "title": "Title",
        "body": "You have received a new notification yayyy :) :) :)"
    }
}

If the notification does not come in while app is closed, there may be something else wrong (maybe your firebase token has changed, as it is usually the case). Any notification should come (appear in the notifications drawer) while the app is closed because it is managed by the system, not by the app. The only time when it won't appear is if it is a silent/data notification.

Can you test on a fresh install to be sure that the firebase token is up to date?

[0x2539]

@alexbuicescu

Thanks for adding android Channels support to this library.

I have a problem in my typescript based project, it seems the new types and the method setNotificationChannel are not exported, can you add new types to type definition file in a new PR, please?

Hi, I thought it is supposed to work automatically.
setNotificationChannel is public and it is inside NotificationsRoot which is exported. I also use typescript (version 3.8.3) in my project and it has no problem with the types:

import {Notification, Notifications} from 'react-native-notifications';
Notifications.setNotificationChannel({...})

If there is another file that I need to update can you please give me a link?

[SaeedZhiany]

So weird, I'm using same version of typescript and the same syntax you are mentioned above but I got on the method usage. Maybe I need to clean my previous caches to make it work.

I'll try that again and report it here.

[SaeedZhiany]

@alexbuicescu

As you can see there is no setNotificationChannel method suggested for me. I think its signature should be defined in Notification.ts file.

[anisimov74]

@alexbuicescu sorry for not responding to your question about not receiving notifications.
The problem is that you've changed the behaviour of showing notifications in foreground. Now they are not shown in the drawer.
It's a show-stopper for me, since my app should receive many notifications that should be shown in foreground. Also you changed this for Android only and this makes a big difference from iOS.

[0x2539]

@anisimov74 I know about that, but for me the problem was that the notification in the drawer would be blank (no title, no body, no icon, just a white, empty notification).

One suggestion would be to make this configurable (for those like me, who do not want to display the notification if the app is in foreground).

Another suggestion, and a fast fix for you, is to create a local notification when the app is in foreground, because you receive all the notification data on the js side (notification title, body, etc)

I'm not entirely sure though how to store settings in the native app, so we can read them when a notification is received and choose whether to show it or not. Is there already something similar implemented in react-native-notifications?

[anisimov74]

@alexbuicescu using a local notification sounds reasonable. Will try. Thanks!

[danieloprado]

How do I send a local notification with a specific channel id?

[0x2539]

@danieloprado I don't know, I've never used local notifications

[SaeedZhiany]

@danieloprado

the best way to use this library for creating local notifications on Android is using this tutorial, you can send all information you need to the Android side and do what you want like submit new channel and assign it to a channel group and etc.)

[eXigentCoder]

This is great thanks!

I can definitely see my notification channel being created, one thing I'm not clear about, when calling Notifications.postLocalNotification how do I specify that it should use the channel?
Prior to the notification firing I am already doing the following:

Notifications.setNotificationChannel(channel);
Notifications.android.setNotificationChannel(channel);

Where the variable channel is an object that conforms to the NotificationChannel interface

[0x2539]

This is great thanks!

I can definitely see my notification channel being created, one thing I'm not clear about, when calling Notifications.postLocalNotification how do I specify that it should use the channel?
Prior to the notification firing I am already doing the following:

Notifications.setNotificationChannel(channel);
Notifications.android.setNotificationChannel(channel);

Where the variable channel is an object that conforms to the NotificationChannel interface

Hi, I don't know how you can set the channel for the local notification (maybe somebody else knows how). But I can certainly tell you that Notifications.setNotificationChannel will not work because its purpose is to create/update the channel and not to assign it to a local notification. Maybe it is not implemented for the local notification in this library (I really don't know)

[eXigentCoder]

Thanks have opened #631 to track this!

[ravirajn22]

I appreciate the effort you put into this PR, but I see few problems this PR introduced and would like to give some advice to library maintainers.

I've also fixed a bug (I think it is a bug?) where the notification would be shown in the drawer if it is received while the app is opened (the changes in src/main/java/com/wix/reactnativenotifications/core/notification/PushNotification.java). I think this is a bug, because with the react-native-firebase v5 I've never had this behaviour. Also the notification was displayed wrong (the title and body were missing).

This is not a bug, this is how the library has been working for the last 3 years. Now that you have made this change, it's breaking the existing functionality of all the apps and there is no option to configure it how we can in iOS.

This change is not listed in the change log. why?

Breaking functionality should have been released in major release not minor version.

If there was a bug in foreground notification then we must have first fixed the bug, before deciding on this huge functionality change.

Lastly there is no documentation update for all these changes, how will the users know the feature exist?

If the maintainers feel they don't have enough time I request them to kindly add me to the collaborator list, until I use this library I will see to that library is well maintained. Not like issues and PR's are closed due to being stale.