Created
July 13, 2020 02:59
-
-
Save gaboelnuevo/bc004a20fba927e18d587f9345e4f09f to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { AsyncStorage, InteractionManager, Vibration } from "react-native"; | |
| import { NavigationActions } from "react-navigation"; | |
| import { Notifications } from "expo"; | |
| import _ from "lodash"; | |
| const appIcon = require("../../assets/icon.png"); | |
| let _navigator; | |
| function setTopLevelNavigator(navigatorRef) { | |
| _navigator = navigatorRef; | |
| } | |
| function navigate(routeName, params) { | |
| if (!_navigator) return; | |
| _navigator.dispatch( | |
| NavigationActions.navigate({ | |
| routeName, | |
| params, | |
| }) | |
| ); | |
| } | |
| export const NavigationServices = { | |
| setTopLevelNavigator, | |
| navigate, | |
| }; | |
| class NotificationsHandler { | |
| pendingNotification = null; | |
| appReady = false; | |
| _popup = null; | |
| setup() { | |
| this.notificationSubscription = Notifications.addListener( | |
| this.onNotification.bind(this) | |
| ); | |
| } | |
| constructor() { | |
| this.appReady = false; | |
| this.pendingNotification = null; | |
| this.token = null; | |
| this.showPopup = _.throttle(this.showPopup.bind(this), 5000); | |
| } | |
| onNotification(notification) { | |
| if (!this.appReady) { | |
| this.pendingNotification = notification; | |
| return; | |
| } | |
| this.handleNotification(notification); | |
| } | |
| handleOpenNotification = async (notification) => { | |
| if (notification.data && notification.data.vista) { | |
| const params = notification.data.parametrosVista || {}; | |
| NavigationServices.navigate(notification.data.vista, params); | |
| } else { | |
| const isLoggedIn = await isLoggedInAsync(); | |
| NavigationServices.navigate(isLoggedIn ? "Notificaciones": "NotificacionesInvitado"); | |
| } | |
| }; | |
| handleNotification = (notification) => { | |
| console.log({ notification }); | |
| if (notification.origin === "received") { | |
| this.showPopup({ | |
| title: notification.title || _.get(notification, "data.title"), | |
| body: notification.body || _.get(notification, "data.body"), | |
| onPress: () => { | |
| this.handleOpenNotification(notification); | |
| } | |
| }) | |
| } else if (notification.origin === "selected") { | |
| requestAnimationFrame(() => { | |
| this.handleOpenNotification(notification); | |
| }); | |
| } | |
| }; | |
| notifyAppReady() { | |
| if (this.appReady) return; | |
| this.appReady = true; | |
| console.log("app ready!"); | |
| this.processPendingNotification(); | |
| /* this.showPopup({ | |
| title: "Hello World", | |
| body: "This is a sample message.\nTesting emoji 😀", | |
| }); */ | |
| } | |
| setPopupComponet = (popupRef) => { | |
| this._popup = popupRef; | |
| }; | |
| showPopup = (data={}, vibrate = true) => { | |
| if (vibrate) Vibration.vibrate(100, false); | |
| if (!this._popup) { | |
| setTimeout(() => this.showPopup(data, false), 3000); | |
| return; | |
| } | |
| this._popup.show({ | |
| appIconSource: appIcon, | |
| appTitle: "App Name", | |
| timeText: "Now", | |
| // title: "Hello World", | |
| // body: "This is a sample message.\nTesting emoji 😀", | |
| ...data, | |
| }); | |
| }; | |
| async processPendingNotification() { | |
| if (this.pendingNotification) { | |
| console.log("pending notification", this.pendingNotification); | |
| setTimeout(() => { | |
| InteractionManager.runAfterInteractions(() => { | |
| this.onNotification(this.pendingNotification); | |
| }); | |
| }); | |
| } | |
| } | |
| } | |
| export const NotificationManager = new NotificationsHandler(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
class App extends React.Component {
...
componentDidMount() {
NotificationManager.setup();
}
render () {
const notificationsPopUpProps = {
duration: 7500,
};
return (<>
<Navigator
ref={(nav) => {
this.navigator = nav;
NavigationServices.setTopLevelNavigator(nav);
}}
/>
<View
style={[
StyleSheet.absoluteFillObject,
{ zIndex: 9000, marginLeft: 0, marginTop: 0, marginRight: 8 },
]}
pointerEvents={"box-none"}
>
<NotificationPopup
{...notificationsPopUpProps}
ref={(ref) => {
NotificationManager.setPopupComponet(ref)
}}
/>
</>
);
}