Update FeedItem.tsx

src/view/com/notifications/FeedItem.tsx

@@ -22,6 +22,7 @@ import {msg, Plural, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useQueryClient} from '@tanstack/react-query'
 
+import {useGate} from '#/lib/statsig/statsig'
 import {FeedNotification} from '#/state/queries/notifications/feed'
 import {useAnimatedValue} from 'lib/hooks/useAnimatedValue'
 import {usePalette} from 'lib/hooks/usePalette'
@@ -86,6 +87,7 @@ let FeedItem = ({
   const pal = usePalette('default')
   const {_} = useLingui()
   const t = useTheme()
+  const gate = useGate()
   const [isAuthorsExpanded, setAuthorsExpanded] = useState<boolean>(false)
   const itemHref = useMemo(() => {
     if (item.type === 'post-like' || item.type === 'repost') {
@@ -168,6 +170,7 @@ let FeedItem = ({
     )
   }
 
+  let isFollowBack = false
   let formattedCount = authors.length > 1 ? formatCount(authors.length - 1) : ''
 
   let author = (
@@ -229,22 +232,45 @@ let FeedItem = ({
       )
     icon = <RepostIcon size="xl" style={{color: t.palette.positive_600}} />
   } else if (item.type === 'follow') {
-    action =
+    if (
-      authors.length > 1 ? (
+      item.notification.author.viewer?.following &&
-        <Trans>
+      gate('ungroup_follow_backs')
-          {author} and{' '}
+    ) {
-          <Text style={[pal.text, s.bold]}>
+      isFollowBack = true
-            <Plural
+      action =
-              value={authors.length - 1}
+        authors.length > 1 ? (
-              one={`${formattedCount} other`}
+          <Trans>
-              other={`${formattedCount} others`}
+            {author} and{' '}
-            />
+            <Text style={[pal.text, s.bold]}>
-          </Text>{' '}
+              <Plural
-          followed you
+                value={authors.length - 1}
-        </Trans>
+                one={`${formattedCount} other`}
-      ) : (
+                other={`${formattedCount} others`}
-        <Trans>{author} followed you</Trans>
+              />
-      )
+            </Text>{' '}
+            followed you back
+          </Trans>
+        ) : (
+          <Trans>{author} followed you back</Trans>
+        )
+    } else {
+      action =
+        authors.length > 1 ? (
+          <Trans>
+            {author} and{' '}
+            <Text style={[pal.text, s.bold]}>
+              <Plural
+                value={authors.length - 1}
+                one={`${formattedCount} other`}
+                other={`${formattedCount} others`}
+              />
+            </Text>{' '}
+            followed you
+          </Trans>
+        ) : (
+          <Trans>{author} followed you</Trans>
+        )
+    }
     icon = <PersonPlusIcon size="xl" style={{color: t.palette.primary_500}} />
   } else if (item.type === 'feedgen-like') {
     action =
@@ -349,7 +375,7 @@ let FeedItem = ({
             visible={!isAuthorsExpanded}
             authors={authors}
             onToggleAuthorsExpanded={onToggleAuthorsExpanded}
-            showDmButton={item.type === 'starterpack-joined'}
+            showDmButton={item.type === 'starterpack-joined' || isFollowBack}
           />
           <ExpandedAuthorsList visible={isAuthorsExpanded} authors={authors} />
           <Text style={[styles.meta, pal.text]}>