diff --git a/src/view/com/util/numeric/format.ts b/src/view/com/util/numeric/format.ts index f0e90217..7aa5a4f4 100644 --- a/src/view/com/util/numeric/format.ts +++ b/src/view/com/util/numeric/format.ts @@ -3,3 +3,13 @@ export const formatCount = (num: number) => notation: 'compact', maximumFractionDigits: 1, }).format(num) + +export function formatCountShortOnly(num: number): string { + if (num >= 1000000) { + return (num / 1000000).toFixed(1) + 'M' + } + if (num >= 1000) { + return (num / 1000).toFixed(1) + 'K' + } + return String(num) +} diff --git a/src/view/shell/Drawer.tsx b/src/view/shell/Drawer.tsx index d00d05f7..5617cd5b 100644 --- a/src/view/shell/Drawer.tsx +++ b/src/view/shell/Drawer.tsx @@ -2,6 +2,7 @@ import React, {ComponentProps} from 'react' import { Linking, SafeAreaView, + ScrollView, StyleProp, StyleSheet, TouchableOpacity, @@ -41,7 +42,7 @@ import {getTabState, TabState} from 'lib/routes/helpers' import {NavigationProp} from 'lib/routes/types' import {useNavigationTabState} from 'lib/hooks/useNavigationTabState' import {isWeb} from 'platform/detection' -import {formatCount} from 'view/com/util/numeric/format' +import {formatCount, formatCountShortOnly} from 'view/com/util/numeric/format' export const DrawerContent = observer(() => { const theme = useTheme() @@ -154,19 +155,18 @@ export const DrawerContent = observer(() => { type="xl" style={[pal.textLight, styles.profileCardFollowers]}> - {formatCount(store.me.followersCount ?? 0)} + {formatCountShortOnly(store.me.followersCount ?? 0)} {' '} {pluralize(store.me.followersCount || 0, 'follower')} ·{' '} - {formatCount(store.me.followsCount ?? 0)} + {formatCountShortOnly(store.me.followsCount ?? 0)} {' '} following - - + { accessibilityHint="" onPress={onPressSettings} /> - - + + {!isWeb && (