Followings.tsx raw
1 import { useFetchFollowings } from '@/hooks'
2 import { toFollowingList } from '@/lib/link'
3 import { SecondaryPageLink } from '@/PageManager'
4 import { useFollowList } from '@/providers/FollowListProvider'
5 import { useNostr } from '@/providers/NostrProvider'
6 import { Loader } from 'lucide-react'
7 import { useTranslation } from 'react-i18next'
8
9 export default function Followings({ pubkey }: { pubkey: string }) {
10 const { t } = useTranslation()
11 const { pubkey: accountPubkey } = useNostr()
12 const { followingSet: selfFollowingSet } = useFollowList()
13 const { followings, isFetching } = useFetchFollowings(pubkey)
14
15 return (
16 <SecondaryPageLink
17 to={toFollowingList(pubkey)}
18 className="flex gap-1 hover:underline w-fit items-center"
19 >
20 {accountPubkey === pubkey ? (
21 selfFollowingSet.size
22 ) : isFetching ? (
23 <Loader className="animate-spin size-4" />
24 ) : (
25 followings.length
26 )}
27 <div className="text-muted-foreground">{t('Following')}</div>
28 </SecondaryPageLink>
29 )
30 }
31