diff --git a/src/components/dms/ConvoMenu.tsx b/src/components/dms/ConvoMenu.tsx index 1a389a92c6..d1cae24b20 100644 --- a/src/components/dms/ConvoMenu.tsx +++ b/src/components/dms/ConvoMenu.tsx @@ -38,7 +38,7 @@ import {Bubble_Stroke2_Corner2_Rounded as Bubble} from '../icons/Bubble' import {ReportDialog} from './ReportDialog' let ConvoMenu = ({ - convo: initialConvo, + convo, profile, control, currentScreen, @@ -61,52 +61,14 @@ let ConvoMenu = ({ latestReportableMessage?: ChatBskyConvoDefs.MessageView style?: ViewStyleProp['style'] }): React.ReactNode => { - const navigation = useNavigation() const {_} = useLingui() const t = useTheme() + const leaveConvoControl = Prompt.usePromptControl() const reportControl = Prompt.usePromptControl() const blockedByListControl = Prompt.usePromptControl() - const {mutate: markAsRead} = useMarkAsReadMutation() - - const {listBlocks, userBlock} = blockInfo - const isBlocking = userBlock || !!listBlocks.length - const isDeletedAccount = profile.handle === 'missing.invalid' - - const convoId = initialConvo.id - const {data: convo} = useConvoQuery(convoId, initialConvo) - const onNavigateToProfile = useCallback(() => { - navigation.navigate('Profile', {name: profile.did}) - }, [navigation, profile.did]) - - const {mutate: muteConvo} = useMuteConvo(convoId, { - onSuccess: data => { - if (data.convo.muted) { - Toast.show(_(msg`Chat muted`)) - } else { - Toast.show(_(msg`Chat unmuted`)) - } - }, - onError: () => { - Toast.show(_(msg`Could not mute chat`), 'xmark') - }, - }) - - const [queueBlock, queueUnblock] = useProfileBlockMutationQueue(profile) - - const toggleBlock = React.useCallback(() => { - if (listBlocks.length) { - blockedByListControl.open() - return - } - - if (userBlock) { - queueUnblock() - } else { - queueBlock() - } - }, [userBlock, listBlocks, blockedByListControl, queueBlock, queueUnblock]) + const {listBlocks} = blockInfo return ( <> @@ -119,7 +81,6 @@ let ConvoMenu = ({ {...props} onPress={() => { Keyboard.dismiss() - props.onPress() }} style={[ @@ -136,90 +97,22 @@ let ConvoMenu = ({ )} - {isDeletedAccount ? ( - - leaveConvoControl.open()}> - - Leave conversation - - - - - ) : ( - - - {showMarkAsRead && ( - markAsRead({convoId})}> - - Mark as read - - - - )} - - - Go to profile - - - - muteConvo({mute: !convo?.muted})}> - - {convo?.muted ? ( - Unmute conversation - ) : ( - Mute conversation - )} - - - - - - - - - {isBlocking ? _(msg`Unblock account`) : _(msg`Block account`)} - - - - reportControl.open()}> - - Report conversation - - - - - - - leaveConvoControl.open()}> - - Leave conversation - - - - - - )} + + + {latestReportableMessage ? ( @@ -227,7 +120,7 @@ let ConvoMenu = ({ currentScreen={currentScreen} params={{ type: 'convoMessage', - convoId: convoId, + convoId: convo.id, message: latestReportableMessage, }} control={reportControl} @@ -245,4 +138,144 @@ let ConvoMenu = ({ } ConvoMenu = React.memo(ConvoMenu) +function MenuContent({ + convo: initialConvo, + profile, + showMarkAsRead, + blockInfo, + leaveConvoControl, + reportControl, + blockedByListControl, +}: { + convo: ChatBskyConvoDefs.ConvoView + profile: Shadow + showMarkAsRead?: boolean + blockInfo: { + listBlocks: ModerationCause[] + userBlock?: ModerationCause + } + leaveConvoControl: Prompt.PromptControlProps + reportControl: Prompt.PromptControlProps + blockedByListControl: Prompt.PromptControlProps +}) { + const navigation = useNavigation() + const {_} = useLingui() + const {mutate: markAsRead} = useMarkAsReadMutation() + + const {listBlocks, userBlock} = blockInfo + const isBlocking = userBlock || !!listBlocks.length + const isDeletedAccount = profile.handle === 'missing.invalid' + + const convoId = initialConvo.id + const {data: convo} = useConvoQuery(convoId, initialConvo) + + const onNavigateToProfile = useCallback(() => { + navigation.navigate('Profile', {name: profile.did}) + }, [navigation, profile.did]) + + const {mutate: muteConvo} = useMuteConvo(convoId, { + onSuccess: data => { + if (data.convo.muted) { + Toast.show(_(msg`Chat muted`)) + } else { + Toast.show(_(msg`Chat unmuted`)) + } + }, + onError: () => { + Toast.show(_(msg`Could not mute chat`), 'xmark') + }, + }) + + const [queueBlock, queueUnblock] = useProfileBlockMutationQueue(profile) + + const toggleBlock = React.useCallback(() => { + if (listBlocks.length) { + blockedByListControl.open() + return + } + + if (userBlock) { + queueUnblock() + } else { + queueBlock() + } + }, [userBlock, listBlocks, blockedByListControl, queueBlock, queueUnblock]) + + return isDeletedAccount ? ( + leaveConvoControl.open()}> + + Leave conversation + + + + ) : ( + <> + + {showMarkAsRead && ( + markAsRead({convoId})}> + + Mark as read + + + + )} + + + Go to profile + + + + muteConvo({mute: !convo?.muted})}> + + {convo?.muted ? ( + Unmute conversation + ) : ( + Mute conversation + )} + + + + + + + + + {isBlocking ? _(msg`Unblock account`) : _(msg`Block account`)} + + + + reportControl.open()}> + + Report conversation + + + + + + + leaveConvoControl.open()}> + + Leave conversation + + + + + + ) +} + export {ConvoMenu}