diff --git a/src/screens/Messages/ChatList.tsx b/src/screens/Messages/ChatList.tsx index f7c44ec2d2..3bc027dc4c 100644 --- a/src/screens/Messages/ChatList.tsx +++ b/src/screens/Messages/ChatList.tsx @@ -3,14 +3,21 @@ import {View} from 'react-native' import {useAnimatedRef} from 'react-native-reanimated' import {type ChatBskyActorGetStatus, type ChatBskyConvoDefs} from '@atproto/api' import {Trans, useLingui} from '@lingui/react/macro' -import {useFocusEffect, useIsFocused} from '@react-navigation/native' +import { + useFocusEffect, + useIsFocused, + useNavigation, +} from '@react-navigation/native' import {type NativeStackScreenProps} from '@react-navigation/native-stack' import {useAppState} from '#/lib/appState' import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender' import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' import {useRequireEmailVerification} from '#/lib/hooks/useRequireEmailVerification' -import {type MessagesTabNavigatorParams} from '#/lib/routes/types' +import { + type MessagesTabNavigatorParams, + type NavigationProp, +} from '#/lib/routes/types' import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' import {listenSoftReset} from '#/state/events' @@ -19,6 +26,7 @@ import {useMessagesEventBus} from '#/state/messages/events' import {useChatActorStatusQuery} from '#/state/queries/messages/get-status' import {useUnreadCountsQuery} from '#/state/queries/messages/get-unread-counts' import {useListConvosQuery} from '#/state/queries/messages/list-conversations' +import {useUpdateAllRead} from '#/state/queries/messages/update-all-read' import {EmptyState} from '#/view/com/util/EmptyState' import {List, type ListRef} from '#/view/com/util/List' import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' @@ -31,6 +39,7 @@ import {NewChat} from '#/components/dms/dialogs/NewChatDialog' import {useRefreshOnFocus} from '#/components/hooks/useRefreshOnFocus' import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as RetryIcon} from '#/components/icons/ArrowRotate' import {BubbleSmile_Stroke2_Corner2_Rounded_Large as BubbleSmileIcon} from '#/components/icons/Bubble' +import {CircleCheck_Stroke2_Corner0_Rounded as CircleCheckIcon} from '#/components/icons/CircleCheck' import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo' import {Inbox_Stroke2_Corner2_Rounded_Large as InboxLargeIcon} from '#/components/icons/Inbox' import { @@ -41,6 +50,8 @@ import {SettingsGear2_Stroke2_Corner0_Rounded as SettingsIcon} from '#/component import * as Layout from '#/components/Layout' import {Link} from '#/components/Link' import {ListFooter} from '#/components/Lists' +import * as Menu from '#/components/Menu' +import * as Toast from '#/components/Toast' import {Text} from '#/components/Typography' import {useAgeAssurance} from '#/ageAssurance' import {IS_NATIVE, IS_WEB} from '#/env' @@ -546,16 +557,19 @@ export function Header({ variant="solid" action={action} /> - - - + + {({props}) => ( + + )} + {!chatStatus?.chatDisabled && ( + )} + )} ) } + +function ChatSettingsMenu({ + action, + children, +}: { + action: 'navigate' | 'push' + children: React.ComponentProps['children'] +}) { + const {t: l} = useLingui() + const navigation = useNavigation() + + const {mutate: markAllChatsRead} = useUpdateAllRead('accepted', { + onMutate: () => { + Toast.show(l`Marked all chats as read`, {type: 'success'}) + }, + onError: () => { + Toast.show(l`Failed to mark all chats as read`, {type: 'error'}) + }, + }) + + return ( + + {children} + + + markAllChatsRead()}> + + + Mark all chats as read + + + { + if (action === 'navigate') { + navigation.navigate('MessagesSettings') + } else { + navigation.push('MessagesSettings') + } + }}> + + + Chat settings + + + + + + ) +}