55 lines
1.8 KiB
TypeScript
55 lines
1.8 KiB
TypeScript
import React from 'react'
|
|
import {Plural} from '@lingui/macro'
|
|
import {useFocusEffect} from '@react-navigation/native'
|
|
|
|
import {CommonNavigatorParams, NativeStackScreenProps} from '#/lib/routes/types'
|
|
import {sanitizeDisplayName} from '#/lib/strings/display-names'
|
|
import {useProfileQuery} from '#/state/queries/profile'
|
|
import {useResolveDidQuery} from '#/state/queries/resolve-uri'
|
|
import {useSetMinimalShellMode} from '#/state/shell'
|
|
import {ProfileFollows as ProfileFollowsComponent} from '#/view/com/profile/ProfileFollows'
|
|
import * as Layout from '#/components/Layout'
|
|
|
|
type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileFollows'>
|
|
export const ProfileFollowsScreen = ({route}: Props) => {
|
|
const {name} = route.params
|
|
const setMinimalShellMode = useSetMinimalShellMode()
|
|
|
|
const {data: resolvedDid} = useResolveDidQuery(name)
|
|
const {data: profile} = useProfileQuery({
|
|
did: resolvedDid,
|
|
})
|
|
|
|
useFocusEffect(
|
|
React.useCallback(() => {
|
|
setMinimalShellMode(false)
|
|
}, [setMinimalShellMode]),
|
|
)
|
|
|
|
return (
|
|
<Layout.Screen testID="profileFollowsScreen">
|
|
<Layout.Header.Outer>
|
|
<Layout.Header.BackButton />
|
|
<Layout.Header.Content>
|
|
{profile && (
|
|
<>
|
|
<Layout.Header.TitleText>
|
|
{sanitizeDisplayName(profile.displayName || profile.handle)}
|
|
</Layout.Header.TitleText>
|
|
<Layout.Header.SubtitleText>
|
|
<Plural
|
|
value={profile.followsCount ?? 0}
|
|
one="# following"
|
|
other="# following"
|
|
/>
|
|
</Layout.Header.SubtitleText>
|
|
</>
|
|
)}
|
|
</Layout.Header.Content>
|
|
<Layout.Header.Slot />
|
|
</Layout.Header.Outer>
|
|
<ProfileFollowsComponent name={name} />
|
|
</Layout.Screen>
|
|
)
|
|
}
|