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

src/components/Post/Embed/LazyQuoteEmbed.tsx

@@ -6,7 +6,13 @@ import {useResolveLinkQuery} from '#/state/queries/resolve-link'
 import {atoms as a, useTheme} from '#/alf'
 import {QuoteEmbed} from '#/components/Post/Embed'
 
-export function LazyQuoteEmbed({uri}: {uri: string}) {
+export function LazyQuoteEmbed({
+  uri,
+  linkDisabled,
+}: {
+  uri: string
+  linkDisabled?: boolean
+}) {
   const t = useTheme()
   const {data} = useResolveLinkQuery(uri)
 
@@ -21,6 +27,7 @@ export function LazyQuoteEmbed({uri}: {uri: string}) {
         type: 'post',
         view,
       }}
+      linkDisabled={linkDisabled}
     />
   ) : (
     <View

src/components/Post/Embed/index.tsx

@@ -225,11 +225,13 @@ export function QuoteEmbed({
   embed,
   onOpen,
   style,
+  linkDisabled,
   isWithinQuote: parentIsWithinQuote,
   allowNestedQuotes: parentAllowNestedQuotes,
 }: Omit<CommonProps, 'viewContext'> & {
   embed: EmbedType<'post'>
   viewContext?: QuoteEmbedViewContext
+  linkDisabled?: boolean
 }) {
   const moderationOpts = useModerationOpts()
   const quote = useMemo<$Typed<AppBskyFeedDefs.PostView>>(
@@ -280,33 +282,9 @@ export function QuoteEmbed({
     onIn: onPressIn,
     onOut: onPressOut,
   } = useInteractionState()
-  return (
+
-    <View
+  const contents = (
-      style={[a.mt_sm]}
-      onPointerEnter={onPointerEnter}
-      onPointerLeave={onPointerLeave}>
-      <ContentHider
-        modui={moderation?.ui('contentList')}
-        style={[a.rounded_md, a.border, t.atoms.border_contrast_low, style]}
-        activeStyle={[a.p_md, a.pt_sm]}
-        childContainerStyle={[a.pt_sm]}>
-        {({active}) => (
     <>
-            {!active && (
-              <SubtleHover
-                native
-                hover={hover || pressed}
-                style={[a.rounded_md]}
-              />
-            )}
-            <Link
-              style={[!active && a.p_md]}
-              hoverStyle={t.atoms.border_contrast_high}
-              href={itemHref}
-              title={itemTitle}
-              onBeforePress={onBeforePress}
-              onPressIn={onPressIn}
-              onPressOut={onPressOut}>
       <View pointerEvents="none">
         <PostMeta
           author={quote.author}
@@ -317,10 +295,7 @@ export function QuoteEmbed({
         />
       </View>
       {moderation ? (
-                <PostAlerts
+        <PostAlerts modui={moderation.ui('contentView')} style={[a.py_xs]} />
-                  modui={moderation.ui('contentView')}
-                  style={[a.py_xs]}
-                />
       ) : null}
       {richText ? (
         <RichText
@@ -341,7 +316,44 @@ export function QuoteEmbed({
           }
         />
       )}
+    </>
+  )
+
+  return (
+    <View
+      style={[a.mt_sm]}
+      onPointerEnter={linkDisabled ? undefined : onPointerEnter}
+      onPointerLeave={linkDisabled ? undefined : onPointerLeave}>
+      <ContentHider
+        modui={moderation?.ui('contentList')}
+        style={[a.rounded_md, a.border, t.atoms.border_contrast_low, style]}
+        activeStyle={[a.p_md, a.pt_sm]}
+        childContainerStyle={[a.pt_sm]}>
+        {({active}) => (
+          <>
+            {!active && !linkDisabled && (
+              <SubtleHover
+                native
+                hover={hover || pressed}
+                style={[a.rounded_md]}
+              />
+            )}
+            {linkDisabled ? (
+              <View style={[!active && a.p_md]} pointerEvents="none">
+                {contents}
+              </View>
+            ) : (
+              <Link
+                style={[!active && a.p_md]}
+                hoverStyle={t.atoms.border_contrast_high}
+                href={itemHref}
+                title={itemTitle}
+                onBeforePress={onBeforePress}
+                onPressIn={onPressIn}
+                onPressOut={onPressOut}>
+                {contents}
               </Link>
+            )}
           </>
         )}
       </ContentHider>

src/view/com/composer/Composer.tsx

@@ -1725,9 +1725,7 @@ function ComposerEmbeds({
         <View
           style={[a.pb_sm, video ? [a.pt_md] : [a.pt_xl], IS_WEB && [a.pb_md]]}>
           <View style={[a.relative]}>
-            <View style={{pointerEvents: 'none'}}>
+            <LazyQuoteEmbed uri={embed.quote.uri} linkDisabled />
-              <LazyQuoteEmbed uri={embed.quote.uri} />
-            </View>
             {canRemoveQuote && (
               <ExternalEmbedRemoveBtn
                 onRemove={() => dispatch({type: 'embed_remove_quote'})}

src/view/com/composer/ComposerReplyTo.tsx

@@ -132,7 +132,7 @@ export function ComposerReplyTo({replyTo}: {replyTo: ComposerOptsPostRef}) {
           )}
         </View>
         {showFull && parsedQuoteEmbed && parsedQuoteEmbed.type === 'post' && (
-          <QuoteEmbed embed={parsedQuoteEmbed} />
+          <QuoteEmbed embed={parsedQuoteEmbed} linkDisabled />
         )}
       </View>
     </Pressable>