Alert is not displayed....When clicking on push notifications - react-native

I am running sample application..... I am using this module for push notifications..... My problem is when clicking on push notifications after clearing the instance of the app...In onNotification() console is printed but the alert is not displayed.... even try to keep time out for the alert but it doesn't work..... this is a problem is getting for the only iOS....... Please give any suggestions.......
onNotification: notification => {
console.log('NOTIFICATION:', notification)
if(notification.notificationType === XXX){
alert('NOTIFICATION:'+JSON.stringify(notification))
}
}

Related

ServiceWorkerRegistration.showNotification in PWA, bring app to foreground

I'm showing notification in my PWA. It works and it shows the notification. But i cant seem to find out how to bring the app to foreground if you click the notification (if possible)?
Usecase:
A notification is showned to the user while he is on facebook. Then when the user clicks the notification, then i would like my app to go to foreground.
Is this possible when im not working natively?
Here is my test code:
navigator.serviceWorker.register('service-worker.js');
Notification.requestPermission(function(result) {
if (result === 'granted') {
navigator.serviceWorker.ready.then(function(registration) {
registration.showNotification('Notification with ServiceWorker');
});
}
});
So my problem was my lack of knowledge! I had not figured out that the onclick handler should be placed in the service-worker.
I found good help here:
https://developers.google.com/web/fundamentals/push-notifications
https://web-push-book.gauntface.com/demos/notification-examples/
You can open a URL within your PWA. It will open it in a new tab in the browser, even if there is a tab already open to your PWA.
handleResponse( event ) {
console.log( '[Service Worker] Notification click Received. ${event}' );
if ( event.action && validURL( event.action ) ) {
clients.openWindow( event.action );
}
event.notification.close();
}

Expo push notifications listener not firing

I'm implementing push notifications in an app, but I need to handle the notification to navigate to a specific screen. The problem is that my listener never fires, I searched a lot on google and tried a lot of things but none of them worked..
I'm using AWS SNS together with FCM to send the push.
What I have is this in my App.tsx:
componentDidMount() {
Notifications.addListener(notification => {
alert("IT WORKED")
})
}
But ofcourse this alert is never called..
I read this issue https://github.com/expo/expo/issues/4183 and it seems that the format of the push matters, so right now I'm sending the push in this format:
{
"GCM": "{ \"notification\": { \"message\": \"Sample message for Android endpoints\", \"title\": \"Hello You...\" } }"
}
And I receive the push, but when I click on it to open the app, doesn't fire my listener, but in the issue the guy said to send like this:
{
"GCM": "{ \"data\": { \"message\": \"Sample message for Android endpoints\", \"title\": \"Hello world...\", \"body\": \"msg body\", \"experienceId\": \"#expousername/app-slug\" } }"
}
But if I send like this, I don't even receive the push.
What I'm doing wrong?

Clear Previous Expo Push Notifications

I have my app in Expo pushing a notification when somebody sends a message, but if that person sends multiple messages a second notification is pushed.
Is there anything I can do to clear the previous notification, or simply update the notification instead of adding a second notification to the list?
Basically I need to force an override or dismiss previous notifications.
The approach I was hoping to use was to add a listener which cleared notifications before appending, but it seems that this only works when the app is in the foreground.
Is there a recommended approach to this currently?
You can clear any or all previous notifications in expo-notifications. Your question is not clear but I am guessing you want to clear all previous notification if new notification is received. You have to spot the best place when to clear notifications on your code. But here are some tips (use the following code in the useEffect hook) -
// This listener is fired whenever a user taps on or interacts with a notification (works when app is foregrounded, backgrounded, or killed)
responseListener.current =
Notifications.addNotificationResponseReceivedListener((response) => {
// DISMISS ALL NOTIFICATION AFTER INTERACTION
Notifications.dismissAllNotificationsAsync();
});
If you want to dismiss specific notification in that case, use dismissNotificationAsync(identifier: string): Promise method.
Just in case, if you want to dismiss all notifications when receiving a new one while the app is foregrounded (use the following code in the useEffect hook).
// This listener is fired whenever a notification is received while the app is foregrounded
notificationListener.current =
Notifications.addNotificationReceivedListener((notification) => {
// setNotification(notification);
// DISMISS ALL NOTIFICATION UPON RECEIVING NOTIFICATION WHILE IN FOREGROUND
Notifications.dismissAllNotificationsAsync();
});
You can use Notifications.dismissAllNotificationsAsync() method or dismissNotificationAsync(identifier: string): Promise method anywhere you like but you need to spot where to best use them.
_handleNotification = (notification) => {
this.setState({notification: notification});
console.log('get notification', this.state.notification);
let localnotificationId = this.state.notification.notificationId;
setTimeout(function () {
Notifications.dismissNotificationAsync(localnotificationId);
}, 10000)
};
This is how I do in NodeJS

react native push notification that can be removed after button click

I am using react native v0.45.1.
How can I add to my application notification (no matter if the app is in the background or foreground) that the user can remove only after click an acknowledge button.
I don't want the user to swipe the notification aside without notice it.
how can it be done?
I am not sure https://github.com/wix/react-native-notifications will do what I need.
Edit
I want to have a notification that will act like:
'USB debugging connected
'Touch to disable USB debugging'
The notification can't be removed unless the user actively do something, in my case it will be 'click' on a button
after a lot of digging the solution I implemented was:
setting repeat interval for the notification.
for android:
repeatType: 'time',
repeatTime: timeSpan,
for iOS:
repeatType: 'minute',
when the user click the notification (decided its not the right approached to add actions - buttons - to notification):
PushNotification.configure({
onNotification: (notification) => {
console.log('NOTIFICATION:', notification);
const clicked = notification.userInteraction;
if (clicked) {
if (Platform.OS === 'ios') {
PushNotification.cancelLocalNotifications({ id: notification.data.id });
} else {
PushNotification.cancelLocalNotifications({ id: notification.id });
}
}
},
});
I am aware that this might not be the exact answer to this question. However,
I was looking for a similar solution earlier; how to remove notifications that hasn't been dismissed or opened by a user.
Sometimes the user might open the application / screen, without clicking on the notification. The notification will still be displayed in that case.
Using React Native with Expo, this is the solution I created for removing old notifications created using their Push Notification API.
import * as Notifications from "expo-notifications";
//...
// Remove notifications that exists for this conversation!
useEffect(() => {
Notifications.getPresentedNotificationsAsync().then(res => {
for (let k in res) {
if (
res[k].request.content.data &&
res[k].request.content.data.screen === "Conversations" &&
res[k].request.content.data.conversationId === conversationId
) {
Notifications.dismissNotificationAsync(res[k].request.identifier);
console.log("removed a notification for this conversation");
}
}
});
}, []);
By using the data sent to the Push Notification API, we can determine which notifications should be removed. in this case all notifications containing a conversationId matching the current value from the route are dismissed.

WL.Client.Push.isSubscribed() returns false if app reloaded

I have a simple Worklight V6 app using Push on Android. When the app starts up, it does a form based login against the SampleAppRealm. Then it subscribes if necessary:
function checkSubscribed() {
var subscribed = WL.Client.Push.isSubscribed("myPush");
alert("Is subscribed: " + subscribed);
return subscribed;
}
WL.Client.Push.onReadyToSubscribe = function() {
WL.Client.Push.registerEventSourceCallback("myPush", "PushAdapter",
"MyEventSource", function(props, payload) {
alert("Received message: " + props.alert);
});
if (!checkSubscribed()) {
WL.Client.Push.subscribe("myPush", {
onSuccess : function() {
alert("subscription succeeded!");
},
onFailure : function() {
alert("subscription failed!");
}
});
}
};
This all works swell. The app starts up, it logs in, onReadyToSubscribe() fires, it registers the callback, checks the subscription (which is false), and subscribes (which succeeds)
I can see the client subscription in the Worklight console, and if I call the adapter, I get the notification in the app.
If I hit the home button to do something else on the phone, and then return to the app, it still knows that it is subscribed. If I push a message when the app is in the background, I see it in the Android notification area, and see it in the app when I return to it. All good.
The problem is when I am running the app, it is subscribed, and I hit the Android back button. The app closes, but the Admin console still shows a subscribed client, and in fact if I push a message with the app closed, it shows up in the Android notification area. (so far so good)
But when I start the app, it goes through the authentication steps, onReadyToSubscribe() fires, checkSubscribed() gets called and WLClient.Push.isSubscribed() returns false.
If I restart the phone with the app subscribed, when the app restarts, WLClient.Push.isSubscribed() returns false.
How do I get the correct subscription state when an app restarts?
Answering my own question.
It turns out that the problem was that My app was explicitly calling WL.Client.login("SampleAppRealm") when it started. The application descriptor environment setting of a security test on the environment was not configured.
When I add the security test to the application descriptor, isSubscribed() returns the correct answer after an app is restarted. The funny bit is that everything else having to do with Push worked fine with authentication simply triggered by WL.Client.login()
I can't find any documentation around this requirement for the setting in the application descriptor, so it is hard to make out whether this is user error. At the least, the docs could be punched up in this area.