common component
This commit is contained in:
Jaanu423
+261
-353
@@ -10,113 +10,16 @@ import {
|
||||
ActivityIndicator,
|
||||
StatusBar,
|
||||
TextInput,
|
||||
KeyboardAvoidingView,
|
||||
Platform,
|
||||
} from "react-native";
|
||||
import * as Keychain from "react-native-keychain";
|
||||
import {Ionicons} from "@react-native-vector-icons/ionicons";
|
||||
import { Ionicons } from "@react-native-vector-icons/ionicons";
|
||||
import { launchImageLibrary } from "react-native-image-picker";
|
||||
import { IconProps } from "react-native-elements";
|
||||
import { base_URL } from "../../utils/ApiUrls";
|
||||
import { CustomButton, CustomInput } from "../../components/common/Custom";
|
||||
|
||||
|
||||
type CustomButtonProps = {
|
||||
title: string;
|
||||
onPress: () => void;
|
||||
type?: "primary" | "secondary" | "danger" | "outline";
|
||||
icon?: React.ComponentProps<typeof Ionicons>['name'];
|
||||
style?: any;
|
||||
};
|
||||
|
||||
const CustomButton = ({
|
||||
title,
|
||||
onPress,
|
||||
type = "primary",
|
||||
icon,
|
||||
style
|
||||
}: CustomButtonProps) => {
|
||||
const getButtonStyle = () => {
|
||||
switch (type) {
|
||||
case "secondary":
|
||||
return [styles.button, styles.buttonSecondary];
|
||||
case "danger":
|
||||
return [styles.button, styles.buttonDanger];
|
||||
case "outline":
|
||||
return [styles.button, styles.buttonOutline];
|
||||
default:
|
||||
return styles.button;
|
||||
}
|
||||
};
|
||||
|
||||
const getTextStyle = () => {
|
||||
switch (type) {
|
||||
case "secondary":
|
||||
return [styles.buttonText, styles.buttonTextSecondary];
|
||||
case "danger":
|
||||
return [styles.buttonText, styles.buttonTextDanger];
|
||||
case "outline":
|
||||
return [styles.buttonText, styles.buttonTextOutline];
|
||||
default:
|
||||
return styles.buttonText;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<TouchableOpacity
|
||||
style={[getButtonStyle(), style]}
|
||||
onPress={onPress}
|
||||
activeOpacity={0.8}
|
||||
>
|
||||
{icon && (
|
||||
<Ionicons
|
||||
name={icon}
|
||||
size={18}
|
||||
color={
|
||||
Array.isArray(getTextStyle())
|
||||
? getTextStyle().find((s: any) => s && typeof s === "object" && "color" in s)?.color || "#fff"
|
||||
: (getTextStyle() as any).color || "#fff"
|
||||
}
|
||||
style={styles.buttonIcon}
|
||||
/>
|
||||
)}
|
||||
<Text style={getTextStyle()}>{title}</Text>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
};
|
||||
|
||||
// Custom Input Component
|
||||
type CustomInputProps = {
|
||||
label?: string;
|
||||
placeholder?: string;
|
||||
value?: string;
|
||||
onChangeText?: (text: string) => void;
|
||||
icon?: React.ComponentProps<typeof Ionicons>['name'];
|
||||
[key: string]: any;
|
||||
};
|
||||
|
||||
const CustomInput = ({
|
||||
label,
|
||||
placeholder,
|
||||
value,
|
||||
onChangeText,
|
||||
icon,
|
||||
...props
|
||||
}: CustomInputProps) => {
|
||||
return (
|
||||
<View style={styles.inputContainer}>
|
||||
{label && <Text style={styles.inputLabel}>{label}</Text>}
|
||||
<View style={styles.inputWrapper}>
|
||||
{icon && <Ionicons name={icon} size={20} color="#666" style={styles.inputIcon} />}
|
||||
<TextInput
|
||||
style={[styles.input, icon && styles.inputWithIcon]}
|
||||
placeholder={placeholder}
|
||||
placeholderTextColor="#999"
|
||||
value={value}
|
||||
onChangeText={onChangeText}
|
||||
{...props}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
type UserProfile = {
|
||||
id: string;
|
||||
@@ -236,64 +139,64 @@ const Profile = () => {
|
||||
};
|
||||
|
||||
const handleUpdateImage = async () => {
|
||||
try {
|
||||
const credentials = await Keychain.getGenericPassword();
|
||||
if (!credentials) {
|
||||
Alert.alert("Error", "You are not logged in");
|
||||
return;
|
||||
}
|
||||
const token = credentials.password;
|
||||
|
||||
if (!user?.filePath) {
|
||||
Alert.alert("Error", "Please select an image first");
|
||||
return;
|
||||
}
|
||||
|
||||
setImageUpdating(true);
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append("file", {
|
||||
uri: user.filePath,
|
||||
type: "image/jpeg",
|
||||
name: "profile.jpg",
|
||||
} as any);
|
||||
|
||||
const response = await fetch(
|
||||
`${base_URL}user/update/userImg`,
|
||||
{
|
||||
method: "PUT",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
body: formData,
|
||||
try {
|
||||
const credentials = await Keychain.getGenericPassword();
|
||||
if (!credentials) {
|
||||
Alert.alert("Error", "You are not logged in");
|
||||
return;
|
||||
}
|
||||
);
|
||||
const token = credentials.password;
|
||||
|
||||
const result = await response.json();
|
||||
if (result.status === "success") {
|
||||
Alert.alert("Success", "Profile image updated successfully");
|
||||
if (!user?.filePath) {
|
||||
Alert.alert("Error", "Please select an image first");
|
||||
return;
|
||||
}
|
||||
|
||||
// If API returns updated image, set it
|
||||
if (result.data?.imageBlob) {
|
||||
setUser((prev) => prev ? { ...prev, imageBlob: result.data.imageBlob, filePath: null } : prev);
|
||||
setImageUpdating(true);
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append("file", {
|
||||
uri: user.filePath,
|
||||
type: "image/jpeg",
|
||||
name: "profile.jpg",
|
||||
} as any);
|
||||
|
||||
const response = await fetch(
|
||||
`${base_URL}user/update/userImg`,
|
||||
{
|
||||
method: "PUT",
|
||||
headers: {
|
||||
Accept: "application/json",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
body: formData,
|
||||
}
|
||||
);
|
||||
|
||||
const result = await response.json();
|
||||
if (result.status === "success") {
|
||||
Alert.alert("Success", "Profile image updated successfully");
|
||||
|
||||
// If API returns updated image, set it
|
||||
if (result.data?.imageBlob) {
|
||||
setUser((prev) => prev ? { ...prev, imageBlob: result.data.imageBlob, filePath: null } : prev);
|
||||
} else {
|
||||
// Otherwise, keep the local filePath until next fetch
|
||||
setUser((prev) => prev ? { ...prev, filePath: user.filePath } : prev);
|
||||
}
|
||||
|
||||
// Refresh profile from API as well
|
||||
fetchUserProfile();
|
||||
} else {
|
||||
// Otherwise, keep the local filePath until next fetch
|
||||
setUser((prev) => prev ? { ...prev, filePath: user.filePath } : prev);
|
||||
Alert.alert("Error", result.message || "Failed to update profile image");
|
||||
}
|
||||
|
||||
// Refresh profile from API as well
|
||||
fetchUserProfile();
|
||||
} else {
|
||||
Alert.alert("Error", result.message || "Failed to update profile image");
|
||||
} catch (error) {
|
||||
console.error("❌ Error updating profile image:", error);
|
||||
Alert.alert("Error", "Could not update profile image");
|
||||
} finally {
|
||||
setImageUpdating(false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("❌ Error updating profile image:", error);
|
||||
Alert.alert("Error", "Could not update profile image");
|
||||
} finally {
|
||||
setImageUpdating(false);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
@@ -301,15 +204,15 @@ const Profile = () => {
|
||||
}, []);
|
||||
|
||||
console.log("user image :", user?.filePath);
|
||||
const getProfileImage = () => {
|
||||
if (user?.imageBlob) {
|
||||
return `data:image/jpeg;base64,${user.imageBlob}`;
|
||||
}
|
||||
if (user?.filePath) {
|
||||
return user.filePath;
|
||||
}
|
||||
return "https://randomuser.me/api/portraits/men/1.jpg";
|
||||
};
|
||||
const getProfileImage = () => {
|
||||
if (user?.imageBlob) {
|
||||
return `data:image/jpeg;base64,${user.imageBlob}`;
|
||||
}
|
||||
if (user?.filePath) {
|
||||
return user.filePath;
|
||||
}
|
||||
return "https://randomuser.me/api/portraits/men/1.jpg";
|
||||
};
|
||||
|
||||
|
||||
if (fetching || !user) {
|
||||
@@ -324,7 +227,7 @@ const getProfileImage = () => {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<StatusBar backgroundColor="#6366f1" barStyle="light-content" />
|
||||
|
||||
|
||||
{/* Header */}
|
||||
<View style={styles.header}>
|
||||
<Text style={styles.headerTitle}>User Profile</Text>
|
||||
@@ -332,201 +235,207 @@ const getProfileImage = () => {
|
||||
<Ionicons name="refresh" size={24} color="#fff" />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<KeyboardAvoidingView
|
||||
style={{ flex: 1 }}
|
||||
behavior={Platform.OS === "ios" ? "padding" : undefined}
|
||||
>
|
||||
<ScrollView
|
||||
contentContainerStyle={{ flexGrow: 1 }}
|
||||
keyboardShouldPersistTaps="handled"
|
||||
>
|
||||
{/* Profile Card */}
|
||||
<View style={styles.profileCard}>
|
||||
{/* Profile Image Section */}
|
||||
<View style={styles.profileImageSection}>
|
||||
<View style={styles.avatarContainer}>
|
||||
<Image
|
||||
source={{ uri: getProfileImage() }}
|
||||
style={styles.avatar}
|
||||
onError={() => console.log("Error loading image")}
|
||||
/>
|
||||
<TouchableOpacity style={styles.cameraIcon} onPress={pickImage}>
|
||||
<Ionicons name="camera" size={18} color="white" />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<ScrollView style={styles.scrollContainer}>
|
||||
{/* Profile Card */}
|
||||
<View style={styles.profileCard}>
|
||||
{/* Profile Image Section */}
|
||||
<View style={styles.profileImageSection}>
|
||||
<View style={styles.avatarContainer}>
|
||||
<Image
|
||||
source={{ uri: getProfileImage() }}
|
||||
style={styles.avatar}
|
||||
onError={() => console.log("Error loading image")}
|
||||
/>
|
||||
<TouchableOpacity style={styles.cameraIcon} onPress={pickImage}>
|
||||
<Ionicons name="camera" size={18} color="white" />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<CustomButton
|
||||
title={imageUpdating ? "Updating..." : "Update Image"}
|
||||
onPress={handleUpdateImage}
|
||||
icon={imageUpdating ? undefined : "cloud-upload"}
|
||||
style={styles.updateImageButton}
|
||||
<CustomButton
|
||||
title={imageUpdating ? "Updating..." : "Update Image"}
|
||||
onPress={handleUpdateImage}
|
||||
icon={imageUpdating ? undefined : "cloud-upload"}
|
||||
style={styles.updateImageButton}
|
||||
// disabled={imageUpdating}
|
||||
/>
|
||||
</View>
|
||||
|
||||
{!editing ? (
|
||||
<>
|
||||
{/* Profile Details */}
|
||||
<View style={styles.detailsSection}>
|
||||
<Text style={styles.sectionTitle}>Personal Information</Text>
|
||||
<View style={{ marginBottom: 16 }}>
|
||||
|
||||
<Text style={{ color: "#64748b", marginBottom: 16 }}>Become Organizer</Text>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="person" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Name</Text>
|
||||
<Text style={styles.detailText}>{user.firstName} {user.lastName}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="mail" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Email</Text>
|
||||
<Text style={styles.detailText}>{user.email || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="call" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Mobile</Text>
|
||||
<Text style={styles.detailText}>{user.mobile || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="at-circle" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Username</Text>
|
||||
<Text style={styles.detailText}>{user.username}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="location" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Address</Text>
|
||||
<Text style={styles.detailText}>{user.address || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="male-female" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Gender</Text>
|
||||
<Text style={styles.detailText}>{user.gender || "Not specified"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="key" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Role</Text>
|
||||
<Text style={styles.detailText}>{user.role || "User"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<CustomButton
|
||||
title="Edit Profile"
|
||||
onPress={() => setEditing(true)}
|
||||
icon="create"
|
||||
style={styles.editButton}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{/* Edit Form */}
|
||||
<View style={styles.editSection}>
|
||||
<Text style={styles.sectionTitle}>Edit Profile</Text>
|
||||
|
||||
<CustomInput
|
||||
label="First Name"
|
||||
placeholder="Enter first name"
|
||||
value={user.firstName ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, firstName: text })}
|
||||
icon="person"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Last Name"
|
||||
placeholder="Enter last name"
|
||||
value={user.lastName ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, lastName: text })}
|
||||
icon="person"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Email"
|
||||
placeholder="Enter email"
|
||||
value={user.email ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, email: text })}
|
||||
icon="mail"
|
||||
keyboardType="email-address"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Username"
|
||||
placeholder="Enter username"
|
||||
value={user.username ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, username: text })}
|
||||
icon="at"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Address"
|
||||
placeholder="Enter address"
|
||||
value={user.address ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, address: text })}
|
||||
icon="location"
|
||||
multiline
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Gender"
|
||||
placeholder="Enter gender"
|
||||
value={user.gender ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, gender: text })}
|
||||
icon="male-female"
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{!editing ? (
|
||||
<>
|
||||
{/* Profile Details */}
|
||||
<View style={styles.detailsSection}>
|
||||
<Text style={styles.sectionTitle}>Personal Information</Text>
|
||||
<View style={{ marginBottom: 16 }}>
|
||||
|
||||
<Text style={{ color: "#64748b", marginBottom: 16 }}>Become Organizer</Text>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="person" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Name</Text>
|
||||
<Text style={styles.detailText}>{user.firstName} {user.lastName}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="mail" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Email</Text>
|
||||
<Text style={styles.detailText}>{user.email || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="call" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Mobile</Text>
|
||||
<Text style={styles.detailText}>{user.mobile || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="at-circle" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Username</Text>
|
||||
<Text style={styles.detailText}>{user.username}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="location" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Address</Text>
|
||||
<Text style={styles.detailText}>{user.address || "Not provided"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="male-female" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Gender</Text>
|
||||
<Text style={styles.detailText}>{user.gender || "Not specified"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.detailRow}>
|
||||
<Ionicons name="key" size={20} color="#6366f1" style={styles.detailIcon} />
|
||||
<View>
|
||||
<Text style={styles.detailLabel}>Role</Text>
|
||||
<Text style={styles.detailText}>{user.role || "User"}</Text>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View style={styles.editButtons}>
|
||||
<CustomButton
|
||||
title="Save Changes"
|
||||
onPress={updateProfile}
|
||||
icon="save"
|
||||
style={styles.saveButton}
|
||||
/>
|
||||
<CustomButton
|
||||
title="Cancel"
|
||||
type="outline"
|
||||
onPress={() => setEditing(false)}
|
||||
icon="close"
|
||||
style={styles.cancelButton}
|
||||
title="Edit Profile"
|
||||
onPress={() => setEditing(true)}
|
||||
icon="create"
|
||||
style={styles.editButton}
|
||||
/>
|
||||
</View>
|
||||
</>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{/* Edit Form */}
|
||||
<View style={styles.editSection}>
|
||||
<Text style={styles.sectionTitle}>Edit Profile</Text>
|
||||
|
||||
<CustomInput
|
||||
label="First Name"
|
||||
placeholder="Enter first name"
|
||||
value={user.firstName ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, firstName: text })}
|
||||
icon="person"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Last Name"
|
||||
placeholder="Enter last name"
|
||||
value={user.lastName ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, lastName: text })}
|
||||
icon="person"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Email"
|
||||
placeholder="Enter email"
|
||||
value={user.email ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, email: text })}
|
||||
icon="mail"
|
||||
keyboardType="email-address"
|
||||
/>
|
||||
|
||||
<CustomInput
|
||||
label="Username"
|
||||
placeholder="Enter username"
|
||||
value={user.username ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, username: text })}
|
||||
icon="at"
|
||||
/>
|
||||
<CustomInput
|
||||
label="Address"
|
||||
placeholder="Enter address"
|
||||
value={user.address ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, address: text })}
|
||||
icon="location"
|
||||
multiline
|
||||
/>
|
||||
<CustomInput
|
||||
label="Gender"
|
||||
placeholder="Enter gender"
|
||||
value={user.gender ?? ""}
|
||||
onChangeText={(text) => setUser({ ...user, gender: text })}
|
||||
icon="male-female"
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.editButtons}>
|
||||
<CustomButton
|
||||
title="Save Changes"
|
||||
onPress={updateProfile}
|
||||
icon="save"
|
||||
style={styles.saveButton}
|
||||
/>
|
||||
<CustomButton
|
||||
title="Cancel"
|
||||
type="outline"
|
||||
onPress={() => setEditing(false)}
|
||||
icon="close"
|
||||
style={styles.cancelButton}
|
||||
/>
|
||||
</View>
|
||||
</>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</KeyboardAvoidingView>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: "#f8fafc"
|
||||
container: {
|
||||
flex: 1,
|
||||
backgroundColor: "#f8fafc",
|
||||
marginBottom: '30%',
|
||||
},
|
||||
loadingContainer: {
|
||||
flex: 1,
|
||||
justifyContent: "center",
|
||||
loadingContainer: {
|
||||
flex: 1,
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
backgroundColor: "#f8fafc"
|
||||
},
|
||||
loadingText: {
|
||||
marginTop: 10,
|
||||
fontSize: 16,
|
||||
color: "#64748b"
|
||||
loadingText: {
|
||||
marginTop: 10,
|
||||
fontSize: 16,
|
||||
color: "#64748b"
|
||||
},
|
||||
header: {
|
||||
flexDirection: "row",
|
||||
@@ -543,17 +452,15 @@ const styles = StyleSheet.create({
|
||||
shadowOpacity: 0.2,
|
||||
shadowRadius: 4,
|
||||
},
|
||||
headerTitle: {
|
||||
fontSize: 22,
|
||||
fontWeight: "700",
|
||||
color: "#fff"
|
||||
headerTitle: {
|
||||
fontSize: 22,
|
||||
fontWeight: "700",
|
||||
color: "#fff"
|
||||
},
|
||||
refreshButton: {
|
||||
padding: 4,
|
||||
},
|
||||
scrollContainer: {
|
||||
flex: 1,
|
||||
},
|
||||
|
||||
profileCard: {
|
||||
borderRadius: 20,
|
||||
margin: 16,
|
||||
@@ -576,10 +483,10 @@ const styles = StyleSheet.create({
|
||||
position: "relative",
|
||||
marginBottom: 16,
|
||||
},
|
||||
avatar: {
|
||||
width: 120,
|
||||
height: 120,
|
||||
borderRadius: 60,
|
||||
avatar: {
|
||||
width: 120,
|
||||
height: 120,
|
||||
borderRadius: 60,
|
||||
borderWidth: 4,
|
||||
borderColor: "#e2e8f0",
|
||||
},
|
||||
@@ -636,6 +543,7 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
editSection: {
|
||||
marginBottom: 20,
|
||||
flex: 1,
|
||||
},
|
||||
editButtons: {
|
||||
gap: 12,
|
||||
|
||||
Reference in New Issue
Block a user