diff --git a/src/view/shell/Drawer.tsx b/src/view/shell/Drawer.tsx index 2a070bf873..da98b2643b 100644 --- a/src/view/shell/Drawer.tsx +++ b/src/view/shell/Drawer.tsx @@ -1,7 +1,7 @@ import React, {ComponentProps} from 'react' import {Linking, ScrollView, TouchableOpacity, View} from 'react-native' import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {msg, Plural, Trans} from '@lingui/macro' +import {msg, Plural, plural, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import {StackActions, useNavigation} from '@react-navigation/native' @@ -450,7 +450,12 @@ let NotificationsMenuItem = ({ accessibilityHint={ numUnreadNotifications === '' ? '' - : _(msg`${numUnreadNotifications} unread`) + : _( + msg`${plural(numUnreadNotifications ?? 0, { + one: '# unread item', + other: '# unread items', + })}` || '', + ) } count={numUnreadNotifications} bold={isActive} diff --git a/src/view/shell/bottom-bar/BottomBar.tsx b/src/view/shell/bottom-bar/BottomBar.tsx index 4f3e790def..7b760b069f 100644 --- a/src/view/shell/bottom-bar/BottomBar.tsx +++ b/src/view/shell/bottom-bar/BottomBar.tsx @@ -2,7 +2,7 @@ import React, {ComponentProps} from 'react' import {GestureResponderEvent, View} from 'react-native' import Animated from 'react-native-reanimated' import {useSafeAreaInsets} from 'react-native-safe-area-context' -import {msg, Trans} from '@lingui/macro' +import {msg, plural, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import {BottomTabBarProps} from '@react-navigation/bottom-tabs' import {StackActions} from '@react-navigation/native' @@ -204,7 +204,12 @@ export function BottomBar({navigation}: BottomTabBarProps) { accessibilityLabel={_(msg`Chat`)} accessibilityHint={ numUnreadMessages.count > 0 - ? _(msg`${numUnreadMessages.numUnread} unread items`) + ? _( + msg`${plural(numUnreadMessages.numUnread ?? 0, { + one: '# unread item', + other: '# unread items', + })}` || '', + ) : '' } /> @@ -231,7 +236,12 @@ export function BottomBar({navigation}: BottomTabBarProps) { accessibilityHint={ numUnreadNotifications === '' ? '' - : _(msg`${numUnreadNotifications} unread items`) + : _( + msg`${plural(numUnreadNotifications ?? 0, { + one: '# unread item', + other: '# unread items', + })}` || '', + ) } /> + aria-label={_( + msg`${plural(notificationCount, { + one: '# unread item', + other: '# unread items', + })}`, + )}> {notificationCount} ) : hasNew ? ( diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx index 522b51dba5..a1730af666 100644 --- a/src/view/shell/desktop/LeftNav.tsx +++ b/src/view/shell/desktop/LeftNav.tsx @@ -2,7 +2,7 @@ import React from 'react' import {StyleSheet, View} from 'react-native' import {AppBskyActorDefs} from '@atproto/api' import {FontAwesomeIconStyle} from '@fortawesome/react-native-fontawesome' -import {msg, Trans} from '@lingui/macro' +import {msg, plural, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import { useLinkProps, @@ -384,7 +384,12 @@ function NavItem({count, hasNew, href, icon, iconFilled, label}: NavItemProps) { {right: -20}, // more breathing room ]}>