aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/assets/icons/findFriends/find-friend-icon.pngbin0 -> 100964 bytes
-rw-r--r--src/assets/icons/findFriends/lock-icon.pngbin0 -> 7272 bytes
-rw-r--r--src/assets/icons/findFriends/phone-cross-icon.pngbin0 -> 16729 bytes
-rw-r--r--src/assets/icons/findFriends/unstored-contact-data-icon.pngbin0 -> 11421 bytes
-rw-r--r--src/routes/main/MainStackNavigator.tsx3
-rw-r--r--src/routes/main/MainStackScreen.tsx19
-rw-r--r--src/screens/search/RequestContactsAccess.tsx176
-rw-r--r--src/screens/search/index.ts1
8 files changed, 196 insertions, 3 deletions
diff --git a/src/assets/icons/findFriends/find-friend-icon.png b/src/assets/icons/findFriends/find-friend-icon.png
new file mode 100644
index 00000000..62abcac0
--- /dev/null
+++ b/src/assets/icons/findFriends/find-friend-icon.png
Binary files differ
diff --git a/src/assets/icons/findFriends/lock-icon.png b/src/assets/icons/findFriends/lock-icon.png
new file mode 100644
index 00000000..20ccbe2f
--- /dev/null
+++ b/src/assets/icons/findFriends/lock-icon.png
Binary files differ
diff --git a/src/assets/icons/findFriends/phone-cross-icon.png b/src/assets/icons/findFriends/phone-cross-icon.png
new file mode 100644
index 00000000..0801e9f1
--- /dev/null
+++ b/src/assets/icons/findFriends/phone-cross-icon.png
Binary files differ
diff --git a/src/assets/icons/findFriends/unstored-contact-data-icon.png b/src/assets/icons/findFriends/unstored-contact-data-icon.png
new file mode 100644
index 00000000..8974a790
--- /dev/null
+++ b/src/assets/icons/findFriends/unstored-contact-data-icon.png
Binary files differ
diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx
index bd838ef2..e038d2c2 100644
--- a/src/routes/main/MainStackNavigator.tsx
+++ b/src/routes/main/MainStackNavigator.tsx
@@ -14,6 +14,9 @@ export type MainStackParams = {
Search: {
screenType: ScreenType;
};
+ RequestContactsAccess: {
+ screenType: ScreenType;
+ };
Profile: {
userXId: string | undefined;
screenType: ScreenType;
diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index 3e425101..8042d267 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -12,6 +12,7 @@ import {
MomentUploadPromptScreen,
NotificationsScreen,
ProfileScreen,
+ RequestContactsAccess,
SearchScreen,
SocialMediaTaggs,
} from '../../screens';
@@ -47,7 +48,14 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
case ScreenType.Profile:
return 'Profile';
case ScreenType.Search:
- return 'Search';
+ // Check if user responded to access contacts and return appropriate screen
+ // When app is opened, load the value from Async Storage to react native store
+ // Every time the user clicks on this tab
+ // Retrieve the information from the store
+ // If responded is true, show search screen
+ // Else, show RequestContactsAccess
+ // If user responds, update store and Async and remove popup
+ return 'RequestContactsAccess';
case ScreenType.Notifications:
return 'Notifications';
}
@@ -91,9 +99,14 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
}}
/>
{isSearchTab && (
+ // <MainStack.Screen
+ // name="Search"
+ // component={SearchScreen}
+ // initialParams={{screenType}}
+ // />
<MainStack.Screen
- name="Search"
- component={SearchScreen}
+ name="RequestContactsAccess"
+ component={RequestContactsAccess}
initialParams={{screenType}}
/>
)}
diff --git a/src/screens/search/RequestContactsAccess.tsx b/src/screens/search/RequestContactsAccess.tsx
new file mode 100644
index 00000000..af511f23
--- /dev/null
+++ b/src/screens/search/RequestContactsAccess.tsx
@@ -0,0 +1,176 @@
+import * as React from 'react';
+import {
+ StyleSheet,
+ View,
+ Text,
+ Image,
+ TouchableOpacity,
+ StatusBar,
+} from 'react-native';
+import {BACKGROUND_GRADIENT_MAP} from '../../constants';
+import {isIPhoneX, normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
+import {BackgroundGradientType} from '../../types';
+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';
+
+const RequestContactsAccess: React.FC = () => {
+ const navigation = useNavigation();
+ return (
+ <LinearGradient
+ colors={BACKGROUND_GRADIENT_MAP[BackgroundGradientType.Light]}
+ useAngle={true}
+ angle={154.72}
+ angleCenter={{x: 0.5, y: 0.5}}
+ style={{flex: 1}}>
+ <SafeAreaView>
+ <View style={{height: SCREEN_HEIGHT}}>
+ <Animated.ScrollView
+ showsHorizontalScrollIndicator={false}
+ showsVerticalScrollIndicator={false}
+ scrollEnabled={isIPhoneX() ? false : true}>
+ <StatusBar barStyle="light-content" translucent={false} />
+ <View style={styles.mainContainer}>
+ <Image
+ source={require('../../assets/icons/findFriends/find-friend-icon.png')}
+ style={styles.image}
+ />
+ <Text style={styles.title}>FIND FRIENDS!</Text>
+ <Text style={styles.subtext}>
+ This is so you can find your friends already on here! Isn’t a
+ party better when your favorite people are there?
+ </Text>
+ <View style={styles.bulletPointView}>
+ <Image
+ source={require('../../assets/icons/findFriends/lock-icon.png')}
+ style={styles.icon}
+ />
+ <Text style={styles.bulletPointText}>Always Stays Private</Text>
+ </View>
+ <View style={styles.bulletPointView}>
+ <Image
+ source={require('../../assets/icons/findFriends/unstored-contact-data-icon.png')}
+ style={styles.icon}
+ />
+ <Text style={styles.bulletPointText}>
+ We don’t keep any contact data
+ </Text>
+ </View>
+ <View style={styles.bulletPointView}>
+ <Image
+ source={require('../../assets/icons/findFriends/phone-cross-icon.png')}
+ style={styles.icon}
+ />
+ <Text style={styles.bulletPointText}>
+ We wouldn’t dare send any messages
+ </Text>
+ </View>
+ <TouchableOpacity
+ onPress={() => {
+ console.log('Show IOS opoup');
+ }}
+ style={styles.allowButton}>
+ <Text style={styles.allowButtonLabel}>Allow Contacts</Text>
+ </TouchableOpacity>
+ <TouchableOpacity
+ accessibilityLabel="Don't allow button"
+ style={styles.dontAllowButton}
+ onPress={() => navigation.pop()}>
+ <Text style={styles.dontAllowButtonText}>Don’t Allow</Text>
+ </TouchableOpacity>
+ </View>
+ </Animated.ScrollView>
+ </View>
+ </SafeAreaView>
+ </LinearGradient>
+ );
+};
+
+const styles = StyleSheet.create({
+ mainContainer: {
+ flex: 1,
+ flexDirection: 'column',
+ alignContent: 'center',
+ width: SCREEN_WIDTH,
+ height: SCREEN_HEIGHT,
+ marginBottom: '15%',
+ },
+ image: {
+ marginBottom: '2%',
+ width: SCREEN_WIDTH,
+ height: SCREEN_WIDTH * 0.49,
+ },
+ title: {
+ color: '#fff',
+ alignSelf: 'center',
+ fontSize: normalize(28),
+ lineHeight: normalize(35),
+ fontWeight: '600',
+ textAlign: 'center',
+ marginBottom: '2%',
+ },
+ subtext: {
+ color: '#fff',
+ alignSelf: 'center',
+ fontSize: normalize(16),
+ lineHeight: normalize(25),
+ fontWeight: '600',
+ textAlign: 'center',
+ width: '83%',
+ height: '15%',
+ },
+ bulletPointView: {
+ flexDirection: 'row',
+ justifyContent: 'space-between',
+ alignSelf: 'center',
+ width: SCREEN_WIDTH * 0.55,
+ marginBottom: '7%',
+ },
+ icon: {
+ margin: '1%',
+ width: normalize(38),
+ height: normalize(38),
+ alignSelf: 'flex-start',
+ },
+ bulletPointText: {
+ color: '#fff',
+ fontSize: normalize(15),
+ fontWeight: '500',
+ lineHeight: normalize(20),
+ alignSelf: 'center',
+ width: '75%',
+ textAlign: 'center',
+ },
+ allowButton: {
+ backgroundColor: '#fff',
+ justifyContent: 'center',
+ alignItems: 'center',
+ alignSelf: 'center',
+ width: '41.5%',
+ height: '6%',
+ borderRadius: 5,
+ borderWidth: 1,
+ borderColor: '#fff',
+ marginTop: '8%',
+ marginBottom: '3%',
+ },
+ allowButtonLabel: {
+ fontSize: normalize(17),
+ fontWeight: '600',
+ lineHeight: normalize(20.29),
+ color: '#3C4461',
+ },
+ dontAllowButton: {
+ alignSelf: 'center',
+ borderBottomWidth: 1,
+ borderBottomColor: 'white',
+ },
+ dontAllowButtonText: {
+ fontSize: normalize(15),
+ fontWeight: '500',
+ lineHeight: normalize(20),
+ color: '#fff',
+ },
+});
+export default RequestContactsAccess;
diff --git a/src/screens/search/index.ts b/src/screens/search/index.ts
index b6680aa4..d5eb9c3e 100644
--- a/src/screens/search/index.ts
+++ b/src/screens/search/index.ts
@@ -1 +1,2 @@
export {default as SearchScreen} from './SearchScreen';
+export {default as RequestContactsAccess} from './RequestContactsAccess';
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 10:18:53 +0000