Thomas Demirdjian
86 lines
1.7 KiB
JavaScript
86 lines
1.7 KiB
JavaScript
import { Text, View } from "react-native";
|
|
import { Image as ExpoImage } from "expo-image";
|
|
import { responsiveWidth } from "../actions/responsiveSizes.js";
|
|
import { getInitials } from "../helpers";
|
|
import { Fonts, Style } from "../styles";
|
|
|
|
export default ({
|
|
name = "",
|
|
url = null,
|
|
size = responsiveWidth(7),
|
|
containerStyle = {},
|
|
}) => {
|
|
const colors = [
|
|
"#FB68A8",
|
|
"#FA6DA8",
|
|
"#F971A7",
|
|
"#F876A7",
|
|
"#F67BA6",
|
|
"#F580A6",
|
|
"#F384A5",
|
|
"#F289A5",
|
|
"#F08EA4",
|
|
"#EF93A4",
|
|
"#ED97A3",
|
|
"#EC9CA3",
|
|
"#EAA1A2",
|
|
"#E8A6A2",
|
|
"#E7AAA1",
|
|
"#E5AFA1",
|
|
"#E3B4A0",
|
|
"#E2B9A0",
|
|
"#E0BDAF",
|
|
"#DFC2AE",
|
|
"#DDC7AE",
|
|
"#DBCBAE",
|
|
"#DACFAE",
|
|
"#D8D4AE",
|
|
"#D6D8AE",
|
|
"#D5DCAE",
|
|
"#D3E1AE",
|
|
"#D2E5AE",
|
|
"#D0E9AE",
|
|
"#CFEDAE",
|
|
];
|
|
|
|
const pickColor = (name) => {
|
|
const sumChars = name
|
|
.split("")
|
|
.reduce((acc, char) => acc + char.charCodeAt(0), 0);
|
|
const index = sumChars % 30;
|
|
|
|
return colors[index];
|
|
};
|
|
|
|
return (
|
|
<View
|
|
style={{
|
|
...Style.containerRound,
|
|
width: size,
|
|
height: size,
|
|
backgroundColor: pickColor(name),
|
|
...containerStyle,
|
|
}}
|
|
>
|
|
{url ? (
|
|
<ExpoImage
|
|
source={{ uri: url }}
|
|
cachePolicy="memory-disk"
|
|
priority="high"
|
|
contentFit="cover"
|
|
transition={100}
|
|
style={{
|
|
width: size,
|
|
height: size,
|
|
borderRadius: size / 2,
|
|
}}
|
|
/>
|
|
) : (
|
|
<Text style={Fonts({ type: "section", style: { fontSize: size / 3 } })}>
|
|
{getInitials(name)}
|
|
</Text>
|
|
)}
|
|
</View>
|
|
);
|
|
};
|