diff --git a/src/screens/Messages/ConversationSettings.tsx b/src/screens/Messages/ConversationSettings.tsx index e846e1c231..1e240623d0 100644 --- a/src/screens/Messages/ConversationSettings.tsx +++ b/src/screens/Messages/ConversationSettings.tsx @@ -3,7 +3,7 @@ import {Pressable, type StyleProp, View, type ViewStyle} from 'react-native' import {type ChatBskyConvoDefs, moderateProfile} from '@atproto/api' import {plural} from '@lingui/core/macro' import {Trans, useLingui} from '@lingui/react/macro' -import {useNavigation} from '@react-navigation/native' +import {StackActions, useNavigation} from '@react-navigation/native' import {useBottomBarOffset} from '#/lib/hooks/useBottomBarOffset' import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender' @@ -22,6 +22,7 @@ import {ConvoStatus} from '#/state/messages/convo/types' import {useModerationOpts} from '#/state/preferences/moderation-opts' import {useGetConvoAvailabilityQuery} from '#/state/queries/messages/get-convo-availability' import {useGetConvoForMembers} from '#/state/queries/messages/get-convo-for-members' +import {useLeaveConvo} from '#/state/queries/messages/leave-conversation' import {useMuteConvo} from '#/state/queries/messages/mute-conversation' import {useProfileBlockMutationQueue} from '#/state/queries/profile' import {useSession} from '#/state/session' @@ -186,9 +187,7 @@ function SettingsInner() { return ( () const convoState = useConvo() const {currentAccount} = useSession() @@ -686,8 +686,21 @@ function SettingsHeader({ Toast.show(l({message: 'Group chat unmuted', context: 'toast'})) } }, - onError: () => { - Toast.show(l`Could not mute group chat`, { + onError: e => { + logger.error('Failed to mute group chat', {message: e}) + Toast.show(l`Failed to mute group chat`, { + type: 'error', + }) + }, + }) + + const {mutate: leaveConvo} = useLeaveConvo(convo.id, { + onMutate: () => { + navigation.dispatch(StackActions.pop(2)) + }, + onError: e => { + logger.error('Failed to leave group chat', {message: e}) + Toast.show(l({message: 'Failed to leave group chat', context: 'toast'}), { type: 'error', }) }, @@ -696,6 +709,7 @@ function SettingsHeader({ const editNamePrompt = Prompt.usePromptControl() const inviteLinkPrompt = Prompt.usePromptControl() const lockChatPrompt = Prompt.usePromptControl() + const leaveChatPrompt = Prompt.usePromptControl() const [groupName, setGroupName] = useState( convoState.getGroupInfo?.()?.name ?? '', @@ -705,15 +719,15 @@ function SettingsHeader({ const [isLocked, setIsLocked] = useState(false) const handleToggleMute = () => { - try { - muteConvo({mute: !convo?.muted}) - } catch (err) { - const e = err as Error - logger.error('Failed to mute group chat', {message: e}) - Toast.show(l`There was an issue! ${e.toString()}`, {type: 'error'}) - } + muteConvo({mute: !convo?.muted}) } + const handleLeaveChat = () => { + leaveChatPrompt.open() + } + + const handleReportChat = () => {} + const handlePromptName = () => { editNamePrompt.open() } @@ -818,7 +832,7 @@ function SettingsHeader({ icon={FlagIcon} label={l`Report this group chat`} text={l`Report`} - onPress={() => {}} + onPress={handleReportChat} /> )} {isOwner ? null : ( @@ -827,7 +841,7 @@ function SettingsHeader({ icon={ArrowBoxLeftIcon} label={l`Leave this group chat`} text={l`Leave`} - onPress={() => {}} + onPress={handleLeaveChat} /> )} @@ -843,6 +857,11 @@ function SettingsHeader({ onConfirm={handleConfirmInviteLink} /> + ) } @@ -1042,6 +1061,30 @@ function LockChatPrompt({ ) } +function LeaveChatPrompt({ + control, + groupName, + onConfirm, +}: { + control: Dialog.DialogOuterProps['control'] + groupName: string + onConfirm: () => void +}) { + const {t: l} = useLingui() + + return ( + + ) +} + function BlockMemberPrompt({ control, onConfirm,