this repo has no description
1import {useCallback, useMemo} from 'react'
2import {View} from 'react-native'
3import {type ModerationDecision} from '@atproto/api'
4import {msg} from '@lingui/core/macro'
5import {useLingui} from '@lingui/react'
6import {Trans} from '@lingui/react/macro'
7
8import {useProfileShadow} from '#/state/cache/profile-shadow'
9import {useProfileBlockMutationQueue} from '#/state/queries/profile'
10import {atoms as a, useBreakpoints, useTheme} from '#/alf'
11import {Button, ButtonText} from '#/components/Button'
12import {useDialogControl} from '#/components/Dialog'
13import {Divider} from '#/components/Divider'
14import {BlockedByListDialog} from '#/components/dms/BlockedByListDialog'
15import {LeaveConvoPrompt} from '#/components/dms/LeaveConvoPrompt'
16import {ReportConversationPrompt} from '#/components/dms/ReportConversationPrompt'
17import {Text} from '#/components/Typography'
18import type * as bsky from '#/types/bsky'
19
20export function MessagesListBlockedFooter({
21 recipient: initialRecipient,
22 convoId,
23 hasMessages,
24 moderation,
25}: {
26 recipient: bsky.profile.AnyProfileView
27 convoId: string
28 hasMessages: boolean
29 moderation: ModerationDecision
30}) {
31 const t = useTheme()
32 const {gtMobile} = useBreakpoints()
33 const {_} = useLingui()
34 const recipient = useProfileShadow(initialRecipient)
35 const [__, queueUnblock] = useProfileBlockMutationQueue(recipient)
36
37 const leaveConvoControl = useDialogControl()
38 const reportControl = useDialogControl()
39 const blockedByListControl = useDialogControl()
40
41 const {listBlocks, userBlock} = useMemo(() => {
42 const modui = moderation.ui('profileView')
43 const blocks = modui.alerts.filter(alert => alert.type === 'blocking')
44 const listBlocks = blocks.filter(alert => alert.source.type === 'list')
45 const userBlock = blocks.find(alert => alert.source.type === 'user')
46 return {
47 listBlocks,
48 userBlock,
49 }
50 }, [moderation])
51
52 const isBlocking = !!userBlock || !!listBlocks.length
53
54 const onUnblockPress = useCallback(() => {
55 if (listBlocks.length) {
56 blockedByListControl.open()
57 } else {
58 queueUnblock()
59 }
60 }, [blockedByListControl, listBlocks, queueUnblock])
61
62 return (
63 <View style={[hasMessages && a.pt_md, a.pb_xl, a.gap_lg]}>
64 <Divider />
65 <Text style={[a.text_md, a.font_semi_bold, a.text_center]}>
66 {isBlocking ? (
67 <Trans>You have blocked this user</Trans>
68 ) : (
69 <Trans>This user has blocked you</Trans>
70 )}
71 </Text>
72
73 <View style={[a.flex_row, a.justify_between, a.gap_lg, a.px_md]}>
74 <Button
75 label={_(msg`Leave chat`)}
76 color="secondary"
77 variant="solid"
78 size="small"
79 style={[a.flex_1]}
80 onPress={leaveConvoControl.open}>
81 <ButtonText style={{color: t.palette.negative_500}}>
82 <Trans>Leave chat</Trans>
83 </ButtonText>
84 </Button>
85 <Button
86 label={_(msg`Report`)}
87 color="secondary"
88 variant="solid"
89 size="small"
90 style={[a.flex_1]}
91 onPress={reportControl.open}>
92 <ButtonText style={{color: t.palette.negative_500}}>
93 <Trans>Report</Trans>
94 </ButtonText>
95 </Button>
96 {isBlocking && gtMobile && (
97 <Button
98 label={_(msg`Unblock`)}
99 color="secondary"
100 variant="solid"
101 size="small"
102 style={[a.flex_1]}
103 onPress={onUnblockPress}>
104 <ButtonText style={{color: t.palette.primary_500}}>
105 <Trans>Unblock</Trans>
106 </ButtonText>
107 </Button>
108 )}
109 </View>
110 {isBlocking && !gtMobile && (
111 <View style={[a.flex_row, a.justify_center, a.px_md]}>
112 <Button
113 label={_(msg`Unblock`)}
114 color="secondary"
115 variant="solid"
116 size="small"
117 style={[a.flex_1]}
118 onPress={onUnblockPress}>
119 <ButtonText style={{color: t.palette.primary_500}}>
120 <Trans>Unblock</Trans>
121 </ButtonText>
122 </Button>
123 </View>
124 )}
125
126 <LeaveConvoPrompt
127 control={leaveConvoControl}
128 currentScreen="conversation"
129 convoId={convoId}
130 />
131
132 <ReportConversationPrompt control={reportControl} />
133
134 <BlockedByListDialog
135 control={blockedByListControl}
136 listBlocks={listBlocks}
137 />
138 </View>
139 )
140}