React Native Expo Push notification redirect not working properly


#1

I am successfully able to receive push notifications in my react native app but I am unable to make a redirect based on them. What happens is that on android, when I touch the notification, the app completely reloads and the notification data is lost. How can I handle this?

This is my code

import React from 'react';
import { AppState, View, StatusBar } from 'react-native';
import { ScreenHost } from './src/app/screen-host';
import { AppHost } from './src/debug/app-host';
import { settings } from './src/constants/settings';
import { services } from './src/services/services';
import Expo from 'expo';

async function getToken() {
  // Remote notifications do not work in simulators, only on device
  if (!Expo.Constants.isDevice) {
    return;
  }
  let { status } = await Expo.Permissions.askAsync(
    Expo.Permissions.NOTIFICATIONS,
  );
  if (status !== 'granted') {
    return;
  }
  let value = await Expo.Notifications.getExpoPushTokenAsync();
  console.log('Our token', value);
}

export default class App extends React.Component {

  state = {
    appState: AppState.currentState,
    conv_id: ''
  }

  componentDidMount() {
    getToken();
    AppState.addEventListener('change', this._handleAppStateChange);
    //Expo.Notifications.setBadgeNumberAsync(0);
  }  

  componentWillUnmount() {
    this.listener && this.listener.remove();
    AppState.removeEventListener('change', this._handleAppStateChange);
  }

  _handleAppStateChange = (nextAppState) => {
    if(this.state.conv_id == ''){
      this.listener = Expo.Notifications.addListener(this.handleNotification);
    }
    if (this.state.appState.match(/inactive|background/) && nextAppState === 'active') {
      console.log('App has come to the foreground!');
      if(this.state.conv_id != ''){
        services.store.gotoConversation(this.state.conv_id);
      }
    }
    Expo.Notifications.setBadgeNumberAsync(0);
    this.setState({appState: nextAppState});
  }

  handleNotification = ({ origin, data }) => {
    console.log(origin);
    this.state.conv_id = data.conv_id;
  };

  render() {
    if (settings.useDebugLayout) {
      return (
        <AppHost>
          <AppMain />
        </AppHost>
      );
    } else {
      return (
        <AppMain />
      );
    }
  }
}

class AppMain extends React.Component {
  render() {
    return (
      <View style={{ flex: 1 }}>
        <StatusBar barStyle="light-content" />
        <ScreenHost data={services.store._showNav}/>
      </View>
    );
  }
}

I want to call my services.store.gotoConversation(this.state.conv_id); but the screen loads the splash screen and the notification data is lost.

I went through

https://docs.expo.io/versions/latest/guides/push-notifications

But i can’t seem to figure what is the main issue. Please help me.


#2

can you post a github link to your whole project? i can’t figure out your issue just by reading this code here.


#3

@ccheever I don’t have a github but can we do teamviewer?