From 567daca0185ee76f0a6509a798b93ede5260540f Mon Sep 17 00:00:00 2001 From: Hailey Date: Wed, 12 Jun 2024 11:27:22 -0700 Subject: [PATCH] make landing part of logged out state --- src/screens/StarterPack/Landing/index.tsx | 38 ++++++++++++++++------- src/screens/StarterPack/Main/index.tsx | 2 +- src/view/com/auth/LoggedOut.tsx | 19 +++++++----- 3 files changed, 40 insertions(+), 19 deletions(-) diff --git a/src/screens/StarterPack/Landing/index.tsx b/src/screens/StarterPack/Landing/index.tsx index 029e9ae79e..d02d33fcf8 100644 --- a/src/screens/StarterPack/Landing/index.tsx +++ b/src/screens/StarterPack/Landing/index.tsx @@ -5,20 +5,23 @@ import { AppBskyActorDefs, AppBskyGraphDefs, AppBskyGraphStarterpack, + AtUri, } from '@atproto/api' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import {useNavigation} from '@react-navigation/native' -import {NativeStackScreenProps} from '@react-navigation/native-stack' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {CommonNavigatorParams, NavigationProp} from 'lib/routes/types' -import {useSetUsedStarterPack} from 'state/preferences/starter-pack' +import {NavigationProp} from 'lib/routes/types' +import { + useSetUsedStarterPack, + useUsedStarterPack, +} from 'state/preferences/starter-pack' import {useResolveDidQuery} from 'state/queries/resolve-uri' import {useStarterPackQuery} from 'state/queries/useStarterPackQuery' import {useSession} from 'state/session' import {useSetMinimalShellMode} from 'state/shell' -import {useLoggedOutViewControls} from 'state/shell/logged-out' +import {LoggedOutScreenState} from 'view/com/auth/LoggedOut' import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' import {UserAvatar} from 'view/com/util/UserAvatar' import {CenteredView} from 'view/com/util/Views' @@ -30,9 +33,14 @@ import {ListMaybePlaceholder} from '#/components/Lists' import {Text} from '#/components/Typography' export function LandingScreen({ - route, -}: NativeStackScreenProps) { - const {name, rkey} = route.params + setScreenState, +}: { + setScreenState: (state: LoggedOutScreenState) => void +}) { + const usedStarterPack = useUsedStarterPack() + const atUri = new AtUri(usedStarterPack!.uri) + const {hostname: name, rkey} = atUri + const navigation = useNavigation() const {currentAccount} = useSession() const setMinimalShellMode = useSetMinimalShellMode() @@ -64,18 +72,24 @@ export function LandingScreen({ ) } - return + return ( + + ) } function LandingScreenInner({ starterPack, + setScreenState, }: { starterPack: AppBskyGraphDefs.StarterPackView + setScreenState: (state: LoggedOutScreenState) => void }) { const {record, creator, listItemsSample, feeds, joinedWeekCount} = starterPack const {_} = useLingui() const t = useTheme() - const {requestSwitchToAccount} = useLoggedOutViewControls() const setUsedStarterPack = useSetUsedStarterPack() const {isTabletOrDesktop} = useWebMediaQueries() @@ -139,7 +153,7 @@ function LandingScreenInner({ uri: starterPack.uri, cid: starterPack.cid, }) - requestSwitchToAccount({requestedAccount: 'new'}) + setScreenState(LoggedOutScreenState.S_CreateAccount) }} variant="solid" color="primary" @@ -220,9 +234,11 @@ function LandingScreenInner({ } function User({displayName, avatar}: {displayName: string; avatar?: string}) { + const {isTabletOrDesktop} = useWebMediaQueries() + return ( - + {displayName} diff --git a/src/screens/StarterPack/Main/index.tsx b/src/screens/StarterPack/Main/index.tsx index 14269f1ae3..f8f8a9c04d 100644 --- a/src/screens/StarterPack/Main/index.tsx +++ b/src/screens/StarterPack/Main/index.tsx @@ -32,7 +32,7 @@ import {Text} from '#/components/Typography' export function StarterPackScreen({ route, -}: NativeStackScreenProps) { +}: NativeStackScreenProps) { const {name, rkey} = route.params const { data: did, diff --git a/src/view/com/auth/LoggedOut.tsx b/src/view/com/auth/LoggedOut.tsx index 8821295cb0..9dbc28a62c 100644 --- a/src/view/com/auth/LoggedOut.tsx +++ b/src/view/com/auth/LoggedOut.tsx @@ -23,6 +23,7 @@ import {ErrorBoundary} from '#/view/com/util/ErrorBoundary' import {Text} from '#/view/com/util/text/Text' import {Login} from '#/screens/Login' import {Signup} from '#/screens/Signup' +import {LandingScreen} from '#/screens/StarterPack/Landing' import {SplashScreen} from './SplashScreen' enum ScreenState { @@ -31,6 +32,7 @@ enum ScreenState { S_CreateAccount, S_StarterPack, } +export {ScreenState as LoggedOutScreenState} export function LoggedOut({onDismiss}: {onDismiss?: () => void}) { const {hasSession} = useSession() @@ -41,19 +43,19 @@ export function LoggedOut({onDismiss}: {onDismiss?: () => void}) { const usedStarterPack = useUsedStarterPack() const {requestedAccountSwitchTo} = useLoggedOutView() const [screenState, setScreenState] = React.useState( - usedStarterPack?.uri - ? ScreenState.S_StarterPack - : requestedAccountSwitchTo + requestedAccountSwitchTo ? requestedAccountSwitchTo === 'new' ? ScreenState.S_CreateAccount : ScreenState.S_Login + : usedStarterPack?.uri + ? ScreenState.S_StarterPack : ScreenState.S_LoginOrCreateAccount, ) const {isMobile} = useWebMediaQueries() const {clearRequestedAccount} = useLoggedOutViewControls() const navigation = useNavigation() - const isFirstScreen = screenState === ScreenState.S_LoginOrCreateAccount + const isFirstScreen = screenState === ScreenState.S_LoginOrCreateAccount React.useEffect(() => { screen('Login') setMinimalShellMode(true) @@ -78,11 +80,14 @@ export function LoggedOut({onDismiss}: {onDismiss?: () => void}) { pal.view, { // only needed if dismiss button is present - paddingTop: onDismiss && isMobile ? 40 : 0, + paddingTop: + onDismiss && isMobile && screenState !== ScreenState.S_StarterPack + ? 40 + : 0, }, ]}> - {onDismiss ? ( + {onDismiss && screenState !== ScreenState.S_StarterPack ? ( void}) { ) : null} {screenState === ScreenState.S_StarterPack ? ( - + ) : screenState === ScreenState.S_LoginOrCreateAccount ? ( {