Amplify-js: support RN-0.60.+ for @aws-amplify/pushnotification

[bernhardt1]

Describe the bug
There are many issues with this library when installing it in a RN0.60.+ project. The worst part is, none of these are mentioned in the installation docs.

The vast majority of other libraries provide detailed instructions for installation depending on the projects RN version. When using RN0.60.+ they almost all provide support for autolinking. For those using versions less than 0.59 they provide different instructions.

It is unclear how to incorporate push notifications into a project using RN-0.60.+ or if it is even possible.

It is very frustrating to follow a guide that leads to a failed state. RN-0.60.+ has been released for months. Please update the docs to let people know of the libraries limitations.

To Reproduce
Try to add push notifications to a RN0.60.+ project.

Expected behavior

• Autolinking for both iOS and android
• compatibility with RN0.60.+
• documentation of libraries limitations

Screenshots
NA

Desktop (please complete the following information):
NA

Smartphone (please complete the following information):
NA

Additional context
NA

Sample code
NA

_You can turn on the debug mode to provide more info for us by setting window.LOG_LEVEL = 'DEBUG'; in your app._

[bernhardt1]

Update: Android is working without explicitly linking the package.

I was able to skip much of the documentation to get notifications working on android.
parts of step 3, 6, and 7.

The iOS documentation seems to have similar problems.

[bneigher]

Yea amplify-js is getting very antiquated regarding it's support on modern react native. I'm about ready to remove it from my app. Feels like the web is treated more like a first class citizen and react native is an afterthought

[bernhardt1]

@bneigher

I've thought about that. AWS is pretty integrated into my app at this point though. Authentication, storage, push notifications. Not to mention appsync and lambda.

If you decide to remove it let me know. Would be interesting to talk about alternative options. @ me here or twitter @JasonBernhardt1

[MaffooBristol]

The library forces the use of the bundled RN push notifications library and every single workaround I've tried has not worked. It seems it simply needs to be updated to allow the @react-native-community version of the library to work. Hopefully there can be some solution soon because I'm trying to integrate amplify with a new RN-0.61 project and I'd rather not have to downgrade RN just for this. I'd probably go with firebase for both ios and android if it can't be resolved soon 😞

[MaffooBristol]

Also, for the sake of Google, this is the error I get after it has built:

Invariant Violation: Native module cannot be null.

constructor
    NativeEventEmitter.js:36:16
<global>
    PushNotificationIOS.js:18:2
loadModuleImplementation
    require.js:322:6
prototype.requestIOSPermissions
    PushNotification.js:175:23
prototype.initializeIOS
    PushNotification.js:179:12
prototype.configure
    PushNotification.js:95:12
_components.map$argument_0
    Amplify.js:25:27
map
    [native code]:0
_components.map$argument_0
    Amplify.js:24:29
<global>
    App.jsx:25:18
loadModuleImplementation
    require.js:322:6
<global>
    index.js:3
loadModuleImplementation
    require.js:322:6
guardedLoadModule
    require.js:201:45
global code
    index.bundle?platform=ios&dev=true&minify=false:145611:4

[rogueturnip]

Is there any assessment to how long it will before this will be supported in RN 0.60+ since I'm sure it's blocking alot of people from moving to the new code base.

[Ashish-Nanda]

Hi,
Thanks for your patience. We are looking into the issue at this time and working on a fix to support push notifications in RN 60+
It seems the issue is on iOS only. We are planning to move to the @react-native-community version of the library.
Regarding documentation, we are working on more comprehensive examples specifically for React Native and are adding installation/setup instructions based on the version, which you can already see in some categories. Once the fix is verified, we will be updating the push notification docs for RN 60+ as well.

[rogueturnip]

Thanks! Is this also going to switch out the AsyncStorage (and in other spots too like Auth) because without doing that it will have issues with RN 0.60+

[MatthieuLab]

@Ashish5591 hi! any news on this topic?

[giftset]

is it fixed on latest version?

[cinder92]

@Ashish5591 this changes are on #native-60 but not on master branch, neither on npm itself, and trying to install it from branch didn't work, any advice?

[Ashish-Nanda]

Hi,

I merged PR #4478 to master that adds support for push notifications with React Native 0.60+ in iOS.
Please test out the changes by installing amplify with the @unstable tag and let us know if it works for you.
Follow the documentation here replace the corresponding steps with the ones below. (We will update the docs in detail once this change makes it to a stable release next week) :

Please install aws-amplify@unstable

npm install aws-amplify@unstable

and @aws-amplify/pushnotification@unstable:

npm install @aws-amplify/pushnotification@unstable

This should also install @react-native-community/push-notification-ios. You need to do the following to link its native modules:

cd ios
pod install

If that does not install the Pod, on React Native 0.61 we observed you need to add the dependency to you package.json (no need to install the dependency). Add the following to your package.json dependencies and run pod install from the ios folder again:

"dependencies": {
   ...,
   "@react-native-community/push-notification-ios": "^1.0.2"
  }

Other setup instructions should remain the same.
We have tested with Xcode 11, iOS 12.x and React Native 0.61.x.

Note: Its possible there might be issues with iOS 13 due to some breaking changes introduced and the @react-native-community/push-notification-ios dependency not having the necessary changes. We have not tested this yet.

Please let us know if it works for you or if you face any issues. We will be doing additional testing next week and will publish these changes to the @latest tag in the next release. The docs will be updated to reflect the new instructions at the time of the release.

[joebernard]

The @unstable tag seems to work well in my app. So far no issues but my push requirements are fairly limited.

[Ashish-Nanda]

Thanks @joebernard for confirming that it works. The fix has been available in @latest for some time now as well.

[MR-Neto]

@Ashish-Nanda, I followed the documentation to install amplify push notifications into my RN app, but my app is breaking. Is the documentation updated for RN 0.61?

[henrymoulton]

Is there an update on this issue? We're considering adding using Amplify for push notifications but seeing unclosed issues such as these doesn't inspire confidence.

[njdullea]

@henrymoulton There were some challenges with getting the proper installation for 0.6+ (docs are slowly being modified), but I have been successful in setting up PNs for both IOS and Android with Amplify.

[bernhardt1]

@henrymoulton
I've been successful using this library twice in the past. But they don't maintain it well so RN updates lead to breaking changes.

It's been a bit of a nightmare:

• 0.6+ breaking changes.
• doesn't play well with RN firebase modules
• difficult to debug
• very poor library maintenance (installation docs are not updated. Poor upgrade documentation. etc.)

I would suggest trying a different library.

@njdullea Did you find a guide for the 0.6+ installation or did you troubleshoot your way through it? Could you link the steps you followed if they are available?

[dantasfiles]

Could you link the steps you followed if they are available?

I wrote up my experiences setting up Android push notification with AWS Amplify and React Native 0.61.5.

[njdullea]

@bernhardt1 Unfortunately, I do not have a list. Thanks to @dantasfiles for making the android process description...

For IOS, a big difference is using the community version of PushNotificationIOS instead of the react-native version.

[Polarisation]

@Ashish-Nanda Seems this switch to use @react-native-community/push-notification-ios happened in the v2.1.1 patch release. The CHANGELOG currently says "Version bump only" for v2.1.1, but I think this is quite an important and potentially breaking change, so it should mention this.

[lissau]

I followed the (outdated) docs at https://aws-amplify.github.io/docs/js/push-notifications and ended up with the same error description as @MaffooBristol posted - "Invariant Violation: Native module cannot be null."

What solved it for me was to update to [email protected], add dependency @react-native-community/push-notification-ios and discard step 6 and 7 under "Setup iOS" in the docs and instead update AppDelagate.m according to the docs at @react-native-community/react-native-push-notification-ios

Don't forget to run pod install

[Jobel91]

Following @dantasfiles response and his medium tutorial.
In combination with https://firebase.google.com/support/release-notes/android#latest_sdk_versions, which say that:

"The Firebase Android library firebase-core is no longer needed. This SDK included the Firebase SDK for Google Analytics.

Now, to use Analytics or any Firebase product that recommends the use of Analytics (see table below), you need to explicitly add the Analytics dependency: com.google.firebase:firebase-analytics:17.4.0."

I tried to remove "com.google.firebase:firebase-core" and then add "com.google.firebase:firebase-analytics:17.4.0.". Then it works well !

Thank you @dantasfiles !

[Ashish-Nanda]

Closing this issue as the fix was merged #4478 and released a while back https://github.com/aws-amplify/amplify-js/issues/4089#issuecomment-565529335
The documentation and setup instructions were also updated and simplified: https://github.com/aws-amplify/docs/pull/1932