Skip to content

Commit 56ec67c

Browse files
NkbtemmyNkbtemmy
authored
Merge pull request #209 from atlp-rwanda/fix-edit-user-info
Fix: updating user profile picture and email
2 parents c3f985d + 242e7da commit 56ec67c

File tree

4 files changed

+163
-105
lines changed

4 files changed

+163
-105
lines changed

Diff for: ‎app/(app)/ActionMenu/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ export default function Index() {
8181

8282
useEffect(() => {
8383
if (imageUrl.length > 0) {
84-
setProfilePhoto(imageUrl[0]?.name);
84+
setProfilePhoto(imageUrl?.name);
8585
}
8686
}, [imageUrl]);
8787

Diff for: ‎app/(app)/Profile/EditProfile.tsx

+111-72
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
import React, { useContext, useState, useEffect } from "react";
2-
import { Pressable, StyleSheet, View, FlatList, TextInput, Platform } from "react-native";
2+
import {
3+
Pressable,
4+
StyleSheet,
5+
View,
6+
FlatList,
7+
TextInput,
8+
Platform,
9+
} from "react-native";
310
import { SvgXml } from "react-native-svg";
411
import { Dropdown } from "react-native-element-dropdown";
512
import Button from "@/components/UI/Button";
613
import { Colors } from "@/constants/Colors";
7-
import DateTimePicker from '@react-native-community/datetimepicker';
14+
import DateTimePicker from "@react-native-community/datetimepicker";
815
import {
916
CalenderIcon,
1017
CalenderIconDark,
@@ -19,18 +26,19 @@ import { ThemeContext } from "@/ctx/ThemeContext";
1926
import { supabase } from "@/lib/supabase";
2027
import { fetchPatientData, getPatientData } from "@/utils/LoggedInUser";
2128
import { User } from "@/utils/LoggedInUser";
29+
import { router } from "expo-router";
2230

2331
interface PatientData {
24-
id: string,
25-
first_name: string,
26-
last_name: string,
27-
date_of_birth: string,
28-
gender: string,
29-
country: string,
30-
email: string,
31-
phone: string,
32+
id: string;
33+
first_name: string;
34+
last_name: string;
35+
date_of_birth: string;
36+
gender: string;
37+
country: string;
38+
email: string;
39+
phone: string;
3240
}
33-
interface props{
41+
interface props {
3442
disabled?: boolean;
3543
editable?: boolean;
3644
}
@@ -55,7 +63,7 @@ function EditProfile() {
5563

5664
const onChange = (event: any, selectedDate?: Date) => {
5765
const currentDate = selectedDate || date;
58-
setShow(Platform.OS === 'ios');
66+
setShow(Platform.OS === "ios");
5967
setDate(currentDate);
6068
};
6169

@@ -65,11 +73,11 @@ function EditProfile() {
6573

6674
const formatDate = (date: Date): string => {
6775
const year = date.getFullYear();
68-
const month = (date.getMonth() + 1).toString().padStart(2, '0'); // Months are 0-based, so add 1
69-
const day = date.getDate().toString().padStart(2, '0');
76+
const month = (date.getMonth() + 1).toString().padStart(2, "0"); // Months are 0-based, so add 1
77+
const day = date.getDate().toString().padStart(2, "0");
7078
return `${year}-${month}-${day}`;
7179
};
72-
80+
7381
useEffect(() => {
7482
getPatientData(supabase, setUserData);
7583
}, []);
@@ -78,37 +86,38 @@ function EditProfile() {
7886
const id: string = userData?.id as string;
7987
if (id) {
8088
fetchPatientData(id, setPatientData);
81-
if(userData){
82-
setEmail(userData?.email as string)
83-
setPhone(userData?.phone as string)
89+
if (userData) {
90+
setEmail(userData?.email as string);
91+
setPhone(userData?.phone as string);
8492
}
8593
}
8694
}, [userData]);
87-
95+
8896
useEffect(() => {
89-
if(patientData){
90-
setCountry(patientData[0]?.country as string)
91-
setFirstName(patientData[0]?.first_name as string)
92-
setLastName(patientData[0]?.last_name as string)
93-
setGender(patientData[0]?.gender as string)
94-
setBirthDate(patientData[0]?.date_of_birth as string)
95-
setId(patientData[0]?.id)
96-
setPhone(patientData[0]?.phone as string)
97-
}
97+
if (patientData) {
98+
setCountry(patientData[0]?.country as string);
99+
setFirstName(patientData[0]?.first_name as string);
100+
setLastName(patientData[0]?.last_name as string);
101+
setGender(patientData[0]?.gender as string);
102+
setBirthDate(patientData[0]?.date_of_birth as string);
103+
setId(patientData[0]?.id);
104+
setPhone(patientData[0]?.phone as string);
98105
}
99-
, [patientData]);
106+
}, [patientData]);
100107

101108
useEffect(() => {
102-
setBirthDate(`${formatDate(date)}`)
103-
},[date])
109+
setBirthDate(`${formatDate(date)}`);
110+
}, [date]);
104111

105112
useEffect(() => {
106113
const getUser = async () => {
107-
const { data:{user} } = await supabase.auth.getUser()
108-
setEmail(user?.email as string)
109-
}
110-
getUser()
111-
},[])
114+
const {
115+
data: { user },
116+
} = await supabase.auth.getUser();
117+
setEmail(user?.email as string);
118+
};
119+
getUser();
120+
}, []);
112121

113122
const countryNames: { label: string; value: string }[] = Object.keys(
114123
typedCountries
@@ -119,22 +128,26 @@ function EditProfile() {
119128
const handleUpdate = async () => {
120129
try {
121130
const data = await supabase
122-
.from('patients')
131+
.from("patients")
123132
.update({
124133
first_name: firstName,
125134
last_name: lastName,
126135
gender: gender,
127136
date_of_birth: birthDate,
128137
country: country,
129-
phone: phone
138+
phone: phone,
130139
})
131-
.eq('id', id);
140+
.eq("id", id);
141+
142+
const res = await supabase.auth.updateUser({ email: email });
143+
144+
console.log(res);
132145

133146
if (data.error) throw data.error;
134-
console.log(data)
135147
alert("Profile updated successfully");
148+
router.back();
136149
} catch (error) {
137-
console.log(error)
150+
console.log(error);
138151
alert("Error updating profile");
139152
}
140153
};
@@ -165,32 +178,44 @@ function EditProfile() {
165178
Typography.semiBold.medium,
166179
{
167180
backgroundColor:
168-
theme === "light" ? Colors.grayScale._50 : Colors.dark._2,
181+
theme === "light"
182+
? Colors.grayScale._50
183+
: Colors.dark._2,
169184
borderRadius: 15,
170185
flexDirection: "row",
171186
alignItems: "center",
172187
paddingHorizontal: 20,
173-
color: theme === "light" ? Colors.grayScale._900 : Colors.others.white,
188+
color:
189+
theme === "light"
190+
? Colors.grayScale._900
191+
: Colors.others.white,
174192
paddingVertical: 15,
175-
}]}
193+
},
194+
]}
176195
placeholderTextColor={Colors.grayScale._500}
177196
placeholder="First Name"
178197
value={firstName}
179-
onChangeText={(text)=>setFirstName(text) }
198+
onChangeText={(text) => setFirstName(text)}
180199
/>
181200
<TextInput
182201
style={[
183202
Typography.semiBold.medium,
184203
{
185204
backgroundColor:
186-
theme === "light" ? Colors.grayScale._50 : Colors.dark._2,
205+
theme === "light"
206+
? Colors.grayScale._50
207+
: Colors.dark._2,
187208
borderRadius: 15,
188209
flexDirection: "row",
189210
alignItems: "center",
190211
paddingHorizontal: 20,
191-
color: theme === "light" ? Colors.grayScale._900 : Colors.others.white,
212+
color:
213+
theme === "light"
214+
? Colors.grayScale._900
215+
: Colors.others.white,
192216
paddingVertical: 15,
193-
}]}
217+
},
218+
]}
194219
placeholderTextColor={Colors.grayScale._500}
195220
placeholder="Last Name"
196221
value={lastName}
@@ -204,13 +229,16 @@ function EditProfile() {
204229
flexDirection: "row",
205230
alignItems: "center",
206231
paddingHorizontal: 20,
207-
}}>
232+
}}
233+
>
208234
<TextInput
209235
style={[
210236
Typography.semiBold.medium,
211237
{
212238
color:
213-
theme === "light" ? Colors.grayScale._900 : Colors.others.white,
239+
theme === "light"
240+
? Colors.grayScale._900
241+
: Colors.others.white,
214242
flexGrow: 1,
215243
paddingVertical: 15,
216244
},
@@ -223,19 +251,17 @@ function EditProfile() {
223251
/>
224252
<Pressable onPress={showDatepicker}>
225253
<SvgXml
226-
xml={
227-
theme === "light" ? CalenderIcon : CalenderIconDark
228-
}
254+
xml={theme === "light" ? CalenderIcon : CalenderIconDark}
229255
/>
230256
</Pressable>
231257
{show && (
232-
<DateTimePicker
233-
value={date}
234-
mode="date"
235-
display="default"
236-
onChange={onChange}
237-
/>
238-
)}
258+
<DateTimePicker
259+
value={date}
260+
mode="date"
261+
display="default"
262+
onChange={onChange}
263+
/>
264+
)}
239265
</View>
240266
<View
241267
style={{
@@ -245,13 +271,16 @@ function EditProfile() {
245271
flexDirection: "row",
246272
alignItems: "center",
247273
paddingHorizontal: 20,
248-
}}>
274+
}}
275+
>
249276
<TextInput
250277
style={[
251278
Typography.semiBold.medium,
252279
{
253280
color:
254-
theme === "light" ? Colors.grayScale._900 : Colors.others.white,
281+
theme === "light"
282+
? Colors.grayScale._900
283+
: Colors.others.white,
255284
flexGrow: 1,
256285
paddingVertical: 15,
257286
},
@@ -263,9 +292,7 @@ function EditProfile() {
263292
/>
264293
<Pressable>
265294
<SvgXml
266-
xml={
267-
theme === "light" ? MessageIcon : MessageIconDark
268-
}
295+
xml={theme === "light" ? MessageIcon : MessageIconDark}
269296
/>
270297
</Pressable>
271298
</View>
@@ -329,14 +356,20 @@ function EditProfile() {
329356
Typography.semiBold.medium,
330357
{
331358
backgroundColor:
332-
theme === "light" ? Colors.grayScale._50 : Colors.dark._2,
359+
theme === "light"
360+
? Colors.grayScale._50
361+
: Colors.dark._2,
333362
borderRadius: 15,
334363
flexDirection: "row",
335364
alignItems: "center",
336365
paddingHorizontal: 20,
337-
color: theme === "light" ? Colors.grayScale._900 : Colors.others.white,
366+
color:
367+
theme === "light"
368+
? Colors.grayScale._900
369+
: Colors.others.white,
338370
paddingVertical: 15,
339-
}]}
371+
},
372+
]}
340373
placeholderTextColor={Colors.grayScale._500}
341374
placeholder="+250"
342375
value={phone}
@@ -347,14 +380,20 @@ function EditProfile() {
347380
Typography.semiBold.medium,
348381
{
349382
backgroundColor:
350-
theme === "light" ? Colors.grayScale._50 : Colors.dark._2,
383+
theme === "light"
384+
? Colors.grayScale._50
385+
: Colors.dark._2,
351386
borderRadius: 15,
352387
flexDirection: "row",
353388
alignItems: "center",
354389
paddingHorizontal: 20,
355-
color: theme === "light" ? Colors.grayScale._900 : Colors.others.white,
390+
color:
391+
theme === "light"
392+
? Colors.grayScale._900
393+
: Colors.others.white,
356394
paddingVertical: 15,
357-
}]}
395+
},
396+
]}
358397
placeholderTextColor={Colors.grayScale._500}
359398
placeholder="Gender"
360399
value={gender}
@@ -378,7 +417,7 @@ function EditProfile() {
378417
)}
379418
</>
380419
);
381-
};
420+
}
382421

383422
export default EditProfile;
384423

0 commit comments

Comments
 (0)