Change empty states if not own profile (#9518)

* change empty states if not own profile

* Update ProfileFeedgens.tsx

* capitalise starter packs

(cherry picked from commit f02b9c323f)
This commit is contained in:
Samuel Newman
2025-12-17 22:10:39 +02:00
committed by Eric Bailey
parent 60c9148e77
commit d7f551cfe4
3 changed files with 109 additions and 51 deletions
+24 -4
View File
@@ -23,6 +23,7 @@ import {logger} from '#/logger'
import {isIOS, isNative, isWeb} from '#/platform/detection' import {isIOS, isNative, isWeb} from '#/platform/detection'
import {usePreferencesQuery} from '#/state/queries/preferences' import {usePreferencesQuery} from '#/state/queries/preferences'
import {RQKEY, useProfileFeedgensQuery} from '#/state/queries/profile-feedgens' import {RQKEY, useProfileFeedgensQuery} from '#/state/queries/profile-feedgens'
import {useSession} from '#/state/session'
import {EmptyState} from '#/view/com/util/EmptyState' import {EmptyState} from '#/view/com/util/EmptyState'
import {ErrorMessage} from '#/view/com/util/error/ErrorMessage' import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
import {List, type ListRef} from '#/view/com/util/List' import {List, type ListRef} from '#/view/com/util/List'
@@ -81,6 +82,8 @@ export function ProfileFeedgens({
const isEmpty = !isPending && !data?.pages[0]?.feeds.length const isEmpty = !isPending && !data?.pages[0]?.feeds.length
const {data: preferences} = usePreferencesQuery() const {data: preferences} = usePreferencesQuery()
const navigation = useNavigation() const navigation = useNavigation()
const {currentAccount} = useSession()
const isSelf = currentAccount?.did === did
const items = useMemo(() => { const items = useMemo(() => {
let items: any[] = [] let items: any[] = []
@@ -152,15 +155,23 @@ export function ProfileFeedgens({
<EmptyState <EmptyState
style={{width: '100%'}} style={{width: '100%'}}
icon={HashtagWideIcon} icon={HashtagWideIcon}
message={_(msg`You haven't made any custom feeds yet.`)} message={
isSelf
? _(msg`You haven't made any custom feeds yet.`)
: _(msg`No custom feeds yet`)
}
textStyle={[t.atoms.text_contrast_medium, a.font_medium]} textStyle={[t.atoms.text_contrast_medium, a.font_medium]}
button={{ button={
isSelf
? {
label: _(msg`Browse custom feeds`), label: _(msg`Browse custom feeds`),
text: _(msg`Browse custom feeds`), text: _(msg`Browse custom feeds`),
onPress: () => navigation.navigate('Feeds' as never), onPress: () => navigation.navigate('Feeds' as never),
size: 'small', size: 'small',
color: 'secondary', color: 'secondary',
}} }
: undefined
}
/> />
) )
} else if (item === ERROR_ITEM) { } else if (item === ERROR_ITEM) {
@@ -194,7 +205,16 @@ export function ProfileFeedgens({
} }
return null return null
}, },
[_, t, error, refetch, onPressRetryLoadMore, preferences, navigation], [
_,
t,
error,
refetch,
onPressRetryLoadMore,
preferences,
navigation,
isSelf,
],
) )
useEffect(() => { useEffect(() => {
+24 -6
View File
@@ -23,6 +23,7 @@ import {logger} from '#/logger'
import {isIOS, isNative, isWeb} from '#/platform/detection' import {isIOS, isNative, isWeb} from '#/platform/detection'
import {usePreferencesQuery} from '#/state/queries/preferences' import {usePreferencesQuery} from '#/state/queries/preferences'
import {RQKEY, useProfileListsQuery} from '#/state/queries/profile-lists' import {RQKEY, useProfileListsQuery} from '#/state/queries/profile-lists'
import {useSession} from '#/state/session'
import {EmptyState} from '#/view/com/util/EmptyState' import {EmptyState} from '#/view/com/util/EmptyState'
import {ErrorMessage} from '#/view/com/util/error/ErrorMessage' import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
import {List, type ListRef} from '#/view/com/util/List' import {List, type ListRef} from '#/view/com/util/List'
@@ -81,6 +82,8 @@ export function ProfileLists({
const isEmpty = !isPending && !data?.pages[0]?.lists.length const isEmpty = !isPending && !data?.pages[0]?.lists.length
const {data: preferences} = usePreferencesQuery() const {data: preferences} = usePreferencesQuery()
const navigation = useNavigation() const navigation = useNavigation()
const {currentAccount} = useSession()
const isSelf = currentAccount?.did === did
const items = useMemo(() => { const items = useMemo(() => {
let items: any[] = [] let items: any[] = []
@@ -151,17 +154,23 @@ export function ProfileLists({
return ( return (
<EmptyState <EmptyState
icon={ListIcon} icon={ListIcon}
message={_( message={
msg`Lists allow you to see content from your favorite people.`, isSelf
)} ? _(msg`You haven't created any lists yet.`)
: _(msg`No lists`)
}
textStyle={[t.atoms.text_contrast_medium, a.font_medium]} textStyle={[t.atoms.text_contrast_medium, a.font_medium]}
button={{ button={
isSelf
? {
label: _(msg`Create a list`), label: _(msg`Create a list`),
text: _(msg`Create a list`), text: _(msg`Create a list`),
onPress: () => navigation.navigate('Lists' as never), onPress: () => navigation.navigate('Lists' as never),
size: 'small', size: 'small',
color: 'primary', color: 'primary',
}} }
: undefined
}
/> />
) )
} else if (item === ERROR_ITEM) { } else if (item === ERROR_ITEM) {
@@ -195,7 +204,16 @@ export function ProfileLists({
} }
return null return null
}, },
[_, t, error, refetch, onPressRetryLoadMore, preferences, navigation], [
_,
t,
error,
refetch,
onPressRetryLoadMore,
preferences,
navigation,
isSelf,
],
) )
useEffect(() => { useEffect(() => {
+31 -11
View File
@@ -429,13 +429,17 @@ function ProfileScreenLoaded({
ignoreFilterFor={profile.did} ignoreFilterFor={profile.did}
setScrollViewTag={setScrollViewTag} setScrollViewTag={setScrollViewTag}
emptyStateMessage={_(msg`No posts yet`)} emptyStateMessage={_(msg`No posts yet`)}
emptyStateButton={{ emptyStateButton={
isMe
? {
label: _(msg`Write a post`), label: _(msg`Write a post`),
text: _(msg`Write a post`), text: _(msg`Write a post`),
onPress: () => openComposer({}), onPress: () => openComposer({}),
size: 'small', size: 'small',
color: 'primary', color: 'primary',
}} }
: undefined
}
/> />
) )
: null} : null}
@@ -465,13 +469,17 @@ function ProfileScreenLoaded({
ignoreFilterFor={profile.did} ignoreFilterFor={profile.did}
setScrollViewTag={setScrollViewTag} setScrollViewTag={setScrollViewTag}
emptyStateMessage={_(msg`No media yet`)} emptyStateMessage={_(msg`No media yet`)}
emptyStateButton={{ emptyStateButton={
isMe
? {
label: _(msg`Post a photo`), label: _(msg`Post a photo`),
text: _(msg`Post a photo`), text: _(msg`Post a photo`),
onPress: () => openComposer({}), onPress: () => openComposer({}),
size: 'small', size: 'small',
color: 'primary', color: 'primary',
}} }
: undefined
}
emptyStateIcon={ImageIcon} emptyStateIcon={ImageIcon}
/> />
) )
@@ -487,13 +495,17 @@ function ProfileScreenLoaded({
ignoreFilterFor={profile.did} ignoreFilterFor={profile.did}
setScrollViewTag={setScrollViewTag} setScrollViewTag={setScrollViewTag}
emptyStateMessage={_(msg`No video posts yet`)} emptyStateMessage={_(msg`No video posts yet`)}
emptyStateButton={{ emptyStateButton={
isMe
? {
label: _(msg`Post a video`), label: _(msg`Post a video`),
text: _(msg`Post a video`), text: _(msg`Post a video`),
onPress: () => openComposer({}), onPress: () => openComposer({}),
size: 'small', size: 'small',
color: 'primary', color: 'primary',
}} }
: undefined
}
emptyStateIcon={VideoIcon} emptyStateIcon={VideoIcon}
/> />
) )
@@ -535,16 +547,24 @@ function ProfileScreenLoaded({
headerOffset={headerHeight} headerOffset={headerHeight}
enabled={isFocused} enabled={isFocused}
setScrollViewTag={setScrollViewTag} setScrollViewTag={setScrollViewTag}
emptyStateMessage={_( emptyStateMessage={
msg`Starter packs let you share your favorite feeds and people with your friends.`, isMe
)} ? _(
emptyStateButton={{ msg`Starter Packs let you share your favorite feeds and people with your friends.`,
)
: _(msg`No Starter Packs yet`)
}
emptyStateButton={
isMe
? {
label: _(msg`Create a Starter Pack`), label: _(msg`Create a Starter Pack`),
text: _(msg`Create a Starter Pack`), text: _(msg`Create a Starter Pack`),
onPress: wrappedNavToWizard, onPress: wrappedNavToWizard,
color: 'primary', color: 'primary',
size: 'small', size: 'small',
}} }
: undefined
}
emptyStateIcon={CircleAndSquareIcon} emptyStateIcon={CircleAndSquareIcon}
/> />
) )