diff options
| -rw-r--r-- | src/view/com/modals/ProfilePreview.tsx | 12 | ||||
| -rw-r--r-- | src/view/com/profile/ProfileHeader.tsx | 20 | ||||
| -rw-r--r-- | src/view/screens/Profile.tsx | 16 |
3 files changed, 26 insertions, 22 deletions
diff --git a/src/view/com/modals/ProfilePreview.tsx b/src/view/com/modals/ProfilePreview.tsx index 964d2e978..8a505397a 100644 --- a/src/view/com/modals/ProfilePreview.tsx +++ b/src/view/com/modals/ProfilePreview.tsx @@ -11,12 +11,14 @@ import {s} from 'lib/styles' import {useModerationOpts} from '#/state/queries/preferences' import {useProfileQuery} from '#/state/queries/profile' import {ErrorScreen} from '../util/error/ErrorScreen' +import {CenteredView} from '../util/Views' import {cleanError} from '#/lib/strings/errors' import {useProfileShadow} from '#/state/cache/profile-shadow' export const snapPoints = [520, '100%'] export function Component({did}: {did: string}) { + const pal = usePalette('default') const moderationOpts = useModerationOpts() const { data: profile, @@ -30,9 +32,13 @@ export function Component({did}: {did: string}) { if (isFetchingProfile || !moderationOpts) { return ( - <View style={s.p20}> - <ActivityIndicator size="large" /> - </View> + <CenteredView style={[pal.view, s.flex1]}> + <ProfileHeader + profile={null} + moderation={null} + isProfilePreview={true} + /> + </CenteredView> ) } if (profileError) { diff --git a/src/view/com/profile/ProfileHeader.tsx b/src/view/com/profile/ProfileHeader.tsx index 60311a0b2..a7e793ccb 100644 --- a/src/view/com/profile/ProfileHeader.tsx +++ b/src/view/com/profile/ProfileHeader.tsx @@ -53,8 +53,8 @@ import {useSession} from '#/state/session' import {Shadow} from '#/state/cache/types' interface Props { - profile: Shadow<AppBskyActorDefs.ProfileViewDetailed> - moderation: ProfileModeration + profile: Shadow<AppBskyActorDefs.ProfileViewDetailed> | null + moderation: ProfileModeration | null hideBackButton?: boolean isProfilePreview?: boolean } @@ -69,7 +69,7 @@ export function ProfileHeader({ // loading // = - if (!profile) { + if (!profile || !moderation) { return ( <View style={pal.view}> <LoadingPlaceholder width="100%" height={153} /> @@ -81,11 +81,6 @@ export function ProfileHeader({ <View style={[styles.buttonsLine]}> <LoadingPlaceholder width={167} height={31} style={styles.br50} /> </View> - <View> - <Text type="title-2xl" style={[pal.text, styles.title]}> - <Trans>Loading...</Trans> - </Text> - </View> </View> </View> ) @@ -103,12 +98,19 @@ export function ProfileHeader({ ) } +interface LoadedProps { + profile: Shadow<AppBskyActorDefs.ProfileViewDetailed> + moderation: ProfileModeration + hideBackButton?: boolean + isProfilePreview?: boolean +} + function ProfileHeaderLoaded({ profile, moderation, hideBackButton = false, isProfilePreview, -}: Props) { +}: LoadedProps) { const pal = usePalette('default') const palInverted = usePalette('inverted') const {currentAccount} = useSession() diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx index fdabc690e..ce59b7260 100644 --- a/src/view/screens/Profile.tsx +++ b/src/view/screens/Profile.tsx @@ -1,5 +1,5 @@ import React, {useMemo} from 'react' -import {ActivityIndicator, StyleSheet, View} from 'react-native' +import {StyleSheet, View} from 'react-native' import {useFocusEffect} from '@react-navigation/native' import {AppBskyActorDefs, moderateProfile, ModerationOpts} from '@atproto/api' import {msg} from '@lingui/macro' @@ -73,9 +73,11 @@ export const ProfileScreen = withAuthRequired(function ProfileScreenImpl({ if (isFetchingDid || isFetchingProfile || !moderationOpts) { return ( <CenteredView> - <View style={s.p20}> - <ActivityIndicator size="large" /> - </View> + <ProfileHeader + profile={null} + moderation={null} + isProfilePreview={true} + /> </CenteredView> ) } @@ -158,12 +160,6 @@ function ProfileScreenLoaded({ ].filter(Boolean) as string[] }, [showLikesTab, showFeedsTab, showListsTab]) - /* - - todo - - feeds - - lists - */ - useFocusEffect( React.useCallback(() => { setMinimalShellMode(false) |