Format count and fix type warning (#600)

src/view/com/notifications/FeedItem.tsx

@@ -34,6 +34,7 @@ import {
   getProfileModeration,
 } from 'lib/labeling/helpers'
 import {ProfileModeration} from 'lib/labeling/types'
+import {formatCount} from '../util/numeric/format'
 
 const MAX_AUTHORS = 5
 
@@ -218,7 +219,8 @@ export const FeedItem = observer(function ({
               <>
                 <Text style={[pal.text]}> and </Text>
                 <Text style={[pal.text, s.bold]}>
-                  {authors.length - 1} {pluralize(authors.length - 1, 'other')}
+                  {formatCount(authors.length - 1)}{' '}
+                  {pluralize(authors.length - 1, 'other')}
                 </Text>
               </>
             ) : undefined}

src/view/com/post-thread/PostThreadItem.tsx

@@ -26,6 +26,7 @@ import {PostHider} from '../util/moderation/PostHider'
 import {ContentHider} from '../util/moderation/ContentHider'
 import {ErrorMessage} from '../util/error/ErrorMessage'
 import {usePalette} from 'lib/hooks/usePalette'
+import {formatCount} from '../util/numeric/format'
 
 const PARENT_REPLY_LINE_LENGTH = 8
 
@@ -247,7 +248,7 @@ export const PostThreadItem = observer(function PostThreadItem({
                   title={repostsTitle}>
                   <Text testID="repostCount" type="lg" style={pal.textLight}>
                     <Text type="xl-bold" style={pal.text}>
-                      {item.post.repostCount}
+                      {formatCount(item.post.repostCount)}
                     </Text>{' '}
                     {pluralize(item.post.repostCount, 'repost')}
                   </Text>
@@ -262,7 +263,7 @@ export const PostThreadItem = observer(function PostThreadItem({
                   title={likesTitle}>
                   <Text testID="likeCount" type="lg" style={pal.textLight}>
                     <Text type="xl-bold" style={pal.text}>
-                      {item.post.likeCount}
+                      {formatCount(item.post.likeCount)}
                     </Text>{' '}
                     {pluralize(item.post.likeCount, 'like')}
                   </Text>

src/view/com/profile/ProfileHeader.tsx

@@ -401,7 +401,7 @@ const ProfileHeaderLoaded = observer(
                   </Text>
                 </TouchableOpacity>
                 <Text type="md" style={[s.bold, pal.text]}>
-                  {view.postsCount}{' '}
+                  {formatCount(view.postsCount)}{' '}
                   <Text type="md" style={[pal.textLight]}>
                     {pluralize(view.postsCount, 'post')}
                   </Text>

src/view/screens/Settings.tsx

@@ -36,6 +36,7 @@ import {useAnalytics} from 'lib/analytics'
 import {NavigationProp} from 'lib/routes/types'
 import {isDesktopWeb} from 'platform/detection'
 import {pluralize} from 'lib/strings/helpers'
+import {formatCount} from 'view/com/util/numeric/format'
 
 type Props = NativeStackScreenProps<CommonNavigatorParams, 'Settings'>
 export const SettingsScreen = withAuthRequired(
@@ -153,18 +154,22 @@ export const SettingsScreen = withAuthRequired(
           contentContainerStyle={!isDesktopWeb && pal.viewLight}
           scrollIndicatorInsets={{right: 1}}>
           <View style={styles.spacer20} />
-          <Text type="xl-bold" style={[pal.text, styles.heading]}>
+          {store.session.currentSession !== undefined ? (
-            Account
+            <>
-          </Text>
+              <Text type="xl-bold" style={[pal.text, styles.heading]}>
-          <View style={[styles.infoLine]}>
+                Account
-            <Text type="lg-medium" style={pal.text}>
-              Email:{' '}
-              <Text type="lg" style={pal.text}>
-                {store.session.currentSession.email}
               </Text>
-            </Text>
+              <View style={[styles.infoLine]}>
-          </View>
+                <Text type="lg-medium" style={pal.text}>
-          <View style={styles.spacer20} />
+                  Email:{' '}
+                  <Text type="lg" style={pal.text}>
+                    {store.session.currentSession?.email}
+                  </Text>
+                </Text>
+              </View>
+              <View style={styles.spacer20} />
+            </>
+          ) : null}
           <View style={[s.flexRow, styles.heading]}>
             <Text type="xl-bold" style={pal.text}>
               Signed in as
@@ -275,7 +280,7 @@ export const SettingsScreen = withAuthRequired(
             <Text
               type="lg"
               style={store.me.invitesAvailable > 0 ? pal.link : pal.text}>
-              {store.me.invitesAvailable} invite{' '}
+              {formatCount(store.me.invitesAvailable)} invite{' '}
               {pluralize(store.me.invitesAvailable, 'code')} available
             </Text>
           </TouchableOpacity>

src/view/shell/Drawer.tsx

@@ -392,7 +392,7 @@ const InviteCodes = observer(() => {
       <Text
         type="lg-medium"
         style={store.me.invitesAvailable > 0 ? pal.link : pal.textLight}>
-        {store.me.invitesAvailable} invite{' '}
+        {formatCount(store.me.invitesAvailable)} invite{' '}
         {pluralize(store.me.invitesAvailable, 'code')}
       </Text>
     </TouchableOpacity>

src/view/shell/desktop/RightNav.tsx

@@ -12,6 +12,7 @@ import {useStores} from 'state/index'
 import {pluralize} from 'lib/strings/helpers'
 import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle'
 import {MoonIcon} from 'lib/icons'
+import {formatCount} from 'view/com/util/numeric/format'
 
 export const DesktopRightNav = observer(function DesktopRightNav() {
   const store = useStores()
@@ -112,7 +113,7 @@ const InviteCodes = observer(() => {
       <Text
         type="md-medium"
         style={store.me.invitesAvailable > 0 ? pal.link : pal.textLight}>
-        {store.me.invitesAvailable} invite{' '}
+        {formatCount(store.me.invitesAvailable)} invite{' '}
         {pluralize(store.me.invitesAvailable, 'code')} available
       </Text>
     </TouchableOpacity>