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
parent
7e88d0d7a6
commit
077da08309
|
@ -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 (
|
||||||
|
|
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue