Enable tags inside of quotes (#3041)

* enable tags for quote posts

* mentions too

* just disable pointer events instead

* apply fix for both web and native

* minimize diff
zio/stable
Hailey 2024-03-01 16:04:20 -08:00 committed by GitHub
parent e950463f71
commit f016cdbca9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 22 additions and 25 deletions

View File

@ -78,40 +78,31 @@ export function RichText({
const link = segment.link const link = segment.link
const mention = segment.mention const mention = segment.mention
const tag = segment.tag const tag = segment.tag
if ( if (mention && AppBskyRichtextFacet.validateMention(mention).success) {
mention &&
AppBskyRichtextFacet.validateMention(mention).success &&
!disableLinks
) {
els.push( els.push(
<InlineLink <InlineLink
selectable={selectable} selectable={selectable}
key={key} key={key}
to={`/profile/${mention.did}`} to={`/profile/${mention.did}`}
style={[...styles, {pointerEvents: 'auto'}]} style={[...styles, {pointerEvents: disableLinks ? 'none' : 'auto'}]}
// @ts-ignore TODO // @ts-ignore TODO
dataSet={WORD_WRAP}> dataSet={WORD_WRAP}>
{segment.text} {segment.text}
</InlineLink>, </InlineLink>,
) )
} else if (link && AppBskyRichtextFacet.validateLink(link).success) { } else if (link && AppBskyRichtextFacet.validateLink(link).success) {
if (disableLinks) { els.push(
els.push(toShortUrl(segment.text)) <InlineLink
} else { selectable={selectable}
els.push( key={key}
<InlineLink to={link.uri}
selectable={selectable} style={[...styles, {pointerEvents: disableLinks ? 'none' : 'auto'}]}
key={key} // @ts-ignore TODO
to={link.uri} dataSet={WORD_WRAP}>
style={[...styles, {pointerEvents: 'auto'}]} {toShortUrl(segment.text)}
// @ts-ignore TODO </InlineLink>,
dataSet={WORD_WRAP}> )
{toShortUrl(segment.text)}
</InlineLink>,
)
}
} else if ( } else if (
!disableLinks &&
enableTags && enableTags &&
tag && tag &&
AppBskyRichtextFacet.validateTag(tag).success AppBskyRichtextFacet.validateTag(tag).success
@ -124,6 +115,7 @@ export function RichText({
style={styles} style={styles}
selectable={selectable} selectable={selectable}
authorHandle={authorHandle} authorHandle={authorHandle}
disableLinks={disableLinks}
/>, />,
) )
} else { } else {
@ -136,7 +128,7 @@ export function RichText({
<Text <Text
selectable={selectable} selectable={selectable}
testID={testID} testID={testID}
style={styles} style={[styles, {pointerEvents: disableLinks ? 'none' : 'auto'}]}
numberOfLines={numberOfLines} numberOfLines={numberOfLines}
// @ts-ignore web only -prf // @ts-ignore web only -prf
dataSet={WORD_WRAP}> dataSet={WORD_WRAP}>
@ -151,11 +143,13 @@ function RichTextTag({
style, style,
selectable, selectable,
authorHandle, authorHandle,
disableLinks,
}: { }: {
text: string text: string
tag: string tag: string
selectable?: boolean selectable?: boolean
authorHandle?: string authorHandle?: string
disableLinks?: boolean
} & TextStyleProp) { } & TextStyleProp) {
const t = useTheme() const t = useTheme()
const {_} = useLingui() const {_} = useLingui()
@ -204,7 +198,7 @@ function RichTextTag({
style={[ style={[
style, style,
{ {
pointerEvents: 'auto', pointerEvents: disableLinks ? 'none' : 'auto',
color: t.palette.primary_500, color: t.palette.primary_500,
}, },
web({ web({

View File

@ -91,7 +91,10 @@ export function QuoteEmbed({
const richText = React.useMemo( const richText = React.useMemo(
() => () =>
quote.text.trim() quote.text.trim()
? new RichTextAPI({text: quote.text, facets: quote.facets}) ? new RichTextAPI({
text: quote.text,
facets: quote.facets,
})
: undefined, : undefined,
[quote.text, quote.facets], [quote.text, quote.facets],
) )