mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
lenooby09.tech
1import React from 'react'
2import {View} from 'react-native'
3import {AppBskyActorDefs} from '@atproto/api'
4import {msg} from '@lingui/macro'
5import {useLingui} from '@lingui/react'
6
7import {useMaybeConvoForUser} from '#/state/queries/messages/get-convo-for-members'
8import {logEvent} from 'lib/statsig/statsig'
9import {atoms as a, useTheme} from '#/alf'
10import {Message_Stroke2_Corner0_Rounded as Message} from '../icons/Message'
11import {Link} from '../Link'
12import {canBeMessaged} from './util'
13
14export function MessageProfileButton({
15 profile,
16}: {
17 profile: AppBskyActorDefs.ProfileView
18}) {
19 const {_} = useLingui()
20 const t = useTheme()
21
22 const {data: convo, isPending} = useMaybeConvoForUser(profile.did)
23
24 const onPress = React.useCallback(() => {
25 if (convo && !convo.lastMessage) {
26 logEvent('chat:create', {logContext: 'ProfileHeader'})
27 }
28 logEvent('chat:open', {logContext: 'ProfileHeader'})
29 }, [convo])
30
31 if (isPending) {
32 // show pending state based on declaration
33 if (canBeMessaged(profile)) {
34 return (
35 <View
36 testID="dmBtnLoading"
37 aria-hidden={true}
38 style={[
39 a.justify_center,
40 a.align_center,
41 t.atoms.bg_contrast_25,
42 a.rounded_full,
43 {width: 36, height: 36},
44 ]}>
45 <Message
46 style={[
47 t.atoms.text,
48 {marginLeft: 1, marginBottom: 1, opacity: 0.3},
49 ]}
50 size="md"
51 />
52 </View>
53 )
54 } else {
55 return null
56 }
57 }
58
59 if (convo) {
60 return (
61 <Link
62 testID="dmBtn"
63 size="small"
64 color="secondary"
65 variant="solid"
66 shape="round"
67 label={_(msg`Message ${profile.handle}`)}
68 to={`/messages/${convo.id}`}
69 style={[a.justify_center, {width: 36, height: 36}]}
70 onPress={onPress}>
71 <Message
72 style={[t.atoms.text, {marginLeft: 1, marginBottom: 1}]}
73 size="md"
74 />
75 </Link>
76 )
77 } else {
78 return null
79 }
80}