| Conditions | 6 | 
| Total Lines | 145 | 
| Code Lines | 122 | 
| Lines | 0 | 
| Ratio | 0 % | 
| Changes | 0 | ||
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | import { stopLocationUpdatesAsync } from 'expo-location'; | ||
| 10 | |||
| 11 | |||
| 12 | export default function Profile({navigation, setIsLoggedIn}): any { | ||
| 13 | const [balance, setBalance] = useState(null); | ||
| 14 | const [modalVisible, setModalVisible] = useState(false); | ||
| 15 | const [prepaid, setPrepaid] = useState(null); | ||
| 16 | |||
| 17 | const [firstname, setFirstname] = useState(null); | ||
| 18 | const [lastname, setLastname] = useState(null); | ||
| 19 | const [email, setEmail] = useState(null); | ||
| 20 | const [phonenumber, setPhonenumber] = useState(null); | ||
| 21 | |||
| 22 | //Get profile data for logged in user | ||
| 23 |     useEffect(() => { | ||
| 24 |         async function getUser(): Promise<void> { | ||
| 25 | const result = await userModel.getProfile(); | ||
| 26 | |||
| 27 | const profile = result['user']; | ||
| 28 | |||
| 29 | setFirstname(profile['firstName']); | ||
| 30 | setLastname(profile['lastName']); | ||
| 31 | setEmail(profile['email']); | ||
| 32 | setPhonenumber(profile['phoneNumber']); | ||
| 33 | |||
| 34 | }; | ||
| 35 | getUser(); | ||
| 36 | }, []); | ||
| 37 | |||
| 38 |     function setFirstLastName(name: string): void { | ||
| 39 |         const userName = name.split(' '); | ||
| 40 | |||
| 41 | const firstName = userName[0]; | ||
| 42 | const lastName = userName[1]; | ||
| 43 | |||
| 44 | setFirstname(firstName); | ||
| 45 | setLastname(lastName); | ||
| 46 | }; | ||
| 47 | |||
| 48 |     async function logout(): Promise<void> {         | ||
| 49 | await authModel.logout(); | ||
| 50 | setIsLoggedIn(false); | ||
| 51 |         navigation.navigate('Auth'); | ||
| 52 | }; | ||
| 53 | |||
| 54 |     async function save() { | ||
| 55 | // Prepare user data object | ||
| 56 |         const userData = { | ||
| 57 | firstname: firstname, | ||
| 58 | lastname: lastname, | ||
| 59 | email: email, | ||
| 60 | phonenumber: phonenumber | ||
| 61 | }; | ||
| 62 | |||
| 63 | const result = await userModel.updateUser(userData); | ||
| 64 | |||
| 65 |         if (Object.prototype.hasOwnProperty.call(result, 'errors')) { | ||
| 66 |             showMessage({ | ||
| 67 | message: result['errors']['title'], | ||
| 68 | type: 'danger' | ||
| 69 | }) | ||
| 70 | |||
| 71 | return; | ||
| 72 | }; | ||
| 73 | |||
| 74 |         showMessage({ | ||
| 75 | message: result['message'], | ||
| 76 | type: 'success' | ||
| 77 | }); | ||
| 78 | }; | ||
| 79 | |||
| 80 | return ( | ||
| 81 |         <View style={styles.container}> | ||
| 82 | |||
| 83 | |||
| 84 |             <View style={[styles.infoContainer]}> | ||
| 85 | |||
| 86 |                 <View style={styles.titleContainer}> | ||
| 87 | |||
| 88 |                     <Pressable style={[styles.backButton, styles.shadowProp]} onPress={() => navigation.navigate('Map')}> | ||
| 89 | <Icon | ||
| 90 | name='x' | ||
| 91 |                             size={25}  | ||
| 92 | color='black' | ||
| 93 | /> | ||
| 94 | </Pressable> | ||
| 95 | |||
| 96 |                     <Text style={styles.title}>Profile</Text> | ||
| 97 | |||
| 98 |                     <Pressable style={styles.saveButton} onPress={() => save()}> | ||
| 99 |                             <Text style={styles.saveText}>Save</Text> | ||
| 100 | </Pressable> | ||
| 101 | |||
| 102 | </View> | ||
| 103 | |||
| 104 | |||
| 105 | |||
| 106 | |||
| 107 |                 <View style={styles.inputContainer}> | ||
| 108 | |||
| 109 | |||
| 110 | <TextInput | ||
| 111 |                         value={`${firstname} ${lastname}`} | ||
| 112 |                         style={styles.input} | ||
| 113 |                         onChangeText={(content: string) => { | ||
| 114 | setFirstLastName(content) | ||
| 115 | }} | ||
| 116 | |||
| 117 | /> | ||
| 118 | |||
| 119 | <TextInput | ||
| 120 |                         value={email} | ||
| 121 |                         style={styles.input} | ||
| 122 | keyboardType="email-address" | ||
| 123 |                         onChangeText={(content: string) => { | ||
| 124 | setEmail(content); | ||
| 125 | }} | ||
| 126 | /> | ||
| 127 | |||
| 128 | |||
| 129 | <TextInput | ||
| 130 |                         value={phonenumber} | ||
| 131 |                         style={styles.input} | ||
| 132 | keyboardType="phone-pad" | ||
| 133 |                         onChangeText={(content: string) => { | ||
| 134 | setPhonenumber(content); | ||
| 135 | }} | ||
| 136 | /> | ||
| 137 | </View> | ||
| 138 | |||
| 139 |                 <View style={styles.buttonContainer}> | ||
| 140 |                     <Pressable style={styles.prepaidButton} onPress={logout}> | ||
| 141 | <Text>Logout</Text> | ||
| 142 | </Pressable> | ||
| 143 | |||
| 144 |                     <Pressable style={[styles.prepaidButton, {backgroundColor: 'tomato'}]} onPress={() => { | ||
| 145 | setModalVisible(!modalVisible); | ||
| 146 | }}> | ||
| 147 | <Text>Delete account</Text> | ||
| 148 | </Pressable> | ||
| 149 | </View> | ||
| 150 | |||
| 151 | </View> | ||
| 152 | |||
| 153 |             <DeleteModal navigation={navigation} modalVisible={modalVisible} setModalVisible={setModalVisible} setIsLoggedIn={setIsLoggedIn}></DeleteModal> | ||
| 154 | </View> | ||
| 155 | ) | ||
| 318 | }); |