Display non-post embeds in composer preview (#5647)

* Display non-post embeds in composer preview

* Remove starter pack special case from ExternalLinkEmbed

This should not be needed because starter pack composer preview now goes through the record preview codepath, just like in the feed/post view.

* Hide record ext links if quote is present

* Align remove buttons

Remove the implicit top padding in record embeds and make it conditional, which is similar to how we treat external link embeds. This makes the X button appear in the same place for record embeds as with links.

src/view/com/util/post-embeds/ExternalLinkEmbed.tsx

@@ -8,10 +8,6 @@ import {useLingui} from '@lingui/react'
 import {parseAltFromGIFDescription} from '#/lib/gif-alt-text'
 import {shareUrl} from '#/lib/sharing'
 import {parseEmbedPlayerFromUrl} from '#/lib/strings/embed-player'
-import {
-  getStarterPackOgCard,
-  parseStarterPackUri,
-} from '#/lib/strings/starter-pack'
 import {toNiceDomain} from '#/lib/strings/url-helpers'
 import {isNative} from '#/platform/detection'
 import {useExternalEmbedsPrefs} from '#/state/preferences'
@@ -39,10 +35,7 @@ export const ExternalLinkEmbed = ({
   const t = useTheme()
   const externalEmbedPrefs = useExternalEmbedsPrefs()
   const niceUrl = toNiceDomain(link.uri)
-  const starterPackParsed = parseStarterPackUri(link.uri)
-  const imageUri = starterPackParsed
-    ? getStarterPackOgCard(starterPackParsed.name, starterPackParsed.rkey)
-    : link.thumb
+  const imageUri = link.thumb
   const embedPlayerParams = React.useMemo(() => {
     const params = parseEmbedPlayerFromUrl(link.uri)
 

src/view/com/util/post-embeds/index.tsx

@@ -89,17 +89,29 @@ export function PostEmbeds({
   if (AppBskyEmbedRecord.isView(embed)) {
     // custom feed embed (i.e. generator view)
     if (AppBskyFeedDefs.isGeneratorView(embed.record)) {
-      return <MaybeFeedCard view={embed.record} />
+      return (
+        <View style={a.mt_sm}>
+          <MaybeFeedCard view={embed.record} />
+        </View>
+      )
     }
 
     // list embed
     if (AppBskyGraphDefs.isListView(embed.record)) {
-      return <MaybeListCard view={embed.record} />
+      return (
+        <View style={a.mt_sm}>
+          <MaybeListCard view={embed.record} />
+        </View>
+      )
     }
 
     // starter pack embed
     if (AppBskyGraphDefs.isStarterPackViewBasic(embed.record)) {
-      return <StarterPackCard starterPack={embed.record} />
+      return (
+        <View style={a.mt_sm}>
+          <StarterPackCard starterPack={embed.record} />
+        </View>
+      )
     }
 
     // quote post
@@ -203,7 +215,7 @@ export function PostEmbeds({
   return <View />
 }
 
-function MaybeFeedCard({view}: {view: AppBskyFeedDefs.GeneratorView}) {
+export function MaybeFeedCard({view}: {view: AppBskyFeedDefs.GeneratorView}) {
   const pal = usePalette('default')
   const moderationOpts = useModerationOpts()
   const moderation = React.useMemo(() => {
@@ -223,7 +235,7 @@ function MaybeFeedCard({view}: {view: AppBskyFeedDefs.GeneratorView}) {
   )
 }
 
-function MaybeListCard({view}: {view: AppBskyGraphDefs.ListView}) {
+export function MaybeListCard({view}: {view: AppBskyGraphDefs.ListView}) {
   const moderationOpts = useModerationOpts()
   const moderation = React.useMemo(() => {
     return moderationOpts ? moderateUserList(view, moderationOpts) : undefined
@@ -238,7 +250,6 @@ function MaybeListCard({view}: {view: AppBskyGraphDefs.ListView}) {
           t.atoms.border_contrast_medium,
           a.p_md,
           a.rounded_sm,
-          a.mt_sm,
         ]}>
         <ListCard.Default view={view} />
       </View>
@@ -264,7 +275,6 @@ const styles = StyleSheet.create({
   customFeedOuter: {
     borderWidth: StyleSheet.hairlineWidth,
     borderRadius: 8,
-    marginTop: 4,
     paddingHorizontal: 12,
     paddingVertical: 12,
   },