notificationCenter.js

import React, { Component } from 'react';
import { PropTypes } from 'prop-types';
import { connect } from 'react-redux';
import { Platform } from 'react-native';
import FCM, {
  FCMEvent,
  RemoteNotificationResult,
  WillPresentNotificationResult,
  NotificationType,
} from 'react-native-fcm';
import { Navigation } from 'react-native-navigation';

class PushNotification extends Component {
  componentDidMount = async () => {
    try {
      await FCM.requestPermissions({ badge: false, sound: true, alert: true });
      await global.console.log('Get Permissions Okie');
    } catch (e) {
      global.console.log('Get Permissions Error', e);
    }

    FCM.getFCMToken().then((token) => {
      global.console.log('TOKEN (getFCMToken)', token);
      const body = {
        fcm_key: token,
      };
      global.DISPATCH({
        type: 'UPDATE_ASYNC',
        resource: 'profile',
        _id: this.props.profile._id,
        namespace: 'my_profile',
        payload: {
          ...body,
        },
      });
    });

    if (Platform.OS === 'ios') {
      FCM.getAPNSToken().then((token) => {
        global.console.log('APNS TOKEN (getFCMToken)', token);
      });
    }

    FCM.getInitialNotification().then((notif) => {
      global.console.log('INITIAL NOTIFICATION');
      if (notif) {
        const { link } = notif;
        Navigation.handleDeepLink({
          link,
          payload: {
            fromTray: true,
            payload: notif,
          },
        });
      }
    });

    this.notificationListener = FCM.on(FCMEvent.Notification, (notif) => {
      global.console.log('Notification', notif);
      const { link } = notif;

      if (notif.local_notification) {
        global.console.log('OPEN SCREEN FROM LOCAL');
        Navigation.handleDeepLink({
          link,
          payload: {
            fromTray: true,
            payload: notif,
          },
        });
        return;
      }
      if (notif.opened_from_tray) {
        global.console.log('OPEN SCREEN FROM TRAY');
        Navigation.handleDeepLink({
          link,
          payload: {
            fromTray: true,
            payload: notif,
          },
        });
        return;
      }

      if (Platform.OS === 'ios') {
        switch (notif._notificationType) {
        case NotificationType.Remote:
          notif.finish(RemoteNotificationResult.NewData);
          break;
        case NotificationType.NotificationResponse:
          notif.finish();
          break;
        case NotificationType.WillPresent:
          notif.finish(WillPresentNotificationResult.All);
          break;
        default:
          break;
        }
      }

      this.refreshTokenListener = FCM.on(FCMEvent.RefreshToken, (token) => {
        global.console.log('TOKEN (refreshUnsubscribe)', token);
        this.props.onChangeToken(token);
      });

      FCM.enableDirectChannel();
      this.channelConnectionListener = FCM.on(FCMEvent.DirectChannelConnectionChanged, (data) => {
        global.console.log(`direct channel connected${data}`);
      });
      setTimeout(() => {
        FCM.isDirectChannelEstablished().then(d => global.console.log('isDirectChannelEstablished', d));
      }, 1000);
      this.showLocalNotification(notif);
    });
  }

  componentWillUnmount = () => {
    try {
      this.notificationListener.remove();
      this.refreshTokenListener.remove();
    } catch (e) {
      global.console.log('Error PushNotification willUnMount', e);
    }
  }

  showLocalNotification(notif) {
    const n = notif.fcm;
    global.console.log('Show notification global', n);
    if (n) {
      if (global.ScreenName !== 'nearme.ConversationScreen') {
        FCM.presentLocalNotification({
          action: n.action && null,
          color: n.color,
          tag: n.tag,
          title: n.title ? n.title : 'Pristen',
          body: n.body,
          // big_text: 'This is a big text',
          sub_text: n.sub_text,
          priority: 'high',
          click_action: n.click_action,
          show_in_foreground: true,
          // sound: 'default',
          local: true,
          lights: true,
          vibrate: 200,
          ...notif,
        });
        // this.props.navigator.showInAppNotification({
        //   screen: 'nearme.InAppNotification',
        //   passProps: {
        //     title: n.title ? n.title : 'Tethow',
        //     body: n.body,
        //     notif,
        //   },
        //   autoDismissTimerSec: 5,
        // });
      }
    }
  }

  render() {
    return null;
  }
}

PushNotification.defaultProps = {
  profile: {},
  onChangeToken: () => {},
};

PushNotification.propTypes = {
  profile: PropTypes.object,
  onChangeToken: PropTypes.func,
};

const mapStateToProps = (state) => {
  const profile = state.my_profile.toJS();
  return {
    profile,
  };
};

export default connect(mapStateToProps)(PushNotification);