/
AvatarSelf.tsx
41 lines (37 loc) · 1.42 KB
/
AvatarSelf.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import * as React from 'react'
import { TextStyle } from 'react-native'
import { e164NumberSelector, nameSelector, userContactDetailsSelector } from 'src/account/selectors'
import Avatar from 'src/components/Avatar'
import { Recipient, RecipientType } from 'src/recipients/recipient'
import { useSelector } from 'src/redux/hooks'
import { currentAccountSelector } from 'src/web3/selectors'
interface Props {
iconSize?: number
displayNameStyle?: TextStyle
}
// An avatar for the wallet user themselves
export function AvatarSelf({ iconSize, displayNameStyle }: Props) {
const displayName = useSelector(nameSelector)
const e164PhoneNumber = useSelector(e164NumberSelector) ?? undefined
const contactDetails = useSelector(userContactDetailsSelector)
const account = useSelector(currentAccountSelector)
// Recipient refering to the wallet user, used for the avatar
let recipient: Recipient
if (displayName && e164PhoneNumber) {
recipient = {
contactId: contactDetails.contactId || 'none',
thumbnailPath: contactDetails.thumbnailPath || undefined,
name: displayName,
e164PhoneNumber,
address: account!,
recipientType: RecipientType.Address,
}
} else {
recipient = {
address: account!,
name: displayName || undefined,
recipientType: RecipientType.Address,
}
}
return <Avatar recipient={recipient} iconSize={iconSize} displayNameStyle={displayNameStyle} />
}