I am using react-native-firebase on a project to implement push notifications. One request came in to make the user navigate to a specific screen whenever one taps on the push notif alert.
react-navigation is being used for the screen navigation.
I use push to mimic an inbox feature in my app.
Can you please suggest the ways this can be implemented?
One solution would be to add the listener on a screen and the perform the navigation since in it will already have the navigation props. But I have too many screens. Another solution would be to have a reference to the root navigator and pass it to the pushnotification controller. But this fails as I use redux and if if I add the config option { withRef: true } , It complains saying that the ref passed is not a function.
Do you have a better way of doing it or indicate to me what am I doing wrong please?
Thanks and Kind Regards,
Avinash
I have a solution for you , you can add a listen in you App.js , save that notification in async storage and then Access that notification object on the same page where you handle the logic of login user if token is present (Checking if user is login you can navigate him to desired page ), there you can navigate user to desired screen ,
Here you can check two things ,
easily access to notification object , detect whether is clicked or received.
easy to user auth , which is must to check on push notification
Hope my answer make sense to you
I'm using a tabNavigator. In the first screen, I simply call the firebase listeners for push notifications and then I do the navigation.
Related
I have a notification listener, and I need the app to refresh when a specific notification arrives. How do I make the screen reload/refresh in react native?
For more context, my app has two types of users, anons and friends. When I send out a friend request to an anon, and they approve, I need to the screen to refetch users so that they are removed from anon list and added to the friend list.
A potential solution would be to dispatch a user fetch in the App.js where notification listeners are, but I wonder if it's slightly easier/cleaner or even possible to just cause a screen refresh (rerender) in react native.
On iOS, you can reply to text messages right from the push notification without opening the app. I want to do something similar in React Native, to have the user interact with a custom UI in a push notification without opening the app. At the moment I'm using react-native-onesignal, but I haven't found a way to get this functionality with OneSignal. Does anyone know how I can approach this?
I'm trying to navigate to a specific screen when user clicks a notification. I'm using react-native-push-notification and it works great. The problem is, for some reason navigation doesn't happen.
I call this function onNotification, and it's being executed
function onNotificationOpened(notification) {
console.log('navigating')
console.log(NavigationActions)
NavigationActions.navigate('Journal')
}
So 'navigating' is printed on the console, as well as NavigationActions with a function navigate in it. So it's there. But when app opens, navigation doesn't happen and the app stays on the same screen. There's no typo or anything in the screen name. After the app opens I can navigate normally. It doesn't matter if I put navigation there or not, the app still opens on the main screen.
I'm thinking that it could be that navigation does happen, but just a bit prior to app itself opens the main screen. I'm not sure of that of course, it's my guess.
Am I doing anything wrong here?
what you want to do is similar to deep linking,lock at this
,there are some helpful answers.
Try this on your onNotificationOpened function
let isBackground = notification.foreground;
if(isBackground == true){
this.props.navigation.navigate('Journal');
I am working on existing react native project and I want to find solution for pop action on navigation stack where I want to introduce new scene which is actually not on stack.
I have three different type of route based on state of user logged In, logged out or in locked state. So while user's app state is locked at that time on launch I am directing user to reset account page from launch scene.
Launch Scene -> Reset Account
But on back event of Reset Account, I want to show login page instead of Launch scene, but Login scene is not in stack as of now.
So how to insert new scene when user performs pop action ?
I am new to react native and I don't know how to modify navigation stack programmatically without performing any animation ?
In my project there is one package named react-native-router-flux to handle react navigation.
Any insight will be helpful.
I suggest you create a SwitchNavigator between LaunchScreen and AccountStack
AccountStack is a StackNavigator that render both:
LoginScreen.
ResetAccountScreen. << This would be your initialRoute.
Is there a way to navigate to the scene that the user is currently on? Almost the equivalent of refreshing the component?
I have a reusable component called ProfileScreen, which shows a user's profile. That user, by default, is the logged in user; but it can also be a user that they select on a different screen.
The problem is that if the user is on another user's profile, and tries to navigate (via Drawer) to their own profile, it does nothing. I've tried obfuscating the navigation actions inside of redux functions to no avail.
Right now I'm having it navigate briefly to a "Loading" component before navigating back to the profile scene, but this is far from an optimal solution.
Any thoughts?
Actions.refresh() will do the job