Respect labels on feeds and lists (#4818)

* Prep

* Pass in optional moderation to FeedCard

* Compute moderation decision, filter contentList contexts, pass into card

* Let's go a different route

* Filter from within search queries

* Use same search query for starter packs

* Filter lists from profile tabs

* Cleanup

* Filter from profile feeds

* Moderate post embeds

* Memoize

* Use ScreenHider on lists

* Hide both list types

* Fix crash on iOS in screen hider, fix lineheight

* Memoize renderItem

* Reuse objects to prevent re-renders

3 files changed, 83 insertions, 59 deletions

diff --git a/src/view/com/feeds/ProfileFeedgens.tsx b/src/view/com/feeds/ProfileFeedgens.tsx
index 831ab4d1d..6f98cc49a 100644
--- a/src/view/com/feeds/ProfileFeedgens.tsx
+++ b/src/view/com/feeds/ProfileFeedgens.tsx
@@ -129,46 +129,49 @@ export const ProfileFeedgens = React.forwardRef<
   // rendering
   // =
 
-  const renderItem = ({item, index}: ListRenderItemInfo<any>) => {
-    if (item === EMPTY) {
-      return (
-        <EmptyState
-          icon="hashtag"
-          message={_(msg`You have no feeds.`)}
-          testID="listsEmpty"
-        />
-      )
-    } else if (item === ERROR_ITEM) {
-      return (
-        <ErrorMessage message={cleanError(error)} onPressTryAgain={refetch} />
-      )
-    } else if (item === LOAD_MORE_ERROR_ITEM) {
-      return (
-        <LoadMoreRetryBtn
-          label={_(
-            msg`There was an issue fetching your lists. Tap here to try again.`,
-          )}
-          onPress={onPressRetryLoadMore}
-        />
-      )
-    } else if (item === LOADING) {
-      return <FeedLoadingPlaceholder />
-    }
-    if (preferences) {
-      return (
-        <View
-          style={[
-            (index !== 0 || isWeb) && a.border_t,
-            t.atoms.border_contrast_low,
-            a.px_lg,
-            a.py_lg,
-          ]}>
-          <FeedCard.Default view={item} />
-        </View>
-      )
-    }
-    return null
-  }
+  const renderItem = React.useCallback(
+    ({item, index}: ListRenderItemInfo<any>) => {
+      if (item === EMPTY) {
+        return (
+          <EmptyState
+            icon="hashtag"
+            message={_(msg`You have no feeds.`)}
+            testID="listsEmpty"
+          />
+        )
+      } else if (item === ERROR_ITEM) {
+        return (
+          <ErrorMessage message={cleanError(error)} onPressTryAgain={refetch} />
+        )
+      } else if (item === LOAD_MORE_ERROR_ITEM) {
+        return (
+          <LoadMoreRetryBtn
+            label={_(
+              msg`There was an issue fetching your lists. Tap here to try again.`,
+            )}
+            onPress={onPressRetryLoadMore}
+          />
+        )
+      } else if (item === LOADING) {
+        return <FeedLoadingPlaceholder />
+      }
+      if (preferences) {
+        return (
+          <View
+            style={[
+              (index !== 0 || isWeb) && a.border_t,
+              t.atoms.border_contrast_low,
+              a.px_lg,
+              a.py_lg,
+            ]}>
+            <FeedCard.Default view={item} />
+          </View>
+        )
+      }
+      return null
+    },
+    [_, t, error, refetch, onPressRetryLoadMore, preferences],
+  )
 
   React.useEffect(() => {
     if (enabled && scrollElRef.current) {
diff --git a/src/view/com/lists/ProfileLists.tsx b/src/view/com/lists/ProfileLists.tsx
index dc385d436..f633774c7 100644
--- a/src/view/com/lists/ProfileLists.tsx
+++ b/src/view/com/lists/ProfileLists.tsx
@@ -75,12 +75,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>(
         items = items.concat([EMPTY])
       } else if (data?.pages) {
         for (const page of data?.pages) {
-          items = items.concat(
-            page.lists.map(l => ({
-              ...l,
-              _reactKey: l.uri,
-            })),
-          )
+          items = items.concat(page.lists)
         }
       }
       if (isError && !isEmpty) {
@@ -192,7 +187,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>(
           testID={testID ? `${testID}-flatlist` : undefined}
           ref={scrollElRef}
           data={items}
-          keyExtractor={(item: any) => item._reactKey}
+          keyExtractor={(item: any) => item._reactKey || item.uri}
           renderItem={renderItemInner}
           refreshing={isPTRing}
           onRefresh={onRefresh}
diff --git a/src/view/com/util/post-embeds/index.tsx b/src/view/com/util/post-embeds/index.tsx
index a0dc94e4d..0462212fb 100644
--- a/src/view/com/util/post-embeds/index.tsx
+++ b/src/view/com/util/post-embeds/index.tsx
@@ -15,11 +15,14 @@ import {
   AppBskyEmbedRecordWithMedia,
   AppBskyFeedDefs,
   AppBskyGraphDefs,
+  moderateFeedGenerator,
+  moderateUserList,
   ModerationDecision,
 } from '@atproto/api'
 
 import {ImagesLightbox, useLightboxControls} from '#/state/lightbox'
 import {useLargeAltBadgeEnabled} from '#/state/preferences/large-alt-badge'
+import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {usePalette} from 'lib/hooks/usePalette'
 import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard'
 import {atoms as a} from '#/alf'
@@ -51,7 +54,6 @@ export function PostEmbeds({
   style?: StyleProp<ViewStyle>
   allowNestedQuotes?: boolean
 }) {
-  const pal = usePalette('default')
   const {openLightbox} = useLightboxControls()
   const largeAltBadge = useLargeAltBadgeEnabled()
 
@@ -72,22 +74,13 @@ export function PostEmbeds({
 
   if (AppBskyEmbedRecord.isView(embed)) {
     // custom feed embed (i.e. generator view)
-    // =
     if (AppBskyFeedDefs.isGeneratorView(embed.record)) {
-      // TODO moderation
-      return (
-        <FeedSourceCard
-          feedUri={embed.record.uri}
-          style={[pal.view, pal.border, styles.customFeedOuter]}
-          showLikes
-        />
-      )
+      return <MaybeFeedCard view={embed.record} />
     }
 
     // list embed
     if (AppBskyGraphDefs.isListView(embed.record)) {
-      // TODO moderation
-      return <ListEmbed item={embed.record} />
+      return <MaybeListCard view={embed.record} />
     }
 
     if (AppBskyGraphDefs.isStarterPackViewBasic(embed.record)) {
@@ -185,6 +178,39 @@ export function PostEmbeds({
   return <View />
 }
 
+function MaybeFeedCard({view}: {view: AppBskyFeedDefs.GeneratorView}) {
+  const pal = usePalette('default')
+  const moderationOpts = useModerationOpts()
+  const moderation = React.useMemo(() => {
+    return moderationOpts
+      ? moderateFeedGenerator(view, moderationOpts)
+      : undefined
+  }, [view, moderationOpts])
+
+  return (
+    <ContentHider modui={moderation?.ui('contentList')}>
+      <FeedSourceCard
+        feedUri={view.uri}
+        style={[pal.view, pal.border, styles.customFeedOuter]}
+        showLikes
+      />
+    </ContentHider>
+  )
+}
+
+function MaybeListCard({view}: {view: AppBskyGraphDefs.ListView}) {
+  const moderationOpts = useModerationOpts()
+  const moderation = React.useMemo(() => {
+    return moderationOpts ? moderateUserList(view, moderationOpts) : undefined
+  }, [view, moderationOpts])
+
+  return (
+    <ContentHider modui={moderation?.ui('contentList')}>
+      <ListEmbed item={view} />
+    </ContentHider>
+  )
+}
+
 const styles = StyleSheet.create({
   container: {
     marginTop: 8,