I'm using EXPO to create an app for Android and iOS, with React Native. There is a weird behavior in this code: It's working properly on the Expo App, but it's not working in the real devices (standalone build) (happening on iOS AND Android).
The logic of these Local notifications is the following: The idea is to show to the user 3 local notifications:
- The first one, 1 week after the last time the user opened the app
- The second one, 1 month after the last time the user opened the app
- The last one, 2 months after the last time the user opened the app
How do I do it?
The first time the app is opened, I ask the user if she wants to see notifications. If the user says YES, I write that info in the local storage, and then I request the USER_FACING_NOTIFICATIONS permission to show local notifications.
I'm using USER_FACING_NOTIFICATIONS because I don't send remote notifications.
Then, the second time the user opens the app, I do the following:
- I remove all the previous notifications
- I check if the user WANTS to see notifications
- I check if the user/device GAVE US permissions to show notifications
- I schedule the 3 notifications.
Here, part of the code:
componentDidMount() {
cancelAllScheduled()
.then(() => {
getUserNotificationsPermission().then(userWants => {
if (userWants) {
getDeviceNotificationsPermission().then(grantedByDevice => {
if (grantedByDevice) {
scheduleNotifications();
}
});
}
});
})
.catch(() => {
// :shrug:
});
}
Here, all those utils functions:
// Cancel all the notifications
const cancelAllScheduled = () => {
return ExpoNotifications.cancelAllScheduledNotificationsAsync();
}
// Check in local storage if the user WANTS to see notifications
const getUserNotificationsPermission = () => {
return AsyncStorage.getItem('userNotificationPermission').then(data => {
let isEnabled;
try {
isEnabled = JSON.parse(data);
} catch (error) {
isEnabled = false;
}
return isEnabled;
});
};
// Check if user/device ALLOW US to show notifications
const getDeviceNotificationsPermission = () => {
return Permissions.getAsync(Permissions.USER_FACING_NOTIFICATIONS).then(({ status }) => {
return status === 'granted';
});
};
// Add days
// https://stackoverflow.com/a/19691491/1815449
const _addDays = (date, days) => {
var result = new Date(date);
result.setDate(result.getDate() + days);
return result;
};
// Schedule all the notifications
// One notification is going to be shown on 1 week
// Other notification in 1 month
// Other notification in 2 month
const scheduleNotifications = () => {
const now = new Date();
const oneWeek = {
title: 'We miss you!',
body: "Come to see what we've been up to and share your latest adventures with us!",
data: {
type: 'WEEKLY',
},
};
const oneWeekOptions = { time: _addDays(now, 7) };
ExpoNotifications.scheduleLocalNotificationAsync(oneWeek, oneWeekOptions);
const oneMonth = {
title: 'We miss you!',
body: "Come to see what we've been up to and share your latest adventures with us!",
data: {
type: 'MONTHLY',
},
};
const oneMonthOptions = { time: _addDays(now, 30) };
ExpoNotifications.scheduleLocalNotificationAsync(oneMonth, oneMonthOptions);
const twoMonth = {
title: 'We miss you!',
body: "Come to see what we've been up to and share your latest adventures with us!",
data: {
type: 'MONTHLY 2',
},
};
const twoMonthOptions = { time: _addDays(now, 60) };
ExpoNotifications.scheduleLocalNotificationAsync(twoMonth, twoMonthOptions);
};
Do you see any clue about why this could not be working? I already opened the app and granted all the permissions and killed and opened the app again close to 1.000 times hehehe. The last months I didn't open the app for 9 days (I did it 3 times) and I never saw any notification. But, the notifications are properly shown in the Expo Dev App.
Ps.: I do the cancelAllScheduled every time the user opens the app because these notifications need to be reset every time the user opens the app, due to I want to show then weeks after "the last time app was opened"
Ps2.: This is the documentation I followed to implement it:
