react-native-schedule-notification
Advanced tools
react-native-schedule-notification is a react native package built with Nitro
A powerful and efficient React Native library for scheduling recurring local notifications on iOS and Android, built with Nitro Modules for maximum performance.
[!IMPORTANT]
To supportNitro Viewsyou need to install React Native version v0.78.0 or higher.
npm install react-native-schedule-notification react-native-nitro-modules
or using Yarn:
yarn add react-native-schedule-notification react-native-nitro-modules
cd ios && pod install
The library automatically requests permissions when you schedule the first notification. However, you can customize the permission prompt by adding to your Info.plist:
<key>NSUserNotificationAlertStyle</key>
<string>alert</string>
The following permissions are automatically added by the library:
<uses-permission android:name="android.permission.POST_NOTIFICATIONS" />
<uses-permission android:name="android.permission.SCHEDULE_EXACT_ALARM"/>
The library automatically registers the necessary receivers and activities. No additional configuration is required.
For Android 13 and above, the POST_NOTIFICATIONS permission needs to be requested at runtime. You can use libraries like react-native-permissions to handle this:
import { request, PERMISSIONS, RESULTS } from 'react-native-permissions';
const requestNotificationPermission = async () => {
const result = await request(PERMISSIONS.ANDROID.POST_NOTIFICATIONS);
return result === RESULTS.GRANTED;
};
import ScheduledNotifications from 'react-native-schedule-notification';
or with named imports:
import { schedule, cancel, addListener } from 'react-native-schedule-notification';
// Schedule a daily notification at 9:00 AM
ScheduledNotifications.schedule(
'daily',
{
id: 'daily-reminder',
title: 'Daily Reminder',
message: "Don't forget to check your tasks!",
},
{
hour: 9,
minute: 0,
}
);
// Schedule a notification every Monday at 10:30 AM
ScheduledNotifications.schedule(
'weekly',
{
id: 'weekly-meeting',
title: 'Weekly Meeting',
message: 'Your weekly meeting starts in 30 minutes',
},
{
hour: 10,
minute: 30,
dayOfWeek: 2, // 1 = Sunday, 2 = Monday, ... 7 = Saturday
}
);
// Schedule a notification on the 15th of every month at 2:00 PM
ScheduledNotifications.schedule(
'monthly',
{
id: 'monthly-report',
title: 'Monthly Report',
message: 'Time to submit your monthly report',
},
{
hour: 14,
minute: 0,
dayOfMonth: 15,
}
);
// Cancel a specific notification
ScheduledNotifications.cancel('daily-reminder');
import { useEffect } from 'react';
function App() {
useEffect(() => {
// Add listener for notification clicks
const unsubscribe = ScheduledNotifications.addListener((notificationId) => {
console.log('Notification clicked:', notificationId);
// Handle actions based on notification ID
switch(notificationId) {
case 'daily-reminder':
// Navigate to tasks screen
break;
case 'weekly-meeting':
// Open calendar
break;
}
});
// Cleanup - remove listener
return () => unsubscribe();
}, []);
}
interface NotificationProps {
id: string; // Unique notification identifier
title: string; // Notification title
message: string; // Notification body/message
}
interface DailyScheduleDate {
hour: number; // Hour (0-23)
minute: number; // Minute (0-59)
}
interface WeeklyScheduleDate {
hour: number; // Hour (0-23)
minute: number; // Minute (0-59)
dayOfWeek: number; // Day of week (1=Sun, 2=Mon, ..., 7=Sat)
}
interface MonthlyScheduleDate {
hour: number; // Hour (0-23)
minute: number; // Minute (0-59)
dayOfMonth: number; // Day of month (1-31)
}
schedule(frequency, notification, scheduleDate)Schedules a recurring notification.
Parameters:
frequency: 'daily' | 'weekly' | 'monthly' - Notification frequencynotification: NotificationProps - Notification datascheduleDate: DailyScheduleDate | WeeklyScheduleDate | MonthlyScheduleDate - Schedule configurationReturns: void
cancel(id)Cancels a scheduled notification.
Parameters:
id: string - ID of the notification to cancelReturns: void
addListener(callback)Adds a listener for notification click events.
Parameters:
callback: (id: string) => void - Function called when a notification is clickedReturns: () => void - Function to remove the listener
// hooks/useNotifications.js
import { useEffect, useCallback } from 'react';
import ScheduledNotifications from 'react-native-schedule-notification';
export function useNotifications() {
useEffect(() => {
const unsubscribe = ScheduledNotifications.addListener((id) => {
console.log('Notification interacted:', id);
});
return unsubscribe;
}, []);
const scheduleWaterReminder = useCallback(() => {
// Water reminder every 2 hours during the day
const hours = [9, 11, 13, 15, 17, 19];
hours.forEach((hour, index) => {
ScheduledNotifications.schedule(
'daily',
{
id: `water-reminder-${index}`,
title: '💧 Time to Drink Water',
message: 'Stay hydrated! Drink a glass of water.',
},
{
hour,
minute: 0,
}
);
});
}, []);
const scheduleMedicationReminder = useCallback((medication, time) => {
ScheduledNotifications.schedule(
'daily',
{
id: `medication-${medication.id}`,
title: '💊 Medication Reminder',
message: `Time to take ${medication.name}`,
},
{
hour: time.hour,
minute: time.minute,
}
);
}, []);
const cancelAllReminders = useCallback(() => {
// Cancel all water reminders
for (let i = 0; i < 6; i++) {
ScheduledNotifications.cancel(`water-reminder-${i}`);
}
}, []);
return {
scheduleWaterReminder,
scheduleMedicationReminder,
cancelAllReminders,
};
}
import React, { useState } from 'react';
import {
View,
Text,
Switch,
Button,
StyleSheet,
ScrollView,
} from 'react-native';
import ScheduledNotifications from 'react-native-schedule-notification';
function NotificationSettings() {
const [dailyEnabled, setDailyEnabled] = useState(false);
const [weeklyEnabled, setWeeklyEnabled] = useState(false);
const toggleDailyNotification = (enabled) => {
setDailyEnabled(enabled);
if (enabled) {
ScheduledNotifications.schedule(
'daily',
{
id: 'daily-summary',
title: '📊 Daily Summary',
message: 'Check your daily activity summary',
},
{
hour: 20,
minute: 0,
}
);
} else {
ScheduledNotifications.cancel('daily-summary');
}
};
const toggleWeeklyNotification = (enabled) => {
setWeeklyEnabled(enabled);
if (enabled) {
ScheduledNotifications.schedule(
'weekly',
{
id: 'weekly-review',
title: '📅 Weekly Review',
message: 'Time to review your weekly goals',
},
{
hour: 18,
minute: 0,
dayOfWeek: 1, // Sunday
}
);
} else {
ScheduledNotifications.cancel('weekly-review');
}
};
return (
<ScrollView style={styles.container}>
<Text style={styles.title}>Notification Settings</Text>
<View style={styles.settingRow}>
<Text style={styles.settingText}>Daily Summary</Text>
<Switch
value={dailyEnabled}
onValueChange={toggleDailyNotification}
/>
</View>
<View style={styles.settingRow}>
<Text style={styles.settingText}>Weekly Review</Text>
<Switch
value={weeklyEnabled}
onValueChange={toggleWeeklyNotification}
/>
</View>
</ScrollView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 20,
},
title: {
fontSize: 24,
fontWeight: 'bold',
marginBottom: 20,
},
settingRow: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
paddingVertical: 15,
borderBottomWidth: 1,
borderBottomColor: '#e0e0e0',
},
settingText: {
fontSize: 16,
},
});
export default NotificationSettings;
cd ios && pod install after installationios/Pods and ios/Podfile.lock, then run pod install againPOST_NOTIFICATIONS permission at runtimecd android && ./gradlew cleancompileSdkVersion is 33 or higher for Android 13 supportWe welcome contributions! Please see our Contributing Guide for details.
git checkout -b feature/amazing-feature)git commit -m 'Add amazing feature')git push origin feature/amazing-feature)This project is licensed under the MIT License - see the LICENSE file for details.
For bugs and feature requests, please open an issue.
For questions and support, please use the Discussions section.
Made with ❤️ by Gabriel Pereira
FAQs
react-native-schedule-notification is a react native package built with Nitro
The npm package react-native-schedule-notification receives a total of 1 weekly downloads. As such, react-native-schedule-notification popularity was classified as not popular.
We found that react-native-schedule-notification demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Security News
The PHP Foundation says Chainguard broke a security embargo ahead of critical RCE patches, as leaks disrupted the coordinated release.
Security News
PHP releases emergency patches for two critical RCE vulnerabilities as agencies urge organizations to take unpatched sites offline.
Threat Research
/Security News
A supply chain attack compromised LiteLLM 1.107.0 on PyPI and Docker, spreading malware that steals cloud credentials, developer secrets, and AI provider keys.