|
@ -9,17 +9,21 @@ import { MaterialCommunityIcons } from "@expo/vector-icons"; |
|
|
import colors from "../config/colors"; |
|
|
import colors from "../config/colors"; |
|
|
import ConfirmationModal from "../components/ConfirmationModal"; |
|
|
import ConfirmationModal from "../components/ConfirmationModal"; |
|
|
import utils from "../config/utils"; |
|
|
import utils from "../config/utils"; |
|
|
|
|
|
import { mask } from "react-native-mask-text"; |
|
|
|
|
|
|
|
|
function UserHeader({ name, fone }) { |
|
|
function UserHeader({ name, fone }) { |
|
|
const index = utils.hashPhoneNumber(fone) % assets.avatar.length || 2 |
|
|
const index = utils.hashPhoneNumber(fone) % assets.avatar.length || 2 |
|
|
const Avatar = assets.avatar[index]; |
|
|
const Avatar = assets.avatar[index]; |
|
|
|
|
|
|
|
|
|
|
|
const _mask = fone?.length >= 12 ? "(999) 99999-9999" : "(99) 99999-9999"; |
|
|
|
|
|
const fone_mask = mask(fone, _mask); |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<View style={{ flexDirection: "row", alignItems: "center", justifyContent: name ? "flex-start" : "center" }}> |
|
|
<View style={{ flexDirection: "row", alignItems: "center", justifyContent: name ? "flex-start" : "center" }}> |
|
|
<Avatar width={60} height={60}/> |
|
|
<Avatar width={60} height={60}/> |
|
|
<View style={{ marginLeft: 16 }}> |
|
|
<View style={{ marginLeft: 16 }}> |
|
|
<Text style={[styles.text, { fontWeight: "bold" }]}>{name}</Text> |
|
|
<Text style={[styles.text, { fontWeight: "bold" }]}>{name}</Text> |
|
|
<Text style={styles.text}>{fone}</Text> |
|
|
|
|
|
|
|
|
<Text style={styles.text}>{fone ? fone_mask : ""}</Text> |
|
|
</View> |
|
|
</View> |
|
|
</View> |
|
|
</View> |
|
|
); |
|
|
); |
|
|