diff --git a/src/Navigation.tsx b/src/Navigation.tsx index db7d3d707..33aa2e2b9 100644 --- a/src/Navigation.tsx +++ b/src/Navigation.tsx @@ -28,6 +28,7 @@ import { notificationToURL, storePayloadForAccountSwitch, } from '#/lib/hooks/useNotificationHandler' +import {useTitleUnreadCountLabel} from '#/lib/hooks/useTitleUnreadCountLabel' import {useWebScrollRestoration} from '#/lib/hooks/useWebScrollRestoration' import {useCallOnce} from '#/lib/once' import {buildStateObject, getCurrentRoute} from '#/lib/routes/helpers' @@ -46,7 +47,6 @@ import { import {bskyTitle} from '#/lib/strings/headings' import {CHAT_INVITE_CODE_REGEX} from '#/lib/strings/url-helpers' import {useDisableVerifyEmailReminder} from '#/state/preferences/disable-verify-email-reminder' -import {useUnreadNotifications} from '#/state/queries/notifications/unread' import {useSession} from '#/state/session' import {useLoggedOutViewControls} from '#/state/shell/logged-out' import { @@ -879,9 +879,10 @@ const FlatNavigator = ({ layout: React.ComponentProps['layout'] }) => { const t = useTheme() - const numUnread = useUnreadNotifications() + const unreadCountLabel = useTitleUnreadCountLabel() const screenListeners = useWebScrollRestoration() - const title = (page: MessageDescriptor) => bskyTitle(i18n._(page), numUnread) + const title = (page: MessageDescriptor) => + bskyTitle(i18n._(page), unreadCountLabel) return ( HomeScreen} options={{title: title(msg`Home`)}} /> - {commonScreens(Flat, numUnread)} + {commonScreens(Flat, unreadCountLabel)} ) } diff --git a/src/lib/hooks/useSetTitle.ts b/src/lib/hooks/useSetTitle.ts index 04f9dcc2c..ca207fec7 100644 --- a/src/lib/hooks/useSetTitle.ts +++ b/src/lib/hooks/useSetTitle.ts @@ -1,16 +1,16 @@ import {useEffect} from 'react' import {useNavigation} from '@react-navigation/native' +import {useTitleUnreadCountLabel} from '#/lib/hooks/useTitleUnreadCountLabel' import {type NavigationProp} from '#/lib/routes/types' import {bskyTitle} from '#/lib/strings/headings' -import {useUnreadNotifications} from '#/state/queries/notifications/unread' export function useSetTitle(title?: string) { const navigation = useNavigation() - const numUnread = useUnreadNotifications() + const unreadCountLabel = useTitleUnreadCountLabel() useEffect(() => { if (title) { - navigation.setOptions({title: bskyTitle(title, numUnread)}) + navigation.setOptions({title: bskyTitle(title, unreadCountLabel)}) } - }, [title, navigation, numUnread]) + }, [title, navigation, unreadCountLabel]) } diff --git a/src/lib/hooks/useTitleUnreadCountLabel.ts b/src/lib/hooks/useTitleUnreadCountLabel.ts new file mode 100644 index 000000000..5cd99f551 --- /dev/null +++ b/src/lib/hooks/useTitleUnreadCountLabel.ts @@ -0,0 +1,12 @@ +import {formatTitleUnreadCountLabel} from '#/lib/metrics-display' +import {useNotificationsTabBadgeDisplay} from '#/state/preferences/metrics-display-preference' +import {useUnreadNotifications} from '#/state/queries/notifications/unread' + +export function useTitleUnreadCountLabel(): string | undefined { + const numUnread = useUnreadNotifications() + const notificationsTabBadgeDisplay = useNotificationsTabBadgeDisplay() + return formatTitleUnreadCountLabel( + notificationsTabBadgeDisplay, + numUnread, + ) +} diff --git a/src/lib/metrics-display.ts b/src/lib/metrics-display.ts index 7577f7162..7fa585dcd 100644 --- a/src/lib/metrics-display.ts +++ b/src/lib/metrics-display.ts @@ -161,3 +161,20 @@ export function shouldShowFollowedByOverflowPlus( ): boolean { return mode === 'lite' && serverCount > shownCount } + +/** Unread label for the browser tab title, respecting notification badge display. */ +export function formatTitleUnreadCountLabel( + display: NotificationDotDisplay, + unreadCountLabel: string, +): string | undefined { + if (unreadCountLabel === '') { + return undefined + } + if (display === 'hidden') { + return undefined + } + if (display === 'exact') { + return unreadCountLabel + } + return '•' +} diff --git a/src/screens/Settings/RunesSettings/ImpressionsSettings.tsx b/src/screens/Settings/RunesSettings/ImpressionsSettings.tsx index 8b3ebaf1b..4ee1fcc28 100644 --- a/src/screens/Settings/RunesSettings/ImpressionsSettings.tsx +++ b/src/screens/Settings/RunesSettings/ImpressionsSettings.tsx @@ -165,7 +165,7 @@ export function RunesImpressionsSettingsScreen() { - +