aboutsummaryrefslogtreecommitdiff
path: root/src/screens/profile
diff options
context:
space:
mode:
authorIvan Chen <ivan@tagg.id>2021-04-20 17:49:38 -0400
committerIvan Chen <ivan@tagg.id>2021-04-20 17:49:38 -0400
commitc4e76811cae6cf14d5cc8daed9317f808087ed77 (patch)
treec162da11dcf70f565d20a9d69071f0cbb5b077b3 /src/screens/profile
parentbae0136cb1939302b758249a1978251bd37aaee8 (diff)
linted
Diffstat (limited to 'src/screens/profile')
-rw-r--r--src/screens/profile/EditProfile.tsx78
-rw-r--r--src/screens/profile/SocialMediaTaggs.tsx38
2 files changed, 52 insertions, 64 deletions
diff --git a/src/screens/profile/EditProfile.tsx b/src/screens/profile/EditProfile.tsx
index 8b658043..36abb146 100644
--- a/src/screens/profile/EditProfile.tsx
+++ b/src/screens/profile/EditProfile.tsx
@@ -199,12 +199,12 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
/*
* Handles changes to the website field value and verifies the input by updating state and running a validation function.
*/
- const handleWebsiteUpdate = (website: string) => {
- website = website.trim();
- let isValidWebsite: boolean = websiteRegex.test(website);
+ const handleWebsiteUpdate = (newWebsite: string) => {
+ newWebsite = newWebsite.trim();
+ let isValidWebsite: boolean = websiteRegex.test(newWebsite);
setForm({
...form,
- website,
+ website: newWebsite,
isValidWebsite,
});
};
@@ -212,27 +212,27 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
/*
* Handles changes to the bio field value and verifies the input by updating state and running a validation function.
*/
- const handleBioUpdate = (bio: string) => {
- let isValidBio: boolean = bioRegex.test(bio);
+ const handleBioUpdate = (newBio: string) => {
+ let isValidBio: boolean = bioRegex.test(newBio);
setForm({
...form,
- bio,
+ bio: newBio,
isValidBio,
});
};
- const handleGenderUpdate = (gender: string) => {
- if (gender === 'custom') {
- setForm({...form, gender});
+ const handleGenderUpdate = (newGender: string) => {
+ if (newGender === 'custom') {
+ setForm({...form, gender: newGender});
setIsCustomGender(true);
- } else if (gender === null) {
+ } else if (newGender === null) {
// not doing anything will make the picker "bounce back"
} else {
setIsCustomGender(false);
let isValidGender: boolean = true;
setForm({
...form,
- gender,
+ gender: newGender,
isValidGender,
});
}
@@ -383,8 +383,8 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
headerRight: () => (
<Button
title={'Save'}
- buttonStyle={{backgroundColor: 'transparent', marginRight: 15}}
- titleStyle={{fontWeight: 'bold'}}
+ buttonStyle={styles.headerRightButton}
+ titleStyle={styles.boldFont}
onPress={() => {
setLoading(true);
handleSubmit().then(() => setLoading(false));
@@ -409,22 +409,13 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
alwaysBounceVertical
contentContainerStyle={{paddingBottom: SCREEN_HEIGHT / 15}}>
<StatusBar barStyle="light-content" translucent={false} />
- <View
- style={{
- position: 'relative',
- alignSelf: 'center',
- }}>
+ <View style={styles.relativeCenter}>
<View>
<View style={styles.profile}>
<LargeProfilePic />
<SmallProfilePic />
</View>
- <View
- style={{
- position: 'relative',
- width: 280,
- alignSelf: 'center',
- }}>
+ <View style={styles.relativeCenterWithWidth}>
<TaggInput
accessibilityHint="Enter a website."
accessibilityLabel="Website input field."
@@ -540,7 +531,7 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
<SocialIcon
social={'TikTok'}
style={styles.icon}
- screenType={ScreenType.Profile}
+ whiteRing={undefined}
/>
<View style={styles.taggInput}>
<TaggInput
@@ -631,20 +622,6 @@ const styles = StyleSheet.create({
width: 110,
borderRadius: 55,
},
- submitBtn: {
- backgroundColor: '#8F01FF',
- justifyContent: 'center',
- alignItems: 'center',
- width: 150,
- height: 40,
- borderRadius: 5,
- marginTop: '5%',
- },
- submitBtnLabel: {
- fontSize: 16,
- fontWeight: '500',
- color: '#fff',
- },
customGenderInput: {
width: '100%',
height: 40,
@@ -666,7 +643,26 @@ const styles = StyleSheet.create({
aspectRatio: 1,
flex: 1,
},
- taggInput: {flex: 6.5, marginLeft: '3%'},
+ taggInput: {
+ flex: 6.5,
+ marginLeft: '3%',
+ },
+ headerRightButton: {
+ backgroundColor: 'transparent',
+ marginRight: 15,
+ },
+ boldFont: {
+ fontWeight: 'bold',
+ },
+ relativeCenter: {
+ position: 'relative',
+ alignSelf: 'center',
+ },
+ relativeCenterWithWidth: {
+ position: 'relative',
+ width: 280,
+ alignSelf: 'center',
+ },
});
export default EditProfile;
diff --git a/src/screens/profile/SocialMediaTaggs.tsx b/src/screens/profile/SocialMediaTaggs.tsx
index 466ba509..9186f187 100644
--- a/src/screens/profile/SocialMediaTaggs.tsx
+++ b/src/screens/profile/SocialMediaTaggs.tsx
@@ -3,6 +3,7 @@ import {StackNavigationProp} from '@react-navigation/stack';
import React, {useEffect, useState} from 'react';
import {ScrollView, StatusBar, StyleSheet, View} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
+import {useSelector} from 'react-redux';
import {
AvatarTitle,
SocialMediaInfo,
@@ -10,26 +11,17 @@ import {
TaggPost,
TwitterTaggPost,
} from '../../components';
+import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
import {AVATAR_GRADIENT} from '../../constants';
-import {ProfileStackParams} from '../../routes';
-import {
- SimplePostType,
- TwitterPostType,
- SocialAccountType,
- ScreenType,
-} from '../../types';
-import {AvatarHeaderHeight, SCREEN_HEIGHT} from '../../utils';
-import {useSelector} from 'react-redux';
+import {MainStackParams} from '../../routes';
import {RootState} from '../../store/rootReducer';
-import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
+import {SimplePostType, SocialAccountType, TwitterPostType} from '../../types';
+import {AvatarHeaderHeight, SCREEN_HEIGHT} from '../../utils';
-type SocialMediaTaggsRouteProp = RouteProp<
- ProfileStackParams,
- 'SocialMediaTaggs'
->;
+type SocialMediaTaggsRouteProp = RouteProp<MainStackParams, 'SocialMediaTaggs'>;
type SocialMediaTaggsNavigationProp = StackNavigationProp<
- ProfileStackParams,
+ MainStackParams,
'SocialMediaTaggs'
>;
@@ -49,13 +41,13 @@ const SocialMediaTaggs: React.FC<SocialMediaTaggsProps> = ({
const {
avatar,
profile: {name},
- } = userXId
- ? useSelector((state: RootState) => state.userX[screenType][userXId])
- : useSelector((state: RootState) => state.user);
+ } = useSelector((state: RootState) =>
+ userXId ? state.userX[screenType][userXId] : state.user,
+ );
- const {socialAccounts} = userXId
- ? useSelector((state: RootState) => state.userX[screenType][userXId])
- : useSelector((state: RootState) => state.socialAccounts);
+ const {socialAccounts} = useSelector((state: RootState) =>
+ userXId ? state.userX[screenType][userXId] : state.socialAccounts,
+ );
useEffect(() => {
const currentSocialData = {...socialAccounts[socialMediaType]};
@@ -67,7 +59,7 @@ const SocialMediaTaggs: React.FC<SocialMediaTaggsProps> = ({
useEffect(() => {
navigation.setOptions({
headerTitle: () => {
- return <AvatarTitle avatar={avatar} />;
+ return <AvatarTitle avatar={avatar ?? null} />;
},
});
}, [avatar, navigation]);
@@ -114,7 +106,7 @@ const SocialMediaTaggs: React.FC<SocialMediaTaggsProps> = ({
<TabsGradient />
</View>
) : (
- <TaggLoadingIndicator color="white" />
+ <TaggLoadingIndicator />
)}
</LinearGradient>
);