show rich text in drafts list

(cherry picked from commit fb70d53d59)

src/components/RichText.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import {useMemo} from 'react'
 import {type StyleProp, type TextStyle} from 'react-native'
 import {AppBskyRichtextFacet, RichText as RichTextAPI} from '@atproto/api'
 
@@ -27,6 +27,16 @@ export type RichTextProps = TextStyleProp &
     interactiveStyle?: StyleProp<TextStyle>
     emojiMultiplier?: number
     shouldProxyLinks?: boolean
+    /**
+     * DANGEROUS: Disable facet lexicon validation
+     *
+     * `detectFacetsWithoutResolution()` generates technically invalid facets,
+     * with a handle in place of the DID. This means that RichText that uses it
+     * won't be able to render links.
+     *
+     * Use with care - only use if you're rendering facets you're generating yourself.
+     */
+    validateMentionFacets?: boolean
   }
 
 export function RichText({
@@ -44,12 +54,17 @@ export function RichText({
   onLayout,
   onTextLayout,
   shouldProxyLinks,
+  validateMentionFacets,
 }: RichTextProps) {
-  const richText = React.useMemo(
+  const richText = useMemo(() => {
-    () =>
+    if (value instanceof RichTextAPI) {
-      value instanceof RichTextAPI ? value : new RichTextAPI({text: value}),
+      return value
-    [value],
+    } else {
-  )
+      const rt = new RichTextAPI({text: value})
+      rt.detectFacetsWithoutResolution()
+      return rt
+    }
+  }, [value])
 
   const plainStyles = [a.leading_snug, style]
   const interactiveStyles = [plainStyles, interactiveStyle]
@@ -98,9 +113,11 @@ export function RichText({
     const link = segment.link
     const mention = segment.mention
     const tag = segment.tag
+
     if (
       mention &&
-      AppBskyRichtextFacet.validateMention(mention).success &&
+      (!validateMentionFacets ||
+        AppBskyRichtextFacet.validateMention(mention).success) &&
       !disableLinks
     ) {
       els.push(

src/view/com/composer/drafts/DraftItem.tsx

@@ -15,6 +15,7 @@ import {Button, ButtonIcon} from '#/components/Button'
 import {DotGrid_Stroke2_Corner0_Rounded as DotsIcon} from '#/components/icons/DotGrid'
 import * as MediaPreview from '#/components/MediaPreview'
 import * as Prompt from '#/components/Prompt'
+import {RichText} from '#/components/RichText'
 import {Text} from '#/components/Typography'
 import {IS_WEB} from '#/env'
 import {type DraftPostDisplay, type DraftSummary} from './state/schema'
@@ -330,9 +331,12 @@ function DraftPostRow({
         </View>
 
         {post.text ? (
-          <Text style={[a.text_md, a.leading_snug, t.atoms.text]}>
+          <RichText
-            {post.text}
+            style={[a.text_md, a.leading_snug, a.pointer_events_none]}
-          </Text>
+            value={post.text}
+            enableTags
+            validateMentionFacets={false}
+          />
         ) : (
           <Text
             style={[