{"id":4623,"url":"https://github.com/Neson/react-native-system-notification","last_synced_at":"2025-08-04T01:32:43.729Z","repository":{"id":57168250,"uuid":"79049837","full_name":"neson/react-native-system-notification","owner":"neson","description":"[WARNING: NOT MAINTAINED] Android system notifications for React Native. Supports push notifications with GCM integrated. Another push-notification solution on Android is https://github.com/zo0r/react-native-push-notification, it features on providing the same API on iOS and Android, while this one supports more notification features on Android.","archived":false,"fork":true,"pushed_at":"2016-10-28T19:33:28.000Z","size":1176,"stargazers_count":16,"open_issues_count":0,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-03T04:11:26.615Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/react-native-system-notification","language":"Java","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"zetavg/react-native-system-notification","license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/neson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-01-15T18:06:51.000Z","updated_at":"2023-11-14T03:29:36.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/neson/react-native-system-notification","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/neson/react-native-system-notification","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neson%2Freact-native-system-notification","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neson%2Freact-native-system-notification/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neson%2Freact-native-system-notification/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neson%2Freact-native-system-notification/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/neson","download_url":"https://codeload.github.com/neson/react-native-system-notification/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neson%2Freact-native-system-notification/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268636466,"owners_count":24282092,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-03T02:00:12.545Z","response_time":2577,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-01-05T20:17:18.247Z","updated_at":"2025-08-04T01:32:43.403Z","avatar_url":"https://github.com/neson.png","language":"Java","readme":"# react-native-system-notification [![npm version](https://img.shields.io/npm/v/react-native-system-notification.svg?style=flat-square)](https://www.npmjs.com/package/react-native-system-notification)\n\nSend or schedule Android system notifications for React Native.\n\n\u003cimg width=\"35%\" align=\"right\" hspace=\"1\" vspace=\"1\" src=\"http://i.imgur.com/cY2Z9GH.png\"\u003e\u003c/img\u003e\n\n## Table of Contents\n\n  * [Installation](#installation)\n  * [Usage](#usage)\n    * [Creating Notifications](#creating-notifications)\n      * [Basic](#basic)\n      * [Scheduling](#scheduling)\n      * [Customization](#customization)\n    * [Handle Notification Click Event](#handle-notification-click-event)\n    * [Manage Scheduled Notifications](#manage-scheduled-notifications)\n    * [Clearing Notifications](#clearing-notifications)\n  * [Push Notifications On Android](#push-notifications-on-android)\n\n---\n\n```js\nimport React, { DeviceEventEmitter } from 'react-native';\nimport Notification from 'react-native-system-notification';\n\n// Send a simple notification\nNotification.create({ subject: 'Hey', message: 'Yo! Hello world.' });\n\n// Listen to notification-clicking events\nNotification.addListener('press', function(e) {\n  console.log(e);\n});\n\n// Custom payload for notifications\nNotification.create({\n  subject: 'Notification With Payload',\n  message: 'This is a notification that contains custom payload.',\n  payload: { number: 1, what: true, someAnswer: '42' }\n});\n\n// Receive the payload on notification events\nNotification.addListener('press', function(e) {\n  console.log(e.payload);  // =\u003e { number: 1, what: true, someAnswer: '42' }\n});\n\n// Customize notification\nNotification.create({\n  subject: 'Notification With Custom Icon',\n  message: 'This is a notification with a specified icon.',\n  smallIcon: 'ic_alert'\n});\n\n// Scheduled notifications\nNotification.create({\n  subject: 'Scheduled Notification',\n  message: 'This notification will show on every Friday morning at 8:30 AM, starts at 2015/9/9 and end after 10 times.',\n  sendAt: new Date(2015, 9, 9, 8, 30),\n  repeatEvery: 'week',\n  count: 10\n});\n```\n\n## Installation\n\n- Run `npm install react-native-system-notification --save` to install using npm.\n\n- Add the following two lines to `android/settings.gradle`:\n\n```gradle\ninclude ':react-native-system-notification'\nproject(':react-native-system-notification').projectDir = new File(settingsDir, '../node_modules/react-native-system-notification/android')\n```\n\n- Edit `android/app/build.gradle` and add the annoated lines as below:\n\n```gradle\n...\n\ndependencies {\n    compile fileTree(dir: \"libs\", include: [\"*.jar\"])\n    compile \"com.android.support:appcompat-v7:23.0.1\"\n    compile \"com.facebook.react:react-native:0.16.+\"\n    compile project(':react-native-system-notification')  // \u003c- Add this line\n}\n```\n\n- Edit `android/app/src/main/AndroidManifest.xml` and add the annoated lines as below:\n\n```xml\n\u003cmanifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    package=\"com.reactnativeproject\"\u003e\n\n    \u003cuses-permission android:name=\"android.permission.INTERNET\" /\u003e\n    \u003cuses-permission android:name=\"android.permission.GET_TASKS\" /\u003e                       \u003c!-- \u003c- Add this line --\u003e\n    \u003cuses-permission android:name=\"android.permission.RECEIVE_BOOT_COMPLETED\"/\u003e           \u003c!-- \u003c- Add this line --\u003e\n    \u003cuses-permission android:name=\"android.permission.VIBRATE\"/\u003e                          \u003c!-- \u003c- Add this line --\u003e\n\n    \u003capplication\n      android:allowBackup=\"true\"\n      android:label=\"@string/app_name\"\n      android:icon=\"@mipmap/ic_launcher\"\n      android:theme=\"@style/AppTheme\"\u003e\n\n...\n\n      \u003cactivity android:name=\"com.facebook.react.devsupport.DevSettingsActivity\" /\u003e\n      \u003creceiver android:name=\"io.neson.react.notification.NotificationEventReceiver\" /\u003e   \u003c!-- \u003c- Add this line --\u003e\n      \u003creceiver android:name=\"io.neson.react.notification.NotificationPublisher\" /\u003e       \u003c!-- \u003c- Add this line --\u003e\n      \u003creceiver android:name=\"io.neson.react.notification.SystemBootEventReceiver\"\u003e       \u003c!-- \u003c- Add this line --\u003e\n        \u003cintent-filter\u003e                                                                   \u003c!-- \u003c- Add this line --\u003e\n          \u003caction android:name=\"android.intent.action.BOOT_COMPLETED\"\u003e\u003c/action\u003e           \u003c!-- \u003c- Add this line --\u003e\n        \u003c/intent-filter\u003e                                                                  \u003c!-- \u003c- Add this line --\u003e\n      \u003c/receiver\u003e                                                                         \u003c!-- \u003c- Add this line --\u003e\n    \u003c/application\u003e\n\n\u003c/manifest\u003e\n```\n\n\u003e The `RECEIVE_BOOT_COMPLETED` permission is used to re-register all scheduled notifications after reboot.\n\u003e Requesting `VIBRATE` permission is required if you want to make the device vibrate while sending notifications.\n\n- Edit `MainActivity.java` (usually at `android/app/src/main/java/com/\u003cproject-name\u003e/MainActivity.java`) and add the annoated lines as below:\n\n```java\n...\n\nimport android.content.Intent;\nimport android.os.Bundle;\n\nimport com.facebook.react.ReactActivity;\nimport com.facebook.react.ReactPackage;\nimport com.facebook.react.shell.MainReactPackage;\n\nimport io.neson.react.notification.NotificationPackage;    // \u003c- Add this line\n\npublic class MainApplication extends Application implements ReactApplication {\n\n...\n\n    @Override\n    protected List\u003cReactPackage\u003e getPackages() {\n        return Arrays.\u003cReactPackage\u003easList(\n            ...\n            new NotificationPackage()                  // \u003c- Add this line\n        );\n    }\n\n...\n```\n\n## Usage\n\n### Creating Notifications\n\nJust do:\n\n```js\nNotification.create({\n  id: 1337,\n  subject: 'Notification With Payload',\n  message: 'This is a notification that contains custom payload.',\n  smallIcon: 'ic_launcher',\n  autoClear: true,\n  payload: { number: 1, what: true, someAnswer: '42' }\n});\n```\n\n\u003e All functions of this module will return [promise](https://www.promisejs.org/)s with the notification object handing in. So you can get the data of the notification and do anything that is needed, like this:\n\u003e\n\u003e ```js\n\u003e Notification.create({ message: 'Testing.' }).then(function(notification) {\n\u003e   console.log(notification);\n\u003e   console.log(notification.id);\n\u003e });\n\u003e ```\n\nAll available options on a notification are listed below:\n\n#### Basic\n\n**id (`number`)**\nThe unique ID of this notification. It will be randomly chosen if not specified.\n\n**subject (`string`)**\nThe notification subject. Defaults to the application name on Android.\n\n**message (`string`)**\nThe message showen in the notification.\n\n**action (`string`)**\nAn action name that can be used to determine what to do when this notification is clicked. Defaults to `DEFAULT`.\n\n**payload (`object`)**\nA custom payload object. It can be retrieved on events of this notification. Defaults to `{}`.\n\n\n#### Scheduling\n\n**delay (`number`)**\nMilliseconds to delay before showing this notification after it is created. Useful when creating countdown alarms, reminders, etc. Note that it cannot be used with `sendAt`.\n\n**sendAt (`Date`)**\nSchedule this notification to show on a specified time. Note that it cannot be used with `delay`.\n\n**repeatEvery (`string` or `number`)**\nMust use with `sendAt`. Schedule this notification to repeat. Can be `minute`, `hour`, `halfDay`, `day`, `week`, `month`, `year` or a number of time in milliseconds.\n\n**repeatCount (`number`)**\nMust use with `sendAt` and `repeatEvery`. End repeating this notification after n times. Note that it cannot be used with `endAt`.\n\n**endAt (`Date`)**\nMust use with `sendAt` and `repeatEvery`. End repeating this notification after a specified time. Note that it cannot be used with `repeatCount`.\n\n\n\u003e Some Samples of Scheduled Notifications\n\u003e\n\u003e ```js\n\u003e Notification.create({\n\u003e   subject: 'Scheduled Notification',\n\u003e   message: 'This notification will show on every Friday morning at 8:30 AM, starts at 2015/9/9 and end after 10 times.',\n\u003e   sendAt: new Date(2015, 9, 9, 8, 30),\n\u003e   repeatEvery: 'week',\n\u003e   repeatCount: 10\n\u003e });\n\u003e ```\n\u003e\n\u003e ```js\n\u003e Notification.create({\n\u003e   subject: 'Scheduled Notification',\n\u003e   message: 'This notification will show on 2015/9/9 morning at 8:30 AM, and repeat for 10 times every minute.',\n\u003e   sendAt: new Date(2015, 9, 9, 8, 30),\n\u003e   repeatEvery: 60000,\n\u003e   repeatCount: 10\n\u003e });\n\u003e ```\n\u003e\n\u003e ```js\n\u003e Notification.create({\n\u003e   subject: 'Delayed Notification',\n\u003e   message: 'This notification will show after 10 seconds, even the app has been stoped.',\n\u003e   delay: 10000\n\u003e });\n\u003e ```\n\n#### Customization\n\n**priority (`number`)**\nPriority of this notification, can be `-2`, `-1`, `0`, `1`, `2`. When this is set to `1` or `2`, heads-up notification will be more likely to show on Android 5+. Defaults to `1`.\n\n**smallIcon (`string`)**\nThe icon (file name) to show. This icon must be placed in the project's `android/app/src/main/res/mipmap-*` folder. Defaults to `ic_launcher`.\n\n**largeIcon (`string`)**\nNot yet implemented.\n\n**sound (`string`)**\nSet the sound to play. Defaults to `default` as using the default notification sound, or set this to `null` to disable the sound. Other options are not yet implemented.\n\n**vibrate (`string`)**\nSet the vibration pattern to use. Defaults to `default` as using the default notification vibrate, or set this to `null` to disable the vibrate. Other options are not yet implemented.\n\n**lights (`string`)**\nSet the desired color for the indicator LED on the device. Defaults to `default` as using the default notification lights, or set this to `null` to disable the lights. Other options are not yet implemented.\n\n**autoClear (`boolean`)**\nClear this notification automatically after the user clicks on it. Defaults to `true`.\n\n**onlyAlertOnce (`boolean`)**\nDo not let the sound, vibrate and ticker to be played if the notification is already showing.\n\n**tickerText (`string`)**\nSet the text to show on ticker. Defaults to `\u003csubject\u003e: \u003cmessage\u003e`. Set this to `null` to disable ticker.\n\n**when (`Date`)**\nAdd a timestamp pertaining to the notification (usually the time the event occurred).\n\n**bigText (`string`)**\nSet the text to be shown when the user expand the notification.\n\n**bigStyleImageBase64 (`string`)**\nSet the image in base64 to be shown when the user expand the notification. if bigText is not null, it have priority over bigStyleImageBase64.\n\n**bigStyleUrlImgage (`string`)**  \nSet URL of a image. Geting it by open a stream connection and it be shown when the user expand the notification.. if bigText is not null, it have priority over bigStyleUrlImgage\n\n**subText (`string`)**\nSet the third line of text in the platform notification template. Note that it cannot be used with `progress`.\n\n**progress (`number`)**\nSet the progress this notification represents, range: `0.0` ~ `1.0`. Set this to a number lower then zero to get an indeterminate progress. Note that it cannot be used with `subText`.\n\n**color (`string`)**\nColor to be applied by the standard Style templates when presenting this notification.\n\n**number (`number`)**\nSet a number on the notification.\n\n**private (`boolean`)**\nNot yet implemented.\n\n**ongoing (`boolean`)**\nNot yet implemented.\n\n**category (`string`)**\nSet the notification category, e.g.: `alarm`, `call`, `email`, `event`, `progress`, `reminder`, `social`. It may be used by the Android system for ranking and filtering.\n\n**localOnly (`boolean`)**\nSet whether or not this notification should not bridge to other devices.\n\n### Handle Notification Click Event\n\nRegister a listener on `sysNotificationClick` events to handle notification clicking:\n\n```js\nNotification.addListener('press', function(e) {\n  console.log(e);\n});\n```\n\nThe action and payload of the notification can be retrieved on these events:\n\n```js\nNotification.send({ message: 'Message', action: 'ACTION_NAME', payload: { data: 'Anything' } });\n```\n\n```js\nNotification.addListener('press', function(e) {\n  switch (e.action) {\n    case 'ACTION_NAME':\n      console.log(`Action Triggered! Data: ${e.payload.data}`);\n      break;\n\n    case 'ANOTHER_ACTION_NAME':\n      console.log(`Another Action Triggered! Data: ${e.payload.data}`);\n      break;\n  }\n});\n```\n\nOnce you no longer need to listen to `sysNotificationClick` events de-register the listener functions with:\n\n```js\nNotification.removeAllListeners('press');\n```\n\n### Manage Scheduled Notifications\n\nSometimes you'll need to get the scheduled notifications (which has `delay` or `sendAt` set up) that you had created before. You can use `Notification.getIDs()` to retrieve an array of IDs of available (i.e. will be send in the future) scheduled notifications.\n\n```js\nNotification.getIDs().then(function(ids) {\n  console.log(ids);  // Array of ids\n});\n```\n\nand use `Notification.find(notificationID)` to get data of an notification.\n\n```js\nNotification.find(notificationID).then(function(notification) {\n  console.log(notification);\n});\n```\n\nor just cancel it with `Notification.delete(notificationID)`:\n\n```js\nNotification.delete(notificationID);\n```\n\nWant to cancel all scheduled notifications set by your app? Sure:\n\n```js\nNotification.deleteAll();\n```\n\n\u003e To update a scheduled notification, just use `Notification.create()` with the same id.\n\n### Clearing Notifications\n\nWhen you want to clear a notification from the system statusbar, just use:\n\n```js\nNotification.clearAll();\n```\n\nor:\n\n```js\nNotification.clear(notificationID);\n```\n\n\n## Push Notifications On Android\n\nSending push notification via web servers to Android is also easy! With [react-native-gcm-android](https://github.com/oney/react-native-gcm-android) intergrated, you can just pass notification arguments through GCM (with the same format as JavaScript), your app will show it directly or put it into schedule. To set this up, follow these directions:\n\n1. Run `npm install react-native-gcm-android --save` to add react-native-gcm-android to your app\n\n2. Setup GCM, follow [react-native-gcm-android](https://github.com/oney/react-native-gcm-android/tree/17b1e54)'s [README](https://github.com/oney/react-native-gcm-android/blob/17b1e54/README.md) to get GCM working.\n\n3. Open `android/app/src/main/AndroidManifest.xml`, change `com.oney.gcm.RNGcmListenerService` to `io.neson.react.notification.GCMNotificationListenerService`.\n\nThen you can send push notifications like this, putting an `notification` object (just as the same thing that you use in JavaScript Notification.create()) into the GCM `data` (curl example):\n\n```bash\ncurl -X POST -H \"Authorization: key=\u003cyour_google_api_key\u003e\" -H \"Content-Type: application/json\" -d '\n{\n  \"data\": {\n    \"notification\": {\n      \"subject\": \"Hello GCM\",\n      \"message\": \"Hello from the server side!\"\n    }\n  },\n  \"to\" : \"\u003cdevice_token\u003e\"\n}' 'https://gcm-http.googleapis.com/gcm/send'\n```\n\nThe notification will be created natively (so this works even if the app is closed) when the device received the GCM message.\n","funding_links":[],"categories":["Components"],"sub_categories":["System"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FNeson%2Freact-native-system-notification","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FNeson%2Freact-native-system-notification","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FNeson%2Freact-native-system-notification/lists"}