Add dataSet to new Text comp, wrap metrics parents

src/components/Link.tsx

@@ -237,7 +237,7 @@ export function Link({
 }
 
 export type InlineLinkProps = React.PropsWithChildren<
-  BaseLinkProps & TextStyleProp & Pick<TextProps, 'selectable'>
+  BaseLinkProps & TextStyleProp & Pick<TextProps, 'selectable' | 'dataSet'>
 > &
   Pick<ButtonProps, 'label'> & {
     disableUnderline?: boolean
@@ -317,6 +317,7 @@ export function InlineLinkText({
         dataSet: {
           // default to no underline, apply this ourselves
           noUnderline: '1',
+          ...(rest.dataSet || {}),
         },
       })}>
       {children}

src/screens/Profile/Header/Metrics.tsx

@@ -45,12 +45,9 @@ export function ProfileHeaderMetrics({
         testID="profileHeaderFollowersButton"
         style={[a.flex_row, t.atoms.text]}
         to={makeProfileLink(profile, 'followers')}
-        label={`${followers} ${pluralizedFollowers}`}>
+        label={`${followers} ${pluralizedFollowers}`}
-        <Text
+        dataSet={tooltipFormattedCountIfNeeded(profile.followersCount || 0)}>
-          style={[a.font_bold, a.text_md]}
+        <Text style={[a.font_bold, a.text_md]}>{followers} </Text>
-          dataSet={tooltipFormattedCountIfNeeded(profile.followersCount || 0)}>
-          {followers}{' '}
-        </Text>
         <Text style={[t.atoms.text_contrast_medium, a.text_md]}>
           {pluralizedFollowers}
         </Text>
@@ -59,20 +56,15 @@ export function ProfileHeaderMetrics({
         testID="profileHeaderFollowsButton"
         style={[a.flex_row, t.atoms.text]}
         to={makeProfileLink(profile, 'follows')}
-        label={_(msg`${following} following`)}>
+        label={_(msg`${following} following`)}
-        <Text
+        dataSet={tooltipFormattedCountIfNeeded(profile.followsCount || 0)}>
-          style={[a.font_bold, a.text_md]}
+        <Text style={[a.font_bold, a.text_md]}>{following} </Text>
-          dataSet={tooltipFormattedCountIfNeeded(profile.followsCount || 0)}>
-          {following}{' '}
-        </Text>
         <Text style={[t.atoms.text_contrast_medium, a.text_md]}>
           {pluralizedFollowings}
         </Text>
       </InlineLinkText>
-      <Text>
+      <Text dataSet={tooltipFormattedCountIfNeeded(profile.postsCount || 0)}>
-        <Text
+        <Text style={[a.font_bold, t.atoms.text, a.text_md]}>
-          style={[a.font_bold, t.atoms.text, a.text_md]}
-          dataSet={tooltipFormattedCountIfNeeded(profile.postsCount || 0)}>
           {formatCount(i18n, profile.postsCount || 0)}{' '}
         </Text>
         <Text style={[t.atoms.text_contrast_medium, a.font_normal, a.text_md]}>