Better handling of blocks in `KnownFollowers` (#4563)

* Better handle nested conditionals, use renderable items to determine UI

* Better translate

* Fix translation and fix missing case in the process

* Clarify naming

* Add safeguard

* Remove unneeded msg

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
zio/stable
Eric Bailey 2024-06-18 17:33:17 -05:00 committed by GitHub
parent 32b4063185
commit c92ef2fe31
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 49 additions and 18 deletions

View File

@ -100,7 +100,15 @@ function KnownFollowersInner({
moderation, moderation,
} }
}) })
const count = cachedKnownFollowers.count
// Does not have blocks applied. Always >= slices.length
const serverCount = cachedKnownFollowers.count
/*
* We check above too, but here for clarity and a reminder to _check for
* valid indices_
*/
if (slice.length === 0) return null
return ( return (
<Link <Link
@ -164,31 +172,54 @@ function KnownFollowersInner({
}, },
]} ]}
numberOfLines={2}> numberOfLines={2}>
{count > 2 ? ( {slice.length >= 2 ? (
<Trans> // 2-n followers, including blocks
Followed by{' '} serverCount > 2 ? (
<Text key={slice[0].profile.did} style={textStyle}> <Trans>
{slice[0].profile.displayName} Followed by{' '}
</Text> <Text key={slice[0].profile.did} style={textStyle}>
,{' '} {slice[0].profile.displayName}
<Text key={slice[1].profile.did} style={textStyle}> </Text>
{slice[1].profile.displayName} ,{' '}
</Text> <Text key={slice[1].profile.did} style={textStyle}>
, and{' '} {slice[1].profile.displayName}
<Plural value={count - 2} one="# other" other="# others" /> </Text>
</Trans> , and{' '}
) : count === 2 ? ( <Plural
value={serverCount - 2}
one="# other"
other="# others"
/>
</Trans>
) : (
// only 2
<Trans>
Followed by{' '}
<Text key={slice[0].profile.did} style={textStyle}>
{slice[0].profile.displayName}
</Text>{' '}
and{' '}
<Text key={slice[1].profile.did} style={textStyle}>
{slice[1].profile.displayName}
</Text>
</Trans>
)
) : serverCount > 1 ? (
// 1-n followers, including blocks
<Trans> <Trans>
Followed by{' '} Followed by{' '}
<Text key={slice[0].profile.did} style={textStyle}> <Text key={slice[0].profile.did} style={textStyle}>
{slice[0].profile.displayName} {slice[0].profile.displayName}
</Text>{' '} </Text>{' '}
and{' '} and{' '}
<Text key={slice[1].profile.did} style={textStyle}> <Plural
{slice[1].profile.displayName} value={serverCount - 1}
</Text> one="# other"
other="# others"
/>
</Trans> </Trans>
) : ( ) : (
// only 1
<Trans> <Trans>
Followed by{' '} Followed by{' '}
<Text key={slice[0].profile.did} style={textStyle}> <Text key={slice[0].profile.did} style={textStyle}>