Skip to content

Instantly share code, notes, and snippets.

@deceive3w
Last active April 19, 2019 11:24
Show Gist options
  • Save deceive3w/dfb8035ab90bb879f7528f68c7a4308b to your computer and use it in GitHub Desktop.
Save deceive3w/dfb8035ab90bb879f7528f68c7a4308b to your computer and use it in GitHub Desktop.
Fix Multiple React Native Navigation
//change Screen.js in node modules react-native-navigation
/*eslint-disable*/
import React, {Component} from 'react';
import {
NativeAppEventEmitter,
DeviceEventEmitter,
Platform
} from 'react-native';
import platformSpecific from './deprecated/platformSpecificDeprecated';
import Navigation from './Navigation';
const NavigationSpecific = {
push: platformSpecific.navigatorPush,
pop: platformSpecific.navigatorPop,
popToRoot: platformSpecific.navigatorPopToRoot,
resetTo: platformSpecific.navigatorResetTo
};
class Navigator {
constructor(navigatorID, navigatorEventID, screenInstanceID) {
this.navigatorID = navigatorID;
this.screenInstanceID = screenInstanceID;
this.navigatorEventID = navigatorEventID;
this.navigatorEventHandler = null;
this.navigatorEventHandlers = [];
this.navigatorEventSubscription = null;
// add varible last screen
this.lastScreen = {screen: undefined};
}
isSameScreen(params) {
if (params.screen != this.lastScreen.screen) {
this.lastScreen = {screen: params.screen}
return false;
} else {
return true;
}
}
push(params = {}) {
//comparing with last screen
if(this.isSameScreen({screen: params.screen})) {
return;
}
return NavigationSpecific.push(this, params);
}
pop(params = {}) {
this.lastScreen = {screen: undefined, timestamp: 0}
return NavigationSpecific.pop(this, params);
}
popToRoot(params = {}) {
return NavigationSpecific.popToRoot(this, params);
}
resetTo(params = {}) {
return NavigationSpecific.resetTo(this, params);
}
showModal(params = {}) {
return Navigation.showModal(params);
}
showLightBox(params = {}) {
return Navigation.showLightBox(params);
}
dismissModal(params = {}) {
return Navigation.dismissModal(params);
}
dismissAllModals(params = {}, callback) {
if(callback){
setTimeout(() => {
callback()
}, 300);
}
return Navigation.dismissAllModals(params);
}
showLightBox(params = {}) {
return Navigation.showLightBox(params);
}
dismissLightBox() {
return Navigation.dismissLightBox();
}
showInAppNotification(params = {}) {
return Navigation.showInAppNotification(params);
}
dismissInAppNotification(params = {}) {
return Navigation.dismissInAppNotification(params);
}
setButtons(params = {}) {
return platformSpecific.navigatorSetButtons(this, this.navigatorEventID, params);
}
setTitle(params = {}) {
return platformSpecific.navigatorSetTitle(this, params);
}
setSubTitle(params = {}) {
return platformSpecific.navigatorSetSubtitle(this, params);
}
setTitleImage(params = {}) {
return platformSpecific.navigatorSetTitleImage(this, params);
}
setStyle(params = {}) {
return platformSpecific.navigatorSetStyle(this, params);
}
toggleDrawer(params = {}) {
return platformSpecific.navigatorToggleDrawer(this, params);
}
setDrawerEnabled(params = {}) {
return platformSpecific.navigatorSetDrawerEnabled(this, params);
}
toggleTabs(params = {}) {
return platformSpecific.navigatorToggleTabs(this, params);
}
toggleNavBar(params = {}) {
return platformSpecific.navigatorToggleNavBar(this, params);
}
setTabBadge(params = {}) {
return platformSpecific.navigatorSetTabBadge(this, params);
}
setTabButton(params = {}) {
return platformSpecific.navigatorSetTabButton(this, params);
}
switchToTab(params = {}) {
return platformSpecific.navigatorSwitchToTab(this, params);
}
switchToTopTab(params = {}) {
return platformSpecific.navigatorSwitchToTopTab(this, params);
}
showSnackbar(params = {}) {
return platformSpecific.showSnackbar(params);
}
dismissSnackbar() {
return platformSpecific.dismissSnackbar();
}
showContextualMenu(params, onButtonPressed) {
return platformSpecific.showContextualMenu(this, params, onButtonPressed);
}
dismissContextualMenu() {
return platformSpecific.dismissContextualMenu();
}
setOnNavigatorEvent(callback) {
if (this.navigatorEventHandlers.length > 0) {
throw new Error('setOnNavigatorEvent can not be used after addOnNavigatorEvent has been called');
}
this.navigatorEventHandler = callback;
this._registerNavigatorEvent();
}
addOnNavigatorEvent(callback) {
if (this.navigatorEventHandler) {
throw new Error('addOnNavigatorEvent can not be used after setOnNavigatorEvent has been called');
}
if (this.navigatorEventHandlers.indexOf(callback) === -1) {
this.navigatorEventHandlers.push(callback);
}
this._registerNavigatorEvent();
return () => this._removeOnNavigatorEvent(callback)
}
_registerNavigatorEvent() {
if (!this.navigatorEventSubscription) {
let Emitter = Platform.OS === 'android' ? DeviceEventEmitter : NativeAppEventEmitter;
this.navigatorEventSubscription = Emitter.addListener(this.navigatorEventID, (event) => this.onNavigatorEvent(event));
Navigation.setEventHandler(this.navigatorEventID, (event) => this.onNavigatorEvent(event));
}
}
_removeOnNavigatorEvent(callback) {
const index = this.navigatorEventHandlers.indexOf(callback);
if (index !== -1) {
this.navigatorEventHandlers.splice(index, 1);
}
}
onNavigatorEvent(event) {
if (this.navigatorEventHandler) {
this.navigatorEventHandler(event);
}
if(event.id == 'didAppear'){
//we must reset variable, if not we cannot push same screen again
this.lastScreen = {screen: undefined}
}
this.navigatorEventHandlers.forEach(handler => handler(event));
}
handleDeepLink(params = {}) {
Navigation.handleDeepLink(params);
}
cleanup() {
if (this.navigatorEventSubscription) {
this.navigatorEventSubscription.remove();
this.navigatorEventHandlers = [];
Navigation.clearEventHandler(this.navigatorEventID);
}
}
async screenIsCurrentlyVisible() {
const res = await Navigation.getCurrentlyVisibleScreenId();
if (!res) {
return false;
}
return res.screenId === this.screenInstanceID;
}
}
class Screen extends Component {
static navigatorStyle = {};
static navigatorButtons = {};
constructor(props) {
super(props);
if (props.navigatorID) {
this.navigator = new Navigator(props.navigatorID, props.navigatorEventID, props.screenInstanceID);
}
}
componentWillUnmount() {
if (this.navigator) {
this.navigator.cleanup();
this.navigator = undefined;
}
}
}
export {
Screen,
Navigator
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment