From 8ae59996a50f1fba0c50de95b082cea3a6b3958a Mon Sep 17 00:00:00 2001
From: Chris Duarte <csduarte@users.noreply.github.com>
Date: Wed, 1 Mar 2017 07:34:01 -0800
Subject: [PATCH] Navigation swiping fix (#311)

* Navigation swiping fix

* Review feedback
---
 app/navigation/router.js | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/app/navigation/router.js b/app/navigation/router.js
index 56eb5966d..3382b1f6e 100644
--- a/app/navigation/router.js
+++ b/app/navigation/router.js
@@ -3,6 +3,7 @@
 
 import React from 'react';
 import {
+    Dimensions,
     Easing,
     NavigationExperimental,
     View
@@ -18,6 +19,8 @@ import {getTheme} from 'service/selectors/entities/preferences';
 
 import NavigationModal from './navigation_modal';
 
+const navigationPanResponder = NavigationExperimental.Card.CardStackPanResponder;
+
 class Router extends React.Component {
     static propTypes = {
         navigation: React.PropTypes.object,
@@ -102,9 +105,14 @@ class Router extends React.Component {
                 };
             }
 
-            // NavigationExperimental only creates the correct panHandlers if the panHandlers prop === undefined
-            const panHandlers = navigationProps.allowSceneSwipe ? undefined : null; // eslint-disable-line
-
+            let panHandlers = null;
+            if (navigationProps.allowSceneSwipe) {
+                panHandlers = navigationPanResponder.forHorizontal({
+                    ...cardProps,
+                    gestureResponseDistance: (Dimensions.get('window').width / 2), // sets the distance from the edge for swiping
+                    onNavigateBack: this.props.actions.goBack
+                });
+            }
             return (
                 <NavigationExperimental.Card
                     {...cardProps}
@@ -203,7 +211,7 @@ class Router extends React.Component {
                     tapToClose={true}
                     openDrawerOffset={0.2}
                     onRequestClose={this.props.actions.closeDrawers}
-                    panOpenMask={0.1}
+                    panOpenMask={0.4}
                     panCloseMask={0.2}
                     panThreshold={0.2}
                     acceptPan={navigationProps.allowMenuSwipe}
@@ -219,7 +227,7 @@ class Router extends React.Component {
                         tapToClose={true}
                         openDrawerOffset={0.2}
                         onRequestClose={this.props.actions.closeDrawers}
-                        panOpenMask={0.1}
+                        panOpenMask={0.4}
                         panCloseMask={0.2}
                         panThreshold={0.2}
                         acceptPan={navigationProps.allowMenuSwipe}