From c892b51ff87d6aee9e7ffffd1b81d5d9ca1b848b Mon Sep 17 00:00:00 2001
From: Akinwale Ariwodola <akinwale@gmail.com>
Date: Fri, 31 May 2019 05:41:44 +0100
Subject: [PATCH] add custom drawer content to navigate to the topmost item in
 nested stacks

---
 app/src/component/AppNavigator.js        |  3 +-
 app/src/component/drawerContent/index.js |  4 +++
 app/src/component/drawerContent/view.js  | 38 ++++++++++++++++++++++++
 app/src/page/transactionHistory/view.js  |  1 +
 app/src/styles/discover.js               |  3 ++
 5 files changed, 48 insertions(+), 1 deletion(-)
 create mode 100644 app/src/component/drawerContent/index.js
 create mode 100644 app/src/component/drawerContent/view.js

diff --git a/app/src/component/AppNavigator.js b/app/src/component/AppNavigator.js
index ef53473b..9ca1c955 100644
--- a/app/src/component/AppNavigator.js
+++ b/app/src/component/AppNavigator.js
@@ -2,6 +2,7 @@ import React from 'react';
 import AboutPage from 'page/about';
 import DiscoverPage from 'page/discover';
 import DownloadsPage from 'page/downloads';
+import DrawerContent from 'component/drawerContent';
 import FilePage from 'page/file';
 import FirstRunScreen from 'page/firstRun';
 import RewardsPage from 'page/rewards';
@@ -13,7 +14,6 @@ import SubscriptionsPage from 'page/subscriptions';
 import TransactionHistoryPage from 'page/transactionHistory';
 import VerificationScreen from 'page/verification';
 import WalletPage from 'page/wallet';
-import SearchInput from 'component/searchInput';
 import {
   createDrawerNavigator,
   createStackNavigator,
@@ -150,6 +150,7 @@ const drawer = createDrawerNavigator({
 }, {
   drawerWidth: 300,
   headerMode: 'none',
+  contentComponent: DrawerContent,
   contentOptions: {
     activeTintColor: Colors.LbryGreen,
     labelStyle: discoverStyle.menuText
diff --git a/app/src/component/drawerContent/index.js b/app/src/component/drawerContent/index.js
new file mode 100644
index 00000000..3df7cecf
--- /dev/null
+++ b/app/src/component/drawerContent/index.js
@@ -0,0 +1,4 @@
+import { connect } from 'react-redux';
+import DrawerContent from './view';
+
+export default connect()(DrawerContent);
diff --git a/app/src/component/drawerContent/view.js b/app/src/component/drawerContent/view.js
new file mode 100644
index 00000000..49fa8dbd
--- /dev/null
+++ b/app/src/component/drawerContent/view.js
@@ -0,0 +1,38 @@
+import React from 'react';
+import { DrawerItems, SafeAreaView } from 'react-navigation';
+import { ScrollView } from 'react-native';
+import Constants from 'constants';
+import discoverStyle from 'styles/discover';
+
+class DrawerContent extends React.PureComponent {
+  render() {
+    const props = this.props;
+    const { navigation, onItemPress } = props;
+
+    return (
+      <ScrollView>
+        <SafeAreaView style={discoverStyle.drawerContentContainer} forceInset={{ top: 'always', horizontal: 'never' }}>
+          <DrawerItems
+            {...props}
+            onItemPress={(route) => {
+              const { routeName } = route.route;
+              if (Constants.FULL_ROUTE_NAME_DISCOVER === routeName) {
+                navigation.navigate({ routeName: Constants.DRAWER_ROUTE_DISCOVER });
+                return;
+              }
+
+              if (Constants.FULL_ROUTE_NAME_WALLET === routeName) {
+                navigation.navigate({ routeName: Constants.DRAWER_ROUTE_WALLET });
+                return;
+              }
+
+              onItemPress(route);
+            }}
+            />
+        </SafeAreaView>
+      </ScrollView>
+    );
+  }
+}
+
+export default DrawerContent;
diff --git a/app/src/page/transactionHistory/view.js b/app/src/page/transactionHistory/view.js
index 6ef17148..a2ef142d 100644
--- a/app/src/page/transactionHistory/view.js
+++ b/app/src/page/transactionHistory/view.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { View, ScrollView, Text } from 'react-native';
+import Constants from 'constants';
 import TransactionList from 'component/transactionList';
 import UriBar from 'component/uriBar';
 import walletStyle from 'styles/wallet';
diff --git a/app/src/styles/discover.js b/app/src/styles/discover.js
index a1183027..46a295fc 100644
--- a/app/src/styles/discover.js
+++ b/app/src/styles/discover.js
@@ -20,6 +20,9 @@ const discoverStyle = StyleSheet.create({
     flex: 1,
     backgroundColor: Colors.PageBackground
   },
+  drawerContentContainer: {
+    flex: 1
+  },
   scrollContainer: {
     flex: 1,
     paddingTop: 12,