How to refetch data on click push notification using React-Native?

Question

. 。 Answers to this question are eligible for a +100 reputation bounty. theUltimateKafka wants to to this question. 。

In my React-Native project I have implemented expo-push-notification module, I can say everything works as expected, but I have problem which I do not know how to solve, whenuser receives a message and clicks on it

1.I want to redirect to a specific screen 2. I want to refetch data and call specific API endpoint 3.I also want this feature to work when App is Foreground or Background

My project is on the Bare workflow.

After many research I could not find hint that would give me the right direction.

How realistic it is to achieve this goal with React-Native?

Answer 1

In your scenario, you'll need to use addNotificationReceivedListener, this listener will be triggered after the user clicks on the notification, inside that listener you can access the notification response data and navigate to another screen.

You can read more about it here https://docs.expo.dev/push-notifications/receiving-notifications/

Example of the notification listener function

const handleNotificationResponse = (response: NotificationResponse) => {
    const { data } = response.notification.request.content
    if (data) {
        navigationRef?.current?.push('your_screen_name', {
            id: data?.id,
            otherImportantData: data.others,
          })
    }
  }