60 lines
1.8 KiB
JavaScript
60 lines
1.8 KiB
JavaScript
import React, { useState, useEffect } from 'react';
|
|
import { Avatar } from 'react-native-paper';
|
|
import { View, StyleSheet, Text } from 'react-native';
|
|
import API from './../API.js';
|
|
|
|
const DefaultPhoto = "https://social.emmint.com/uploads/e6f9be6d665dc43417701bf16a90122c.png";
|
|
|
|
const ProfileHeader = ({ profileid, withName = false, small = false }) => {
|
|
let [profile, setProfile] = useState({});
|
|
|
|
useEffect(() => {
|
|
let subscribed = true;
|
|
let getData = async () => {
|
|
let p = await API.getUserProfile(profileid).catch(() => { return {} });
|
|
if (subscribed)
|
|
setProfile(p);
|
|
}
|
|
getData();
|
|
return () => {
|
|
subscribed = false;
|
|
};
|
|
}, [profileid]);
|
|
let photoUrl = profile.profile && profile.profile.photo ? 'https://social.emmint.com/' + profile.profile.photo : DefaultPhoto;
|
|
const fullName = " " + profile.profile?.firstName + " " + profile.profile?.lastName;
|
|
console.log(photoUrl);
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={styles.avatarContainer}>
|
|
<Avatar.Image size={small ? 20 : 30} source={{ uri: photoUrl }} />
|
|
</View>
|
|
<View style={styles.textContainer}>
|
|
<Text style={small ? styles.smallProfileName : styles.profileName}>{fullName}</Text>
|
|
</View>
|
|
</View>
|
|
);
|
|
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
},
|
|
avatarContainer: {
|
|
marginRight: 5,
|
|
},
|
|
textContainer: {
|
|
alignItems: 'center',
|
|
},
|
|
profileName: {
|
|
fontSize: 16,
|
|
fontWeight: 'bold',
|
|
},
|
|
smallProfileName: {
|
|
fontSize: 14,
|
|
fontWeight: 'bold',
|
|
},
|
|
});
|
|
|
|
export default React.memo(ProfileHeader); |