Improve text selection handling of links

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

@@ -200,6 +200,7 @@ export const PostThreadItem = observer(function PostThreadItem({
                 type="post-text-lg"
                 richText={item.richText}
                 lineHeight={1.3}
+                selectable={true}
               />
             </View>
           ) : undefined}

src/view/com/util/text/RichText.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import {TextStyle, StyleProp} from 'react-native'
+import {TextStyle, StyleProp, Text as RNText} from 'react-native'
 import {RichText as RichTextObj, AppBskyRichtextFacet} from '@atproto/api'
 import {TextLink} from '../Link'
 import {Text} from './Text'
@@ -16,6 +16,7 @@ export function RichText({
   richText,
   lineHeight = 1.2,
   style,
+  selectable = false,
   numberOfLines,
 }: {
   testID?: string
@@ -24,6 +25,7 @@ export function RichText({
   lineHeight?: number
   style?: StyleProp<TextStyle>
   numberOfLines?: number
+  selectable?: boolean
 }) {
   const theme = useTheme()
   const pal = usePalette('default')
@@ -47,11 +49,13 @@ export function RichText({
         </Text>
       )
     }
+
     return (
       <Text
         testID={testID}
         type={type}
         style={[style, pal.text, lineHeightStyle]}
+        selectable={selectable}
         // @ts-ignore web only -prf
         dataSet={WORD_WRAP}>
         {text}
@@ -92,7 +96,11 @@ export function RichText({
         />,
       )
     } else {
-      els.push(segment.text)
+      els.push(
+        <RNText key={key} style={[style, pal.text, lineHeightStyle]}>
+          {segment.text}
+        </RNText>,
+      )
     }
     key++
   }
@@ -102,6 +110,7 @@ export function RichText({
       type={type}
       style={[style, pal.text, lineHeightStyle]}
       numberOfLines={numberOfLines}
+      selectable={selectable}
       // @ts-ignore web only -prf
       dataSet={WORD_WRAP}>
       {els}

src/view/com/util/text/Text.tsx

@@ -1,7 +1,8 @@
 import React from 'react'
-import {Text as RNText, TextProps} from 'react-native'
+import {Text as RNText, TextInput, TextProps} from 'react-native'
 import {s, lh} from 'lib/styles'
 import {useTheme, TypographyVariant} from 'lib/ThemeContext'
+import {isNative} from 'platform/detection'
 
 export type CustomTextProps = TextProps & {
   type?: TypographyVariant
@@ -13,11 +14,23 @@ export function Text({
   children,
   lineHeight,
   style,
+  selectable,
   ...props
 }: React.PropsWithChildren<CustomTextProps>) {
   const theme = useTheme()
   const typography = theme.typography[type]
   const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
+  if (selectable && isNative) {
+    return (
+      <TextInput
+        scrollEnabled={false}
+        style={[s.black, typography, lineHeightStyle, style]}
+        editable={false}
+        multiline={true}>
+        {children}
+      </TextInput>
+    )
+  }
   return (
     <RNText style={[s.black, typography, lineHeightStyle, style]} {...props}>
       {children}