Enabled button functionality

2 files changed, 48 insertions, 18 deletions

diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index 8042d267..15695288 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -1,6 +1,7 @@
+import AsyncStorage from '@react-native-community/async-storage';
 import {RouteProp} from '@react-navigation/native';
 import {StackNavigationOptions} from '@react-navigation/stack';
-import React from 'react';
+import React, {useState} from 'react';
 import {
   CaptionScreen,
   CategorySelection,
@@ -43,6 +44,14 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
   const isSearchTab = screenType === ScreenType.Search;
   const isNotificationsTab = screenType === ScreenType.Notifications;
 
+  AsyncStorage.getItem('respondedToAccessContacts').then((value) =>
+    setRespondedToAccessContacts(value ? value : 'false'),
+  );
+
+  const [respondedToAccessContacts, setRespondedToAccessContacts] = useState(
+    'false',
+  );
+
   const initialRouteName = (() => {
     switch (screenType) {
       case ScreenType.Profile:
@@ -55,7 +64,7 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
         // If responded is true, show search screen
         // Else, show RequestContactsAccess
         // If user responds, update store and Async and remove popup
-        return 'RequestContactsAccess';
+        return 'Search';
       case ScreenType.Notifications:
         return 'Notifications';
     }
@@ -98,18 +107,20 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
           screenType,
         }}
       />
-      {isSearchTab && (
-        // <MainStack.Screen
-        //   name="Search"
-        //   component={SearchScreen}
-        //   initialParams={{screenType}}
-        // />
-        <MainStack.Screen
-          name="RequestContactsAccess"
-          component={RequestContactsAccess}
-          initialParams={{screenType}}
-        />
-      )}
+      {isSearchTab &&
+        (respondedToAccessContacts && respondedToAccessContacts === 'true' ? (
+          <MainStack.Screen
+            name="Search"
+            component={SearchScreen}
+            initialParams={{screenType}}
+          />
+        ) : (
+          <MainStack.Screen
+            name="Search"
+            component={RequestContactsAccess}
+            initialParams={{screenType}}
+          />
+        ))}
       {isNotificationsTab && (
         <MainStack.Screen
           name="Notifications"
diff --git a/src/screens/search/RequestContactsAccess.tsx b/src/screens/search/RequestContactsAccess.tsx
index af511f23..c869ed1e 100644
--- a/src/screens/search/RequestContactsAccess.tsx
+++ b/src/screens/search/RequestContactsAccess.tsx
@@ -14,9 +14,30 @@ import {useNavigation} from '@react-navigation/native';
 import {SafeAreaView} from 'react-native-safe-area-context';
 import Animated from 'react-native-reanimated';
 import LinearGradient from 'react-native-linear-gradient';
+import {checkPermission, requestPermission} from 'react-native-contacts';
+import AsyncStorage from '@react-native-community/async-storage';
 
 const RequestContactsAccess: React.FC = () => {
   const navigation = useNavigation();
+
+  const handleAllowAccess = async () => {
+    checkPermission().then((permission) => {
+      if (permission === 'undefined') {
+        requestPermission().then((response) => {
+          if (response === 'authorized' || response === 'denied') {
+            navigation.navigate('Search');
+          }
+        });
+      }
+    });
+    await AsyncStorage.setItem('respondedToAccessContacts', 'true');
+  };
+
+  const handleDontAllowAccess = async () => {
+    await AsyncStorage.setItem('respondedToAccessContacts', 'true');
+    navigation.navigate('Search');
+  };
+
   return (
     <LinearGradient
       colors={BACKGROUND_GRADIENT_MAP[BackgroundGradientType.Light]}
@@ -67,16 +88,14 @@ const RequestContactsAccess: React.FC = () => {
                 </Text>
               </View>
               <TouchableOpacity
-                onPress={() => {
-                  console.log('Show IOS opoup');
-                }}
+                onPress={handleAllowAccess}
                 style={styles.allowButton}>
                 <Text style={styles.allowButtonLabel}>Allow Contacts</Text>
               </TouchableOpacity>
               <TouchableOpacity
                 accessibilityLabel="Don't allow button"
                 style={styles.dontAllowButton}
-                onPress={() => navigation.pop()}>
+                onPress={handleDontAllowAccess}>
                 <Text style={styles.dontAllowButtonText}>Don’t Allow</Text>
               </TouchableOpacity>
             </View>