diff --git a/src/view/screens/Feeds.tsx b/src/view/screens/Feeds.tsx index edebd1811e..23091a3f55 100644 --- a/src/view/screens/Feeds.tsx +++ b/src/view/screens/Feeds.tsx @@ -1,6 +1,10 @@ import React from 'react' import {ActivityIndicator, type FlatList, StyleSheet, View} from 'react-native' -import {AppBskyFeedDefs} from '@atproto/api' +import { + AppBskyFeedDefs, + moderateFeedGenerator, + ModerationDecision, +} from '@atproto/api' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import {useFocusEffect} from '@react-navigation/native' @@ -38,6 +42,7 @@ import {FilterTimeline_Stroke2_Corner0_Rounded as FilterTimeline} from '#/compon import {ListMagnifyingGlass_Stroke2_Corner0_Rounded} from '#/components/icons/ListMagnifyingGlass' import {ListSparkle_Stroke2_Corner0_Rounded} from '#/components/icons/ListSparkle' import hairlineWidth = StyleSheet.hairlineWidth +import {useModerationOpts} from '#/state/preferences/moderation-opts' import {Divider} from '#/components/Divider' import * as FeedCard from '#/components/FeedCard' import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRight} from '#/components/icons/Chevron' @@ -89,6 +94,7 @@ type FlatlistSlice = key: string feedUri: string feed: AppBskyFeedDefs.GeneratorView + moderation: ModerationDecision } | { type: 'popularFeedsLoadingMore' @@ -101,6 +107,7 @@ type FlatlistSlice = export function FeedsScreen(_props: Props) { const pal = usePalette('default') + const moderationOpts = useModerationOpts() const {openComposer} = useComposerControls() const {isMobile, isTabletOrDesktop} = useWebMediaQueries() const [query, setQuery] = React.useState('') @@ -300,7 +307,7 @@ export function FeedsScreen(_props: Props) { }) } else { if (isUserSearching) { - if (isSearchPending || !searchResults) { + if (isSearchPending || !searchResults || !moderationOpts) { slices.push({ key: 'popularFeedsLoading', type: 'popularFeedsLoading', @@ -313,19 +320,30 @@ export function FeedsScreen(_props: Props) { }) } else { slices = slices.concat( - searchResults.map(feed => { - return { - key: `popularFeed:${feed.uri}`, - type: 'popularFeed', - feedUri: feed.uri, - feed, - } - }), + searchResults + .map(feed => { + const moderation = moderateFeedGenerator( + feed, + moderationOpts, + ) + const slice: FlatlistSlice = { + key: `popularFeed:${feed.uri}`, + type: 'popularFeed', + feedUri: feed.uri, + feed, + moderation, + } + return slice + }) + .filter(i => !i.moderation.ui('contentList').filter), ) } } } else { - if (isPopularFeedsFetching && !popularFeeds?.pages) { + if ( + (isPopularFeedsFetching && !popularFeeds?.pages) || + !moderationOpts + ) { slices.push({ key: 'popularFeedsLoading', type: 'popularFeedsLoading', @@ -339,14 +357,22 @@ export function FeedsScreen(_props: Props) { } else { for (const page of popularFeeds.pages || []) { slices = slices.concat( - page.feeds.map(feed => { - return { - key: `popularFeed:${feed.uri}`, - type: 'popularFeed', - feedUri: feed.uri, - feed, - } - }), + page.feeds + .map(feed => { + const moderation = moderateFeedGenerator( + feed, + moderationOpts, + ) + const slice: FlatlistSlice = { + key: `popularFeed:${feed.uri}`, + type: 'popularFeed', + feedUri: feed.uri, + feed, + moderation, + } + return slice + }) + .filter(i => !i.moderation.ui('contentList').filter), ) } @@ -376,6 +402,7 @@ export function FeedsScreen(_props: Props) { isSearchPending, searchError, isUserSearching, + moderationOpts, ]) const renderHeaderBtn = React.useCallback(() => { @@ -500,7 +527,7 @@ export function FeedsScreen(_props: Props) { } else if (item.type === 'popularFeed') { return ( - + )