t1c.dev
forked from
rocksky.app/rocksky
A decentralized music tracking and discovery platform built on AT Protocol 🎵
tsiry-sandratraina.com
1import FontAwesome from "@expo/vector-icons/FontAwesome";
2import { FC } from "react";
3import { Image, Pressable, Text, View } from "react-native";
4
5export type AvatarProps = {
6 avatar: string;
7 name: string;
8 handle: string;
9 did: string;
10 scrobblingSince: string;
11 onOpenBlueskyProfile: (didOrHandle: string) => void;
12 onViewOnPdsls: (did: string) => void;
13};
14
15const Avatar: FC<AvatarProps> = (props) => {
16 const {
17 avatar,
18 name,
19 handle,
20 scrobblingSince,
21 did,
22 onOpenBlueskyProfile,
23 onViewOnPdsls,
24 } = props;
25 return (
26 <View className="flex flex-col">
27 <Image
28 source={{
29 uri: avatar,
30 }}
31 className="w-[80px] h-[80px] rounded-full mr-[15px]"
32 />
33 <View>
34 <View className="flex flex-row items-center mt-[10px]">
35 <Text className="flex-1 font-rockford-regular text-white text-[21px]">
36 {name}
37 </Text>
38 <Pressable onPress={() => onViewOnPdsls(did)}>
39 <FontAwesome name="external-link" size={18} color="white" />
40 </Pressable>
41 </View>
42
43 <View className="flex flex-row items-center mt-[2px]">
44 <Pressable onPress={() => props.onOpenBlueskyProfile(handle)}>
45 <Text className="font-rockford-regular text-[#ff2876]">
46 {handle}
47 </Text>
48 </Pressable>
49 <Text className="font-rockford-regular text-[#A0A0A0] ml-[5px] mr-[5px] mt-[2px] ">
50 •
51 </Text>
52 <Text className="font-rockford-regular text-[#A0A0A0] text-[12px]">
53 scrobbling since {scrobblingSince}
54 </Text>
55 </View>
56 </View>
57 </View>
58 );
59};
60
61export default Avatar;