zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

Update follower/following a11y hints and labels (#755) 

* Update follower/following a11y hints and labels

* Update ProfileHeader.tsx

---------

Co-authored-by: Ansh <anshnanda10@gmail.com>
zio/stable
Ollie H 2023-05-30 13:39:50 -07:00 committed by GitHub
parent 09c515d273
commit 234e04c396
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/view/com/profile/ProfileHeader.tsx
View File

@ -289,6 +289,9 @@ const ProfileHeaderLoaded = observer(
])
const blockHide = !isMe && (view.viewer.blocking || view.viewer.blockedBy)
const following = formatCount(view.followsCount)
const followers = formatCount(view.followersCount)
const pluralizedFollowers = pluralize(view.followersCount, 'follower')
return (
<View style={pal.view}>
@ -394,13 +397,13 @@ const ProfileHeaderLoaded = observer(
style={[s.flexRow, s.mr10]}
onPress={onPressFollowers}
accessibilityRole="button"
accessibilityLabel={`Show ${view.handle}'s followers`}
accessibilityHint={`Shows folks following ${view.handle}`}>
accessibilityLabel={`${followers} ${pluralizedFollowers}`}
accessibilityHint={'Opens followers list'}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{formatCount(view.followersCount)}
{followers}
</Text>
<Text type="md" style={[pal.textLight]}>
{pluralize(view.followersCount, 'follower')}
{pluralizedFollowers}
</Text>
</TouchableOpacity>
<TouchableOpacity
@ -408,10 +411,10 @@ const ProfileHeaderLoaded = observer(
style={[s.flexRow, s.mr10]}
onPress={onPressFollows}
accessibilityRole="button"
accessibilityLabel={`Show ${view.handle}'s follows`}
accessibilityHint={`Shows folks followed by ${view.handle}`}>
accessibilityLabel={`${following} following`}
accessibilityHint={'Opens following list'}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{formatCount(view.followsCount)}
{following}
</Text>
<Text type="md" style={[pal.textLight]}>
following