diff options
| -rw-r--r-- | src/state/shell/composer.tsx | 3 | ||||
| -rw-r--r-- | src/view/com/util/post-embeds/QuoteEmbed.tsx | 24 | ||||
| -rw-r--r-- | src/view/com/util/text/RichText.tsx | 34 |
3 files changed, 41 insertions, 20 deletions
diff --git a/src/state/shell/composer.tsx b/src/state/shell/composer.tsx index 51376fd5a..2133ee6b0 100644 --- a/src/state/shell/composer.tsx +++ b/src/state/shell/composer.tsx @@ -1,5 +1,5 @@ import React from 'react' -import {AppBskyEmbedRecord} from '@atproto/api' +import {AppBskyEmbedRecord, AppBskyRichtextFacet} from '@atproto/api' import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback' export interface ComposerOptsPostRef { @@ -17,6 +17,7 @@ export interface ComposerOptsQuote { uri: string cid: string text: string + facets?: AppBskyRichtextFacet.Main[] indexedAt: string author: { did: string diff --git a/src/view/com/util/post-embeds/QuoteEmbed.tsx b/src/view/com/util/post-embeds/QuoteEmbed.tsx index e5fe44c4d..256817bba 100644 --- a/src/view/com/util/post-embeds/QuoteEmbed.tsx +++ b/src/view/com/util/post-embeds/QuoteEmbed.tsx @@ -7,6 +7,7 @@ import { AppBskyEmbedRecordWithMedia, ModerationUI, AppBskyEmbedExternal, + RichText as RichTextAPI, } from '@atproto/api' import {AtUri} from '@atproto/api' import {PostMeta} from '../PostMeta' @@ -19,6 +20,7 @@ import {PostAlerts} from '../moderation/PostAlerts' import {makeProfileLink} from 'lib/routes/links' import {InfoCircleIcon} from 'lib/icons' import {Trans} from '@lingui/macro' +import {RichText} from 'view/com/util/text/RichText' export function MaybeQuoteEmbed({ embed, @@ -43,6 +45,7 @@ export function MaybeQuoteEmbed({ uri: embed.record.uri, indexedAt: embed.record.indexedAt, text: embed.record.value.text, + facets: embed.record.value.facets, embeds: embed.record.embeds, }} moderation={moderation} @@ -84,9 +87,12 @@ export function QuoteEmbed({ const itemUrip = new AtUri(quote.uri) const itemHref = makeProfileLink(quote.author, 'post', itemUrip.rkey) const itemTitle = `Post by ${quote.author.handle}` - const isEmpty = React.useMemo( - () => quote.text.trim().length === 0, - [quote.text], + const richText = React.useMemo( + () => + quote.text.trim() + ? new RichTextAPI({text: quote.text, facets: quote.facets}) + : undefined, + [quote.text, quote.facets], ) const embed = React.useMemo(() => { const e = quote.embeds?.[0] @@ -117,10 +123,14 @@ export function QuoteEmbed({ {moderation ? ( <PostAlerts moderation={moderation} style={styles.alert} /> ) : null} - {!isEmpty ? ( - <Text type="post-text" style={pal.text} numberOfLines={20}> - {quote.text} - </Text> + {richText ? ( + <RichText + richText={richText} + type="post-text" + style={pal.text} + numberOfLines={20} + noLinks + /> ) : null} {embed && <PostEmbeds embed={embed} moderation={{}} />} </Link> diff --git a/src/view/com/util/text/RichText.tsx b/src/view/com/util/text/RichText.tsx index 99062e848..da473d929 100644 --- a/src/view/com/util/text/RichText.tsx +++ b/src/view/com/util/text/RichText.tsx @@ -17,6 +17,7 @@ export function RichText({ lineHeight = 1.2, style, numberOfLines, + noLinks, }: { testID?: string type?: TypographyVariant @@ -24,6 +25,7 @@ export function RichText({ lineHeight?: number style?: StyleProp<TextStyle> numberOfLines?: number + noLinks?: boolean }) { const theme = useTheme() const pal = usePalette('default') @@ -70,7 +72,11 @@ export function RichText({ for (const segment of richText.segments()) { const link = segment.link const mention = segment.mention - if (mention && AppBskyRichtextFacet.validateMention(mention).success) { + if ( + !noLinks && + mention && + AppBskyRichtextFacet.validateMention(mention).success + ) { els.push( <TextLink key={key} @@ -82,17 +88,21 @@ export function RichText({ />, ) } else if (link && AppBskyRichtextFacet.validateLink(link).success) { - els.push( - <TextLink - key={key} - type={type} - text={toShortUrl(segment.text)} - href={link.uri} - style={[style, lineHeightStyle, pal.link, {pointerEvents: 'auto'}]} - dataSet={WORD_WRAP} - warnOnMismatchingLabel - />, - ) + if (noLinks) { + els.push(toShortUrl(segment.text)) + } else { + els.push( + <TextLink + key={key} + type={type} + text={toShortUrl(segment.text)} + href={link.uri} + style={[style, lineHeightStyle, pal.link, {pointerEvents: 'auto'}]} + dataSet={WORD_WRAP} + warnOnMismatchingLabel + />, + ) + } } else { els.push(segment.text) } |