aboutsummaryrefslogtreecommitdiff
path: root/src/screens
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens')
-rw-r--r--src/screens/profile/AccountType.tsx87
-rw-r--r--src/screens/profile/PrivacyScreen.tsx159
-rw-r--r--src/screens/profile/SettingsScreen.tsx184
-rw-r--r--src/screens/profile/index.ts3
4 files changed, 433 insertions, 0 deletions
diff --git a/src/screens/profile/AccountType.tsx b/src/screens/profile/AccountType.tsx
new file mode 100644
index 00000000..dedf4420
--- /dev/null
+++ b/src/screens/profile/AccountType.tsx
@@ -0,0 +1,87 @@
+import React, {useEffect, useState} from 'react';
+import {StatusBar, StyleSheet, Switch, Text, View} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {Background} from '../../components';
+import {BackgroundGradientType} from '../../types';
+import {normalize} from '../../utils/layouts';
+
+const AccountType: React.FC = () => {
+ const [isPrivateAccount, setIsPrivateAccount] = useState(false);
+ const switchAccountType = () =>
+ setIsPrivateAccount((previousState) => !previousState);
+
+ useEffect(() => {
+ // Fetching from Redux and Set the result
+ // setIsPrivateAccount(true);
+ }, []);
+
+ const getAccountText = () => {
+ return isPrivateAccount ? 'Private Account' : 'Public Account';
+ };
+
+ return (
+ <>
+ <StatusBar barStyle="light-content" />
+ <Background gradientType={BackgroundGradientType.Light}>
+ <SafeAreaView>
+ <View style={{marginLeft: 28, marginRight: 43, marginTop: '20%'}}>
+ <View style={{flexDirection: 'row', alignItems: 'center'}}>
+ <Text style={styles.title}>{getAccountText()}</Text>
+ <Switch
+ trackColor={{false: 'red', true: '#6EE7E7'}}
+ thumbColor={'white'}
+ ios_backgroundColor="transparent"
+ style={{
+ position: 'absolute',
+ right: 0,
+ borderWidth: 2,
+ borderColor: 'white',
+ }}
+ value={isPrivateAccount}
+ onValueChange={switchAccountType}></Switch>
+ </View>
+
+ <View style={{marginTop: '40%'}}>
+ <Text style={styles.detailTitleStyle}>
+ Enabling a public account will:
+ </Text>
+ <Text style={styles.detailContentStyle}>
+ {'\n'}Everyone can view my posts{'\n'}
+ {'\n'}Everyone can send me friend requests{'\n'}
+ {'\n'}Everyone can tagg me{'\n'}
+ {'\n'}Everyone can send me direct messages
+ </Text>
+ </View>
+ </View>
+ </SafeAreaView>
+ </Background>
+ </>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ },
+ title: {
+ fontSize: normalize(18),
+ fontWeight: '600',
+ lineHeight: normalize(17.9),
+ color: 'white',
+ },
+
+ detailTitleStyle: {
+ fontSize: normalize(19),
+ fontWeight: '700',
+ lineHeight: normalize(22.67),
+ color: 'white',
+ },
+ detailContentStyle: {
+ fontSize: normalize(14),
+ fontWeight: '600',
+ lineHeight: normalize(16.71),
+ color: 'white',
+ },
+});
+
+export default AccountType;
diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx
new file mode 100644
index 00000000..e92769fc
--- /dev/null
+++ b/src/screens/profile/PrivacyScreen.tsx
@@ -0,0 +1,159 @@
+import React from 'react';
+import {
+ Alert,
+ Image,
+ SectionList,
+ StatusBar,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {normalize} from '../../utils/layouts';
+import {Background} from '../../components';
+import {BackgroundGradientType} from '../../types';
+import {logout} from '../../store/actions';
+import {useDispatch, useSelector} from 'react-redux';
+import {useNavigation} from '@react-navigation/core';
+import {RootState} from 'src/store/rootReducer';
+import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings';
+
+const DATA = [
+ {
+ title: '',
+ data: [
+ {
+ title: 'Account Type',
+ preimage: require('../../assets/images/tagg-logo.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ {
+ title: 'Blocked Accounts',
+ preimage: require('../../assets/images/settings/blocked-white.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ ],
+ },
+];
+
+const PrivacyScreen: React.FC = () => {
+ const dispatch = useDispatch();
+ const navigation = useNavigation();
+ const {suggested_people_linked} = useSelector(
+ (state: RootState) => state.user.profile,
+ );
+ const goToUpdateSPProfile = () => {
+ if (suggested_people_linked === 0) {
+ Alert.alert(ERROR_ATTEMPT_EDIT_SP);
+ } else {
+ // Sending undefined for updatedSelectedBadges to mark that there was no update yet
+ navigation.navigate('UpdateSPPicture', {
+ editing: true,
+ });
+ }
+ };
+
+ const getActions = (type: string) => {
+ switch (type) {
+ case 'Account Type':
+ navigateTo('AccountTypeScreen', {});
+ break
+ case 'Blocked Accounts':
+ navigateTo('Blocked Accounts', {});
+ break
+ default:
+ break;
+ }
+ };
+
+ const navigateTo = (screen: string, options: object) => {
+ navigation.navigate(screen, options);
+ };
+
+ const Item = ({
+ title,
+ preimage,
+ postimage,
+ }: {
+ title: string;
+ preimage: number;
+ postimage: number;
+ }) => (
+ <TouchableOpacity onPress={() => getActions(title)} style={styles.item}>
+ <Image style={{width: 15, height: 15}} source={preimage} />
+ <View style={{marginLeft: 40}}>
+ <Text style={styles.title}>{title}</Text>
+ </View>
+ <View style={[styles.item, {position: 'absolute', right: 0}]}>
+ {title === 'Account Type' && (
+ <Text style={[styles.title, {color: '#C4C4C4', marginRight: 13}]}>
+ {'Private'}
+ </Text>
+ )}
+ <Image style={{width: 15, height: 15}} source={postimage} />
+ </View>
+ </TouchableOpacity>
+ );
+
+ return (
+ <>
+ <StatusBar barStyle="light-content" />
+ <Background gradientType={BackgroundGradientType.Light}>
+ <SafeAreaView>
+ <View style={{marginLeft: 28, marginRight: 43}}>
+ <SectionList
+ sections={DATA}
+ keyExtractor={(item, index) => item.title + index}
+ renderItem={({item: {title, preimage, postimage}}) => {
+ return <Item {...{title, preimage, postimage}} />;
+ }}
+ renderSectionHeader={({section: {title}}) => {
+ if (title.length === 0) {
+ return null;
+ }
+ return (
+ <View style={{marginTop: 46}}>
+ <Text style={styles.header}>{title}</Text>
+ </View>
+ );
+ }}
+ />
+ </View>
+ </SafeAreaView>
+ </Background>
+ </>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ },
+ item: {
+ marginTop: 36,
+ flexDirection: 'row',
+ justifyContent: 'flex-start',
+ alignItems: 'center',
+ },
+ header: {
+ fontSize: normalize(18),
+ fontWeight: '600',
+ lineHeight: normalize(21.48),
+ color: '#E9E9E9',
+ },
+ title: {
+ fontSize: normalize(15),
+ fontWeight: '600',
+ lineHeight: normalize(17.9),
+ color: 'white',
+ },
+ logoutStyle: {
+ fontSize: normalize(20),
+ fontWeight: '600',
+ lineHeight: normalize(23.87),
+ color: 'white',
+ },
+});
+
+export default PrivacyScreen;
diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx
new file mode 100644
index 00000000..79633572
--- /dev/null
+++ b/src/screens/profile/SettingsScreen.tsx
@@ -0,0 +1,184 @@
+import React from 'react';
+import {
+ Alert,
+ Image,
+ SectionList,
+ StatusBar,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {normalize} from '../../utils/layouts';
+import {Background} from '../../components';
+import {BackgroundGradientType} from '../../types';
+import {logout} from '../../store/actions';
+import {useDispatch, useSelector} from 'react-redux';
+import {useNavigation} from '@react-navigation/core';
+import {RootState} from 'src/store/rootReducer';
+import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings';
+
+const DATA = [
+ {
+ title: 'ACCOUNT',
+ data: [
+ {
+ title: 'Suggested People Profile',
+ preimage: require('../../assets/images/tagg-logo.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ {
+ title: 'Privacy',
+ preimage: require('../../assets/images/settings/settings-white.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ ],
+ },
+ {
+ title: 'GENERAL',
+ data: [
+ {
+ title: 'Terms of use',
+ preimage: require('../../assets/images/settings/termsofuse.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ {
+ title: 'Privacy Policy',
+ preimage: require('../../assets/images/settings/privacypolicy.png'),
+ postimage: require('../../assets/images/settings/white-arrow.png'),
+ },
+ ],
+ },
+];
+
+const SettingsScreen: React.FC = () => {
+ const dispatch = useDispatch();
+ const navigation = useNavigation();
+ const {suggested_people_linked} = useSelector(
+ (state: RootState) => state.user.profile,
+ );
+ const goToUpdateSPProfile = () => {
+ if (suggested_people_linked === 0) {
+ Alert.alert(ERROR_ATTEMPT_EDIT_SP);
+ } else {
+ // Sending undefined for updatedSelectedBadges to mark that there was no update yet
+ navigateTo('UpdateSPPicture', {
+ editing: true,
+ });
+ }
+ };
+
+ const navigateTo = (screen: string, options: object) => {
+ navigation.navigate(screen, options);
+ };
+
+ const getActions = (type: string) => {
+ switch (type) {
+ case 'Suggested People Profile':
+ goToUpdateSPProfile();
+ break;
+ case 'Privacy':
+ navigateTo('PrivacyScreen', {});
+ break;
+ case 'Terms of use':
+ //TODO:
+ break;
+ case 'Privacy Policy':
+ //TODO:
+ break;
+ default:
+ break;
+ }
+ };
+
+ const Item = ({
+ title,
+ preimage,
+ postimage,
+ }: {
+ title: string;
+ preimage: number;
+ postimage: number;
+ }) => (
+ <TouchableOpacity onPress={() => getActions(title)} style={styles.item}>
+ <Image style={{width: 15, height: 15}} source={preimage} />
+ <View style={{marginLeft: 40}}>
+ <Text style={styles.title}>{title}</Text>
+ </View>
+ <Image
+ style={{width: 15, height: 15, position: 'absolute', right: 0}}
+ source={postimage}
+ />
+ </TouchableOpacity>
+ );
+
+ return (
+ <>
+ <StatusBar barStyle="light-content" />
+ <Background gradientType={BackgroundGradientType.Light}>
+ <SafeAreaView>
+ <View style={{marginLeft: 28, marginRight: 43}}>
+ <SectionList
+ sections={DATA}
+ keyExtractor={(item, index) => item.title + index}
+ renderItem={({item: {title, preimage, postimage}}) => {
+ return <Item {...{title, preimage, postimage}} />;
+ }}
+ renderSectionHeader={({section: {title}}) => (
+ <View style={{marginTop: 46}}>
+ <Text style={styles.header}>{title}</Text>
+ </View>
+ )}
+ ListFooterComponent={() => (
+ <TouchableOpacity
+ style={{marginTop: '20%', marginLeft: '12%'}}
+ onPress={() => {
+ navigation.reset({
+ index: 0,
+ routes: [{name: 'SuggestedPeople'}],
+ });
+ dispatch(logout());
+ }}>
+ <Text style={styles.logoutStyle}>Logout</Text>
+ </TouchableOpacity>
+ )}
+ />
+ </View>
+ </SafeAreaView>
+ </Background>
+ </>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ },
+ item: {
+ marginTop: 36,
+ flexDirection: 'row',
+ justifyContent: 'flex-start',
+ alignItems: 'center',
+ },
+ header: {
+ fontSize: normalize(18),
+ fontWeight: '600',
+ lineHeight: normalize(21.48),
+ color: '#E9E9E9',
+ },
+ title: {
+ fontSize: normalize(15),
+ fontWeight: '600',
+ lineHeight: normalize(17.9),
+ color: 'white',
+ },
+ logoutStyle: {
+ fontSize: normalize(20),
+ fontWeight: '600',
+ lineHeight: normalize(23.87),
+ color: 'white',
+ },
+});
+
+export default SettingsScreen;
diff --git a/src/screens/profile/index.ts b/src/screens/profile/index.ts
index f74946a6..b7efdd3b 100644
--- a/src/screens/profile/index.ts
+++ b/src/screens/profile/index.ts
@@ -7,3 +7,6 @@ export {default as FriendsListScreen} from './FriendsListScreen';
export {default as EditProfile} from './EditProfile';
export {default as MomentUploadPromptScreen} from './MomentUploadPromptScreen';
export {default as InviteFriendsScreen} from './InviteFriendsScreen';
+export {default as SettingsScreen} from './SettingsScreen';
+export {default as PrivacyScreen} from './PrivacyScreen';
+export {default as AccountType} from './AccountType';
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-23 15:04:55 +0000