Bluesky app fork with some witchin' additions 💫

Fix quote embed clickability in composer on web (#9876)

authored by samuel.fm and committed by

GitHub 12283063 bc001168

+67 -50
+8 -1
src/components/Post/Embed/LazyQuoteEmbed.tsx
··· 6 6 import {atoms as a, useTheme} from '#/alf' 7 7 import {QuoteEmbed} from '#/components/Post/Embed' 8 8 9 - export function LazyQuoteEmbed({uri}: {uri: string}) { 9 + export function LazyQuoteEmbed({ 10 + uri, 11 + linkDisabled, 12 + }: { 13 + uri: string 14 + linkDisabled?: boolean 15 + }) { 10 16 const t = useTheme() 11 17 const {data} = useResolveLinkQuery(uri) 12 18 ··· 21 27 type: 'post', 22 28 view, 23 29 }} 30 + linkDisabled={linkDisabled} 24 31 /> 25 32 ) : ( 26 33 <View
+57 -45
src/components/Post/Embed/index.tsx
··· 225 225 embed, 226 226 onOpen, 227 227 style, 228 + linkDisabled, 228 229 isWithinQuote: parentIsWithinQuote, 229 230 allowNestedQuotes: parentAllowNestedQuotes, 230 231 }: Omit<CommonProps, 'viewContext'> & { 231 232 embed: EmbedType<'post'> 232 233 viewContext?: QuoteEmbedViewContext 234 + linkDisabled?: boolean 233 235 }) { 234 236 const moderationOpts = useModerationOpts() 235 237 const quote = useMemo<$Typed<AppBskyFeedDefs.PostView>>( ··· 280 282 onIn: onPressIn, 281 283 onOut: onPressOut, 282 284 } = useInteractionState() 285 + 286 + const contents = ( 287 + <> 288 + <View pointerEvents="none"> 289 + <PostMeta 290 + author={quote.author} 291 + moderation={moderation} 292 + showAvatar 293 + postHref={itemHref} 294 + timestamp={quote.indexedAt} 295 + /> 296 + </View> 297 + {moderation ? ( 298 + <PostAlerts modui={moderation.ui('contentView')} style={[a.py_xs]} /> 299 + ) : null} 300 + {richText ? ( 301 + <RichText 302 + value={richText} 303 + style={a.text_md} 304 + numberOfLines={20} 305 + disableLinks 306 + /> 307 + ) : null} 308 + {quote.embed && ( 309 + <Embed 310 + embed={quote.embed} 311 + moderation={moderation} 312 + isWithinQuote={parentIsWithinQuote ?? true} 313 + // already within quote? override nested 314 + allowNestedQuotes={ 315 + parentIsWithinQuote ? false : parentAllowNestedQuotes 316 + } 317 + /> 318 + )} 319 + </> 320 + ) 321 + 283 322 return ( 284 323 <View 285 324 style={[a.mt_sm]} 286 - onPointerEnter={onPointerEnter} 287 - onPointerLeave={onPointerLeave}> 325 + onPointerEnter={linkDisabled ? undefined : onPointerEnter} 326 + onPointerLeave={linkDisabled ? undefined : onPointerLeave}> 288 327 <ContentHider 289 328 modui={moderation?.ui('contentList')} 290 329 style={[a.rounded_md, a.border, t.atoms.border_contrast_low, style]} ··· 292 331 childContainerStyle={[a.pt_sm]}> 293 332 {({active}) => ( 294 333 <> 295 - {!active && ( 334 + {!active && !linkDisabled && ( 296 335 <SubtleHover 297 336 native 298 337 hover={hover || pressed} 299 338 style={[a.rounded_md]} 300 339 /> 301 340 )} 302 - <Link 303 - style={[!active && a.p_md]} 304 - hoverStyle={t.atoms.border_contrast_high} 305 - href={itemHref} 306 - title={itemTitle} 307 - onBeforePress={onBeforePress} 308 - onPressIn={onPressIn} 309 - onPressOut={onPressOut}> 310 - <View pointerEvents="none"> 311 - <PostMeta 312 - author={quote.author} 313 - moderation={moderation} 314 - showAvatar 315 - postHref={itemHref} 316 - timestamp={quote.indexedAt} 317 - /> 341 + {linkDisabled ? ( 342 + <View style={[!active && a.p_md]} pointerEvents="none"> 343 + {contents} 318 344 </View> 319 - {moderation ? ( 320 - <PostAlerts 321 - modui={moderation.ui('contentView')} 322 - style={[a.py_xs]} 323 - /> 324 - ) : null} 325 - {richText ? ( 326 - <RichText 327 - value={richText} 328 - style={a.text_md} 329 - numberOfLines={20} 330 - disableLinks 331 - /> 332 - ) : null} 333 - {quote.embed && ( 334 - <Embed 335 - embed={quote.embed} 336 - moderation={moderation} 337 - isWithinQuote={parentIsWithinQuote ?? true} 338 - // already within quote? override nested 339 - allowNestedQuotes={ 340 - parentIsWithinQuote ? false : parentAllowNestedQuotes 341 - } 342 - /> 343 - )} 344 - </Link> 345 + ) : ( 346 + <Link 347 + style={[!active && a.p_md]} 348 + hoverStyle={t.atoms.border_contrast_high} 349 + href={itemHref} 350 + title={itemTitle} 351 + onBeforePress={onBeforePress} 352 + onPressIn={onPressIn} 353 + onPressOut={onPressOut}> 354 + {contents} 355 + </Link> 356 + )} 345 357 </> 346 358 )} 347 359 </ContentHider>
+1 -3
src/view/com/composer/Composer.tsx
··· 1725 1725 <View 1726 1726 style={[a.pb_sm, video ? [a.pt_md] : [a.pt_xl], IS_WEB && [a.pb_md]]}> 1727 1727 <View style={[a.relative]}> 1728 - <View style={{pointerEvents: 'none'}}> 1729 - <LazyQuoteEmbed uri={embed.quote.uri} /> 1730 - </View> 1728 + <LazyQuoteEmbed uri={embed.quote.uri} linkDisabled /> 1731 1729 {canRemoveQuote && ( 1732 1730 <ExternalEmbedRemoveBtn 1733 1731 onRemove={() => dispatch({type: 'embed_remove_quote'})}
+1 -1
src/view/com/composer/ComposerReplyTo.tsx
··· 132 132 )} 133 133 </View> 134 134 {showFull && parsedQuoteEmbed && parsedQuoteEmbed.type === 'post' && ( 135 - <QuoteEmbed embed={parsedQuoteEmbed} /> 135 + <QuoteEmbed embed={parsedQuoteEmbed} linkDisabled /> 136 136 )} 137 137 </View> 138 138 </Pressable>