React-native-local-notification-fabric NPM

react-native-local-notification-fabric

React Native Local Notification for Android and iOS

Schedule Local notifications.
Create Local notifications based on Geolocation.
Cancel Local notification by Identifier.

Installation

npm install react-native-local-notification-fabric

// override onActivityResult function in MainActivity.kt file


override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    reactNativeHost.reactInstanceManager.packages.forEach {p: ReactPackage ->
      if (p is LocalNotificationPackage) {
        p.handleActivityResult(requestCode, resultCode, data)
      }
    }
}

//Config notification accent color and icon, alert dialog permission
Inside MainApplication.kt file, changes these line

override fun getPackages(): List<ReactPackage> {
  // Packages that cannot be autolinked yet can be added manually here, for example:
  // packages.add(new MyReactNativePackage());
  return PackageList(this).packages.apply {
    forEach { reactPackage ->
      if (reactPackage is LocalNotificationPackage) {
        reactPackage.initConfig(
          NotificationConfig(
            notificationIconResId = android.R.drawable.ic_lock_idle_charging,
            notificationAccentColor = Color.RED,
            locationPermissionDialogTitle = "Location permission required",
            allowButtonText = "Allow"
          )
        )
      }
    }
  }
}

Change AndroidManifest.xml
// add permissions
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SCHEDULE_EXACT_ALARM" />
    <uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_BACKGROUND_LOCATION" />
// add receiver inside application tag
<application
    .......
    >
    .......
    <receiver android:name="com.localnotification.NotificationReceiver" android:exported="false"/>
 </application>

Usage

import {
  scheduleNotification,
  scheduleGeofenceNotification,
  cancelNotificationById,
} from 'react-native-local-notification-fabric';

// ...

// schedule notification at specific date

scheduleNotification('Test', 'body', '1113', '2023-07-18T09:49:00.000Z');

// schedule geofencing

scheduleGeofenceNotification(
  'Test Geofence',
  'On entering 266 Đội Cấn',
  '1123',
  21.03698,
  105.813469,
  500.0,
  true,
  false
);

//cancel
cancelNotification('1123');