From fa662dec9c8cb97c12a1095cb7e1b58c8a85a580 Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Wed, 25 Jun 2025 22:04:36 -0500 Subject: [PATCH] Add some component utils, no design, gate chat --- .../ageAssurance/AgeRestrictedScreen.tsx | 36 +++++++++++++++++++ .../ageAssurance/IsAgeRestricted.tsx | 16 +++++++++ src/screens/Messages/ChatList.tsx | 12 ++++++- src/screens/Messages/Conversation.tsx | 12 ++++++- src/screens/Messages/Inbox.tsx | 28 +++++++++++---- src/screens/Messages/Settings.tsx | 12 ++++++- 6 files changed, 107 insertions(+), 9 deletions(-) create mode 100644 src/components/ageAssurance/AgeRestrictedScreen.tsx create mode 100644 src/components/ageAssurance/IsAgeRestricted.tsx diff --git a/src/components/ageAssurance/AgeRestrictedScreen.tsx b/src/components/ageAssurance/AgeRestrictedScreen.tsx new file mode 100644 index 0000000000..1e35c19064 --- /dev/null +++ b/src/components/ageAssurance/AgeRestrictedScreen.tsx @@ -0,0 +1,36 @@ +import {View} from 'react-native' +import {Trans} from '@lingui/macro' + +import {atoms as a} from '#/alf' +import {IsAgeRestricted} from '#/components/ageAssurance/IsAgeRestricted' +import * as Layout from '#/components/Layout' +import {Text} from '#/components/Typography' + +export function AgeRestrictedScreen({children}: {children: React.ReactNode}) { + return ( + <> + + + + + + + Not allowed + + + + + + + + We're sorry, but this content is unavailable. + + + + + + + {children} + + ) +} diff --git a/src/components/ageAssurance/IsAgeRestricted.tsx b/src/components/ageAssurance/IsAgeRestricted.tsx new file mode 100644 index 0000000000..90e0340127 --- /dev/null +++ b/src/components/ageAssurance/IsAgeRestricted.tsx @@ -0,0 +1,16 @@ +import {useAgeAssuranceContext} from '#/state/ageAssurance' + +export function True({children}: {children: React.ReactNode}) { + const {isAgeRestricted} = useAgeAssuranceContext() + return isAgeRestricted ? children : null +} + +export function False({children}: {children: React.ReactNode}) { + const {isAgeRestricted} = useAgeAssuranceContext() + return !isAgeRestricted ? children : null +} + +export const IsAgeRestricted = { + True, + False, +} diff --git a/src/screens/Messages/ChatList.tsx b/src/screens/Messages/ChatList.tsx index 388d23ec24..093ba7aeed 100644 --- a/src/screens/Messages/ChatList.tsx +++ b/src/screens/Messages/ChatList.tsx @@ -23,6 +23,7 @@ import {useSession} from '#/state/session' import {List, type ListRef} from '#/view/com/util/List' import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' import {atoms as a, useBreakpoints, useTheme} from '#/alf' +import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen' import {Button, ButtonIcon, ButtonText} from '#/components/Button' import {type DialogControlProps, useDialogControl} from '#/components/Dialog' import {NewChat} from '#/components/dms/dialogs/NewChatDialog' @@ -64,7 +65,16 @@ function keyExtractor(item: ListItem) { } type Props = NativeStackScreenProps -export function MessagesScreen({navigation, route}: Props) { + +export function MessagesScreen(props: Props) { + return ( + + + + ) +} + +export function MessagesScreenInner({navigation, route}: Props) { const {_} = useLingui() const t = useTheme() const {currentAccount} = useSession() diff --git a/src/screens/Messages/Conversation.tsx b/src/screens/Messages/Conversation.tsx index 90547a8d4d..032080599e 100644 --- a/src/screens/Messages/Conversation.tsx +++ b/src/screens/Messages/Conversation.tsx @@ -32,6 +32,7 @@ import {useProfileQuery} from '#/state/queries/profile' import {useSetMinimalShellMode} from '#/state/shell' import {MessagesList} from '#/screens/Messages/components/MessagesList' import {atoms as a, useBreakpoints, useTheme, web} from '#/alf' +import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen' import { EmailDialogScreenID, useEmailDialogControl, @@ -46,7 +47,16 @@ type Props = NativeStackScreenProps< CommonNavigatorParams, 'MessagesConversation' > -export function MessagesConversationScreen({route}: Props) { + +export function MessagesConversationScreen(props: Props) { + return ( + + + + ) +} + +export function MessagesConversationScreenInner({route}: Props) { const {gtMobile} = useBreakpoints() const setMinimalShellMode = useSetMinimalShellMode() diff --git a/src/screens/Messages/Inbox.tsx b/src/screens/Messages/Inbox.tsx index 0f64d20140..d7ddfad0a6 100644 --- a/src/screens/Messages/Inbox.tsx +++ b/src/screens/Messages/Inbox.tsx @@ -1,17 +1,23 @@ import {useCallback, useMemo, useState} from 'react' import {View} from 'react-native' -import {ChatBskyConvoDefs, ChatBskyConvoListConvos} from '@atproto/api' +import { + type ChatBskyConvoDefs, + type ChatBskyConvoListConvos, +} from '@atproto/api' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import {useFocusEffect, useNavigation} from '@react-navigation/native' -import {InfiniteData, UseInfiniteQueryResult} from '@tanstack/react-query' +import { + type InfiniteData, + type UseInfiniteQueryResult, +} from '@tanstack/react-query' import {useAppState} from '#/lib/hooks/useAppState' import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender' import { - CommonNavigatorParams, - NativeStackScreenProps, - NavigationProp, + type CommonNavigatorParams, + type NativeStackScreenProps, + type NavigationProp, } from '#/lib/routes/types' import {cleanError} from '#/lib/strings/errors' import {logger} from '#/logger' @@ -26,6 +32,7 @@ import {List} from '#/view/com/util/List' import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' import * as Toast from '#/view/com/util/Toast' import {atoms as a, useBreakpoints, useTheme} from '#/alf' +import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen' import {Button, ButtonIcon, ButtonText} from '#/components/Button' import {useRefreshOnFocus} from '#/components/hooks/useRefreshOnFocus' import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeftIcon} from '#/components/icons/Arrow' @@ -39,7 +46,16 @@ import {Text} from '#/components/Typography' import {RequestListItem} from './components/RequestListItem' type Props = NativeStackScreenProps -export function MessagesInboxScreen({}: Props) { + +export function MessagesInboxScreen(props: Props) { + return ( + + + + ) +} + +export function MessagesInboxScreenInner({}: Props) { const {gtTablet} = useBreakpoints() const listConvosQuery = useListConvosQuery({status: 'request'}) diff --git a/src/screens/Messages/Settings.tsx b/src/screens/Messages/Settings.tsx index 0b8c88b9dd..539201d4be 100644 --- a/src/screens/Messages/Settings.tsx +++ b/src/screens/Messages/Settings.tsx @@ -12,6 +12,7 @@ import {useSession} from '#/state/session' import * as Toast from '#/view/com/util/Toast' import {atoms as a} from '#/alf' import {Admonition} from '#/components/Admonition' +import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen' import {Divider} from '#/components/Divider' import * as Toggle from '#/components/forms/Toggle' import * as Layout from '#/components/Layout' @@ -21,7 +22,16 @@ import {useBackgroundNotificationPreferences} from '../../../modules/expo-backgr type AllowIncoming = 'all' | 'none' | 'following' type Props = NativeStackScreenProps -export function MessagesSettingsScreen({}: Props) { + +export function MessagesSettingsScreen(props: Props) { + return ( + + + + ) +} + +export function MessagesSettingsScreenInner({}: Props) { const {_} = useLingui() const {currentAccount} = useSession() const {data: profile} = useProfileQuery({