TypeError: RNPushNotification is undefined

[polsust]

Bug

TypeError: RNPushNotification is undefined

Right when launching the app

Installed RNpn for android without autolinking

Environment info

react-native info output:

System:
    OS: Linux 5.15 undefined
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz
    Memory: 8.72 GB / 15.28 GB
    Shell: 3.5.1 - /usr/bin/fish
  Binaries:
    Node: 19.2.0 - /usr/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 8.19.2 - /usr/bin/npm
    Watchman: 4.9.0 - /usr/bin/watchman
  SDKs:
    Android SDK: Not Found
  IDEs:
    Android Studio: AI-213.7172.25.2113.9123335
  Languages:
    Java: 11.0.17 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0
    react-native: 0.69.6 => 0.69.6
  npmGlobalPackages:
    *react-native*: Not Found

Library version: ^8.1.1

Steps To Reproduce

1. Install RNpn for android and configure it
2. Try to send a notification ...

Describe what you expected to happen:

I expected the notification send properly, but I got an error message instead

Reproducible sample code

index.ts

AppRegistry.registerComponent(appName, () => App);

PushNotification.configure({
  // (required) Called when a remote is received or opened, or local notification is opened
  onNotification: function (notification) {
    console.log("NOTIFICATION:", notification);

    // process the notification

    // (required) Called when a remote is received or opened, or local notification is opened
    // notification.finish(PushNotificationIOS.FetchResult.NoData);
  },

  // (optional) Called when Registered Action is pressed and invokeApp is false, if true onNotification will be called (Android)
  onAction: function (notification) {
    console.log("ACTION:", notification.action);
    console.log("NOTIFICATION:", notification);

    // process the action
  },

  // Should the initial notification be popped automatically
  // default: true
  popInitialNotification: true,

  /**
   * (optional) default: true
   * - Specified if permissions (ios) and token (android and ios) will requested or not,
   * - if not, you must call PushNotificationsHandler.requestPermissions() later
   * - if you are not using remote notification or do not have Firebase installed, use this:
   *     requestPermissions: Platform.OS === 'ios'
   */
  requestPermissions: true,
});

MainApplication.java

        @Override
        protected List<ReactPackage> getPackages() {
          @SuppressWarnings("UnnecessaryLocalVariable")
          List<ReactPackage> packages = new PackageList(this).getPackages();
          // Packages that cannot be autolinked yet can be added manually here, for example:
          // packages.add(new MyReactNativePackage());
          packages.add(new RNFSPackage());
          packages.add(new ReactNativePushNotificationPackage());
          return packages;
        }

AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.musicapp">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
        <meta-data android:name="com.dieam.reactnativepushnotification.notification_foreground" android:value="false" />
        <meta-data android:name="com.dieam.reactnativepushnotification.notification_color" android:resource="@color/white"/>

        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
          <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
          <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
              <intent-filter>
                  <action android:name="android.intent.action.BOOT_COMPLETED" />
                  <action android:name="android.intent.action.QUICKBOOT_POWERON" />
                  <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
              </intent-filter>
        </receiver>

        <service
            android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
            android:exported="false" >
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>

      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize"
        android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
    </application>
</manifest>

app/build.gradle

compile project(':react-native-push-notification')

...

dependencies {
...
    implementation project(':react-native-push-notification')
...
}

build.gradle

buildscript {
    ext {
        googlePlayServicesVersion = "+"
        firebaseMessagingVersion = "21.1.0"
        supportLibVersion = 23.1.1
    }
}

settings.gradle

rootProject.name = 'MusicApp'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
includeBuild('../node_modules/react-native-gradle-plugin')
include ':react-native-fs'
project(':react-native-fs').projectDir = new File(settingsDir, '../node_modules/react-native-fs/android')
include ':react-native-push-notification'
project(':react-native-push-notification').projectDir = file('../node_modules/react-native-push-notification/android')

if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") {
    include(":ReactAndroid")
    project(":ReactAndroid").projectDir = file('../node_modules/react-native/ReactAndroid')
    include(":ReactAndroid:hermes-engine")
    project(":ReactAndroid:hermes-engine").projectDir = file('../node_modules/react-native/ReactAndroid/hermes-engine')
}

[fxhrgco]

Having the same problem, in iOS it takes well the library, in Android I have undefined unless I import it like: import * as PushNotification from 'react-native-push-notification'

I ended up doing this:

import * as PN from 'react-native-push-notification';
const PushNotification = (PN as any) as PN.PushNotification;

to have the type done correctly.

If anyone has a better solution, be my guest.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 30 days if no further activity occurs. Thank you for your contributions.