Explore feed cards (#4521)

* Replace FeedSourceCard on Explore page

(cherry picked from commit e7e9787bfaa9368bfaeaaa4ca144ab77b438219c)

* Replace FeedSourceCard on Search page

(cherry picked from commit ac47aade7622d359eee9509763cda666d964d8a3)
zio/stable
Eric Bailey 2024-06-17 13:56:11 -05:00 committed by GitHub
parent 7e88d0d7a6
commit 077da08309
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 22 additions and 23 deletions

View File

@ -16,18 +16,17 @@ import {useModerationOpts} from '#/state/preferences/moderation-opts'
import {useGetPopularFeedsQuery} from '#/state/queries/feed' import {useGetPopularFeedsQuery} from '#/state/queries/feed'
import {usePreferencesQuery} from '#/state/queries/preferences' import {usePreferencesQuery} from '#/state/queries/preferences'
import {useSuggestedFollowsQuery} from '#/state/queries/suggested-follows' import {useSuggestedFollowsQuery} from '#/state/queries/suggested-follows'
import {useSession} from '#/state/session'
import {cleanError} from 'lib/strings/errors' import {cleanError} from 'lib/strings/errors'
import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard' import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard'
import {List} from '#/view/com/util/List' import {List} from '#/view/com/util/List'
import {UserAvatar} from '#/view/com/util/UserAvatar' import {UserAvatar} from '#/view/com/util/UserAvatar'
import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard'
import { import {
FeedFeedLoadingPlaceholder, FeedFeedLoadingPlaceholder,
ProfileCardFeedLoadingPlaceholder, ProfileCardFeedLoadingPlaceholder,
} from 'view/com/util/LoadingPlaceholder' } from 'view/com/util/LoadingPlaceholder'
import {atoms as a, useTheme, ViewStyleProp} from '#/alf' import {atoms as a, useTheme, ViewStyleProp} from '#/alf'
import {Button} from '#/components/Button' import {Button} from '#/components/Button'
import * as FeedCard from '#/components/FeedCard'
import {ArrowBottom_Stroke2_Corner0_Rounded as ArrowBottom} from '#/components/icons/Arrow' import {ArrowBottom_Stroke2_Corner0_Rounded as ArrowBottom} from '#/components/icons/Arrow'
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
import {Props as SVGIconProps} from '#/components/icons/common' import {Props as SVGIconProps} from '#/components/icons/common'
@ -271,7 +270,6 @@ type ExploreScreenItems =
export function Explore() { export function Explore() {
const {_} = useLingui() const {_} = useLingui()
const t = useTheme() const t = useTheme()
const {hasSession} = useSession()
const {data: preferences, error: preferencesError} = usePreferencesQuery() const {data: preferences, error: preferencesError} = usePreferencesQuery()
const moderationOpts = useModerationOpts() const moderationOpts = useModerationOpts()
const { const {
@ -480,15 +478,14 @@ export function Explore() {
} }
case 'feed': { case 'feed': {
return ( return (
<View style={[a.border_b, t.atoms.border_contrast_low]}> <View
<FeedSourceCard style={[
feedUri={item.feed.uri} a.border_b,
showSaveBtn={hasSession} t.atoms.border_contrast_low,
showDescription a.px_lg,
showLikes a.py_lg,
pinOnSave ]}>
hideTopBorder <FeedCard.Default feed={item.feed} />
/>
</View> </View>
) )
} }
@ -538,7 +535,7 @@ export function Explore() {
} }
} }
}, },
[t, hasSession, moderationOpts], [t, moderationOpts],
) )
return ( return (

View File

@ -57,8 +57,8 @@ import {Text} from '#/view/com/util/text/Text'
import {CenteredView, ScrollView} from '#/view/com/util/Views' import {CenteredView, ScrollView} from '#/view/com/util/Views'
import {Explore} from '#/view/screens/Search/Explore' import {Explore} from '#/view/screens/Search/Explore'
import {SearchLinkCard, SearchProfileCard} from '#/view/shell/desktop/Search' import {SearchLinkCard, SearchProfileCard} from '#/view/shell/desktop/Search'
import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' import {atoms as a, useTheme as useThemeNew} from '#/alf'
import {atoms as a} from '#/alf' import * as FeedCard from '#/components/FeedCard'
import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu' import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu'
function Loader() { function Loader() {
@ -285,8 +285,8 @@ let SearchScreenFeedsResults = ({
query: string query: string
active: boolean active: boolean
}): React.ReactNode => { }): React.ReactNode => {
const t = useThemeNew()
const {_} = useLingui() const {_} = useLingui()
const {hasSession} = useSession()
const {data: results, isFetched} = usePopularFeedsSearch({ const {data: results, isFetched} = usePopularFeedsSearch({
query, query,
@ -299,13 +299,15 @@ let SearchScreenFeedsResults = ({
<List <List
data={results} data={results}
renderItem={({item}) => ( renderItem={({item}) => (
<FeedSourceCard <View
feedUri={item.uri} style={[
showSaveBtn={hasSession} a.border_b,
showDescription t.atoms.border_contrast_low,
showLikes a.px_lg,
pinOnSave a.py_lg,
/> ]}>
<FeedCard.Default feed={item} />
</View>
)} )}
keyExtractor={item => item.uri} keyExtractor={item => item.uri}
// @ts-ignore web only -prf // @ts-ignore web only -prf