3 files changed, 92 insertions, 34 deletions
diff --git a/src/view/com/util/post-embeds/CustomFeedEmbed.tsx b/src/view/com/util/post-embeds/CustomFeedEmbed.tsx
new file mode 100644
index 000000000..5abdf2f77
--- /dev/null
+++ b/src/view/com/util/post-embeds/CustomFeedEmbed.tsx
@@ -0,0 +1,37 @@
+import React, {useMemo} from 'react'
+import {AppBskyFeedDefs} from '@atproto/api'
+import {usePalette} from 'lib/hooks/usePalette'
+import {StyleSheet} from 'react-native'
+import {useStores} from 'state/index'
+import {CustomFeedModel} from 'state/models/feeds/custom-feed'
+import {CustomFeed} from 'view/com/feeds/CustomFeed'
+
+export function CustomFeedEmbed({
+  record,
+}: {
+  record: AppBskyFeedDefs.GeneratorView
+}) {
+  const pal = usePalette('default')
+  const store = useStores()
+  const item = useMemo(
+    () => new CustomFeedModel(store, record),
+    [store, record],
+  )
+  return (
+    <CustomFeed
+      item={item}
+      style={[pal.view, pal.border, styles.customFeedOuter]}
+      showLikes
+    />
+  )
+}
+
+const styles = StyleSheet.create({
+  customFeedOuter: {
+    borderWidth: 1,
+    borderRadius: 8,
+    marginTop: 4,
+    paddingHorizontal: 12,
+    paddingVertical: 12,
+  },
+})
diff --git a/src/view/com/util/post-embeds/ListEmbed.tsx b/src/view/com/util/post-embeds/ListEmbed.tsx
new file mode 100644
index 000000000..6f40b3e1a
--- /dev/null
+++ b/src/view/com/util/post-embeds/ListEmbed.tsx
@@ -0,0 +1,35 @@
+import React from 'react'
+import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native'
+import {usePalette} from 'lib/hooks/usePalette'
+import {observer} from 'mobx-react-lite'
+import {ListCard} from 'view/com/lists/ListCard'
+import {AppBskyGraphDefs} from '@atproto/api'
+import {s} from 'lib/styles'
+
+export const ListEmbed = observer(
+  ({
+    item,
+    style,
+  }: {
+    item: AppBskyGraphDefs.ListView
+    style?: StyleProp<ViewStyle>
+  }) => {
+    const pal = usePalette('default')
+
+    return (
+      <View style={[pal.view, pal.border, s.border1, styles.container]}>
+        <ListCard list={item} style={[style, styles.card]} />
+      </View>
+    )
+  },
+)
+
+const styles = StyleSheet.create({
+  container: {
+    borderRadius: 8,
+  },
+  card: {
+    borderTopWidth: 0,
+    borderRadius: 8,
+  },
+})
diff --git a/src/view/com/util/post-embeds/index.tsx b/src/view/com/util/post-embeds/index.tsx
index 8156d7732..53ef17318 100644
--- a/src/view/com/util/post-embeds/index.tsx
+++ b/src/view/com/util/post-embeds/index.tsx
@@ -14,6 +14,7 @@ import {
   AppBskyEmbedRecordWithMedia,
   AppBskyFeedPost,
   AppBskyFeedDefs,
+  AppBskyGraphDefs,
 } from '@atproto/api'
 import {Link} from '../Link'
 import {ImageLayoutGrid} from '../images/ImageLayoutGrid'
@@ -25,8 +26,8 @@ import {ExternalLinkEmbed} from './ExternalLinkEmbed'
 import {getYoutubeVideoId} from 'lib/strings/url-helpers'
 import QuoteEmbed from './QuoteEmbed'
 import {AutoSizedImage} from '../images/AutoSizedImage'
-import {CustomFeed} from 'view/com/feeds/CustomFeed'
-import {CustomFeedModel} from 'state/models/feeds/custom-feed'
+import {CustomFeedEmbed} from './CustomFeedEmbed'
+import {ListEmbed} from './ListEmbed'
 
 type Embed =
   | AppBskyEmbedRecord.View
@@ -144,6 +145,23 @@ export function PostEmbeds({
     }
   }
 
+  // custom feed embed (i.e. generator view)
+  // =
+  if (
+    AppBskyEmbedRecord.isView(embed) &&
+    AppBskyFeedDefs.isGeneratorView(embed.record)
+  ) {
+    return <CustomFeedEmbed record={embed.record} />
+  }
+
+  // list embed (e.g. mute lists; i.e. ListView)
+  if (
+    AppBskyEmbedRecord.isView(embed) &&
+    AppBskyGraphDefs.isListView(embed.record)
+  ) {
+    return <ListEmbed item={embed.record} />
+  }
+
   // external link embed
   // =
   if (AppBskyEmbedExternal.isView(embed)) {
@@ -164,34 +182,9 @@ export function PostEmbeds({
     )
   }
 
-  // custom feed embed (i.e. generator view)
-  // =
-  if (
-    AppBskyEmbedRecord.isView(embed) &&
-    AppBskyFeedDefs.isGeneratorView(embed.record)
-  ) {
-    return <CustomFeedEmbed record={embed.record} />
-  }
-
   return <View />
 }
 
-function CustomFeedEmbed({record}: {record: AppBskyFeedDefs.GeneratorView}) {
-  const pal = usePalette('default')
-  const store = useStores()
-  const item = React.useMemo(
-    () => new CustomFeedModel(store, record),
-    [store, record],
-  )
-  return (
-    <CustomFeed
-      item={item}
-      style={[pal.view, pal.border, styles.customFeedOuter]}
-      showLikes
-    />
-  )
-}
-
 const styles = StyleSheet.create({
   stackContainer: {
     gap: 6,
@@ -208,13 +201,6 @@ const styles = StyleSheet.create({
     borderRadius: 8,
     marginTop: 4,
   },
-  customFeedOuter: {
-    borderWidth: 1,
-    borderRadius: 8,
-    marginTop: 4,
-    paddingHorizontal: 12,
-    paddingVertical: 12,
-  },
   alt: {
     backgroundColor: 'rgba(0, 0, 0, 0.75)',
     borderRadius: 6,