Clean up feature gate for follow buttons in expanded notifications (#11068)

src/analytics/features/types.ts

@@ -12,7 +12,6 @@ export enum Features {
   GroupChatsDisable = 'group_chats:disable',
   ComposerLanguageDetectionEnable = 'composer:language_detection:enable',
   PostGalleryEmbedEnable = 'post_gallery_embed:enable',
-  NotificationsExpandedProfileCardEnable = 'notifications:expanded_profile_card:enable',
   SearchV2Enable = 'search_v2:enable',
   AdvancedSearchV2Enable = 'advanced_search_v2:enable',
 

src/view/com/notifications/NotificationFeedItem.tsx

@@ -31,7 +31,6 @@ import {makeProfileLink} from '#/lib/routes/links'
 import {type NavigationProp} from '#/lib/routes/types'
 import {forceLTR} from '#/lib/strings/bidi'
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
-import {sanitizeHandle} from '#/lib/strings/handles'
 import {niceDate} from '#/lib/strings/time'
 import {s} from '#/lib/styles'
 import {logger} from '#/logger'
@@ -44,7 +43,7 @@ import {FeedSourceCard} from '#/view/com/feeds/FeedSourceCard'
 import {Post} from '#/view/com/post/Post'
 import {formatCount} from '#/view/com/util/numeric/format'
 import {TimeElapsed} from '#/view/com/util/TimeElapsed'
-import {PreviewableUserAvatar, UserAvatar} from '#/view/com/util/UserAvatar'
+import {PreviewableUserAvatar} from '#/view/com/util/UserAvatar'
 import {atoms as a, platform, useTheme} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
 import {BellRinging_Filled_Corner0_Rounded as BellRingingIcon} from '#/components/icons/BellRinging'
@@ -75,8 +74,6 @@ import * as bsky from '#/types/bsky'
 
 const MAX_AUTHORS = 5
 
-const EXPANDED_AUTHOR_EL_HEIGHT = 35
-
 interface Author {
   profile: AppBskyActorDefs.ProfileView
   href: string
@@ -98,9 +95,6 @@ let NotificationFeedItem = ({
   const t = useTheme()
   const {_, i18n} = useLingui()
   const ax = useAnalytics()
-  const profileCardEnabled = ax.features.enabled(
-    ax.features.NotificationsExpandedProfileCardEnable,
-  )
   const [isAuthorsExpanded, setIsAuthorsExpanded] = useState<boolean>(false)
   const [isHoveringAuthorsList, setIsHoveringAuthorsList] = useState(false)
   const itemHref = useMemo(() => {
@@ -633,9 +627,7 @@ let NotificationFeedItem = ({
       }}>
       {({hovered}) => (
         <>
-          <SubtleHover
+          <SubtleHover hover={hovered && !isHoveringAuthorsList} />
-            hover={hovered && (!profileCardEnabled || !isHoveringAuthorsList)}
-          />
           <View style={[styles.layoutIcon, a.pr_sm]}>
             {/* TODO: Prevent conditional rendering and move toward composable
           notifications for clearer accessibility labeling */}
@@ -645,16 +637,8 @@ let NotificationFeedItem = ({
             <ExpandListPressable
               hasMultipleAuthors={hasMultipleAuthors}
               onToggleAuthorsExpanded={onToggleAuthorsExpanded}
-              onHoverIn={
+              onHoverIn={() => setIsHoveringAuthorsList(true)}
-                profileCardEnabled
+              onHoverOut={() => setIsHoveringAuthorsList(false)}>
-                  ? () => setIsHoveringAuthorsList(true)
-                  : undefined
-              }
-              onHoverOut={
-                profileCardEnabled
-                  ? () => setIsHoveringAuthorsList(false)
-                  : undefined
-              }>
               <CondensedAuthorsList
                 visible={!isAuthorsExpanded}
                 authors={authors}
@@ -1025,28 +1009,23 @@ function ExpandedAuthorsList({
   authors: Author[]
   moderationOpts: ModerationOpts
 }) {
-  const ax = useAnalytics()
-  const profileCardEnabled = ax.features.enabled(
-    ax.features.NotificationsExpandedProfileCardEnable,
-  )
-  const isNativeFade = !IS_WEB && profileCardEnabled
   const heightInterp = useAnimatedValue(visible ? 1 : 0)
   const opacityInterp = useAnimatedValue(visible ? 1 : 0)
   const [measuredHeight, setMeasuredHeight] = useState(0)
   useEffect(() => {
-    Animated.timing(isNativeFade ? opacityInterp : heightInterp, {
+    Animated.timing(IS_WEB ? heightInterp : opacityInterp, {
       toValue: visible ? 1 : 0,
       duration: 200,
-      useNativeDriver: isNativeFade,
+      useNativeDriver: !IS_WEB,
     }).start()
-  }, [heightInterp, opacityInterp, visible, isNativeFade])
+  }, [heightInterp, opacityInterp, visible])
   const onInnerLayout = (e: LayoutChangeEvent) => {
     if (measuredHeight === 0) {
       setMeasuredHeight(e.nativeEvent.layout.height)
     }
   }
 
-  if (isNativeFade) {
+  if (!IS_WEB) {
     return (
       <Animated.View style={{opacity: opacityInterp}}>
         {visible && (
@@ -1065,31 +1044,22 @@ function ExpandedAuthorsList({
     )
   }
 
-  const targetHeight = profileCardEnabled
-    ? measuredHeight
-    : authors.length * (EXPANDED_AUTHOR_EL_HEIGHT + 10) /*10=margin*/
   const heightStyle = {
-    height: Animated.multiply(heightInterp, targetHeight),
+    height: Animated.multiply(heightInterp, measuredHeight),
     opacity: Animated.divide(heightInterp, 1),
   }
   return (
     <Animated.View style={[a.overflow_hidden, heightStyle]}>
-      {profileCardEnabled ? (
+      <View onLayout={onInnerLayout} style={[a.pt_sm, a.pb_md]}>
-        <View onLayout={onInnerLayout} style={[a.pt_sm, a.pb_md]}>
+        {authors.map((author, i) => (
-          {authors.map((author, i) => (
+          <ExpandedAuthorProfileCard
-            <ExpandedAuthorProfileCard
+            key={author.profile.did}
-              key={author.profile.did}
+            author={author}
-              author={author}
+            moderationOpts={moderationOpts}
-              moderationOpts={moderationOpts}
+            isLast={i === authors.length - 1}
-              isLast={i === authors.length - 1}
+          />
-            />
+        ))}
-          ))}
+      </View>
-        </View>
-      ) : (
-        authors.map(author => (
-          <ExpandedAuthorCard key={author.profile.did} author={author} />
-        ))
-      )}
     </Animated.View>
   )
 }
@@ -1134,65 +1104,6 @@ function ExpandedAuthorProfileCard({
   )
 }
 
-function ExpandedAuthorCard({author}: {author: Author}) {
-  const t = useTheme()
-  const {_} = useLingui()
-  return (
-    <Link
-      label={author.profile.displayName || author.profile.handle}
-      accessibilityHint={_(msg`Opens this profile`)}
-      to={makeProfileLink({
-        did: author.profile.did,
-        handle: author.profile.handle,
-      })}
-      style={styles.expandedAuthor}>
-      <View style={[a.mr_sm]}>
-        <ProfileHoverCard did={author.profile.did}>
-          <UserAvatar
-            size={35}
-            avatar={author.profile.avatar}
-            moderation={author.moderation.ui('avatar')}
-            type={author.profile.associated?.labeler ? 'labeler' : 'user'}
-          />
-        </ProfileHoverCard>
-      </View>
-      <View style={[a.flex_1]}>
-        <View style={[a.flex_row, a.align_end]}>
-          <Text
-            numberOfLines={1}
-            emoji
-            style={[
-              a.text_md,
-              a.font_semi_bold,
-              a.leading_tight,
-              {maxWidth: '70%'},
-            ]}>
-            {sanitizeDisplayName(
-              author.profile.displayName || author.profile.handle,
-            )}
-          </Text>
-          <ProfileBadges
-            profile={author.profile}
-            size="md"
-            style={[a.pl_2xs, a.self_center]}
-          />
-          <Text
-            numberOfLines={1}
-            style={[
-              a.pl_xs,
-              a.text_md,
-              a.leading_tight,
-              a.flex_shrink,
-              t.atoms.text_contrast_medium,
-            ]}>
-            {sanitizeHandle(author.profile.handle, '@')}
-          </Text>
-        </View>
-      </View>
-    </Link>
-  )
-}
-
 function AdditionalPostText({post}: {post?: AppBskyFeedDefs.PostView}) {
   const t = useTheme()
   if (
@@ -1256,10 +1167,4 @@ const styles = StyleSheet.create({
     paddingTop: 10,
     paddingBottom: 6,
   },
-  expandedAuthor: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    marginTop: 10,
-    height: EXPANDED_AUTHOR_EL_HEIGHT,
-  },
 })