use feedcard for feed post embeds

This commit is contained in:
Samuel Newman
2025-06-27 12:19:47 +03:00
parent 8bddafc492
commit cdc18f125d
3 changed files with 23 additions and 21 deletions
+17 -15
View File
@@ -1,9 +1,9 @@
import React from 'react' import {useMemo} from 'react'
import {moderateFeedGenerator} from '@atproto/api' import {moderateFeedGenerator} from '@atproto/api'
import {useModerationOpts} from '#/state/preferences/moderation-opts' import {useModerationOpts} from '#/state/preferences/moderation-opts'
import {FeedSourceCard} from '#/view/com/feeds/FeedSourceCard'
import {atoms as a, useTheme} from '#/alf' import {atoms as a, useTheme} from '#/alf'
import * as FeedCard from '#/components/FeedCard'
import {ContentHider} from '#/components/moderation/ContentHider' import {ContentHider} from '#/components/moderation/ContentHider'
import {type EmbedType} from '#/types/bsky/post' import {type EmbedType} from '#/types/bsky/post'
import {type CommonProps} from './types' import {type CommonProps} from './types'
@@ -15,18 +15,20 @@ export function FeedEmbed({
}) { }) {
const t = useTheme() const t = useTheme()
return ( return (
<FeedSourceCard <FeedCard.Link
feedUri={embed.view.uri} view={embed.view}
feedData={embed.view} style={[a.border, t.atoms.border_contrast_medium, a.p_md, a.rounded_sm]}>
style={[ <FeedCard.Outer>
t.atoms.bg, <FeedCard.Header>
t.atoms.border_contrast_low, <FeedCard.Avatar src={embed.view.avatar} />
a.p_md, <FeedCard.TitleAndByline
a.rounded_sm, title={embed.view.displayName}
a.border, creator={embed.view.creator}
]} />
showLikes </FeedCard.Header>
/> <FeedCard.Likes count={embed.view.likeCount || 0} />
</FeedCard.Outer>
</FeedCard.Link>
) )
} }
@@ -36,7 +38,7 @@ export function ModeratedFeedEmbed({
embed: EmbedType<'feed'> embed: EmbedType<'feed'>
}) { }) {
const moderationOpts = useModerationOpts() const moderationOpts = useModerationOpts()
const moderation = React.useMemo(() => { const moderation = useMemo(() => {
return moderationOpts return moderationOpts
? moderateFeedGenerator(embed.view, moderationOpts) ? moderateFeedGenerator(embed.view, moderationOpts)
: undefined : undefined
+2 -2
View File
@@ -1,4 +1,4 @@
import React from 'react' import {useMemo} from 'react'
import {moderateUserList} from '@atproto/api' import {moderateUserList} from '@atproto/api'
import {useModerationOpts} from '#/state/preferences/moderation-opts' import {useModerationOpts} from '#/state/preferences/moderation-opts'
@@ -28,7 +28,7 @@ export function ModeratedListEmbed({
embed: EmbedType<'list'> embed: EmbedType<'list'>
}) { }) {
const moderationOpts = useModerationOpts() const moderationOpts = useModerationOpts()
const moderation = React.useMemo(() => { const moderation = useMemo(() => {
return moderationOpts return moderationOpts
? moderateUserList(embed.view, moderationOpts) ? moderateUserList(embed.view, moderationOpts)
: undefined : undefined
+4 -4
View File
@@ -152,15 +152,15 @@ export function FeedSourceCardLoaded({
<View style={[a.mr_md]}> <View style={[a.mr_md]}>
<UserAvatar type="algo" size={36} avatar={feed.avatar} /> <UserAvatar type="algo" size={36} avatar={feed.avatar} />
</View> </View>
<View style={[a.flex_1, a.gap_xs]}> <View style={[a.flex_1]}>
<Text <Text
emoji emoji
style={[a.text_md, a.font_bold, a.leading_tight]} style={[a.text_sm, a.font_bold, a.leading_snug]}
numberOfLines={1}> numberOfLines={1}>
{feed.displayName} {feed.displayName}
</Text> </Text>
<Text <Text
style={[a.text_sm, t.atoms.text_contrast_medium, a.leading_tight]} style={[a.text_sm, t.atoms.text_contrast_medium, a.leading_snug]}
numberOfLines={1}> numberOfLines={1}>
{feed.type === 'feed' ? ( {feed.type === 'feed' ? (
<Trans>Feed by {sanitizeHandle(feed.creatorHandle, '@')}</Trans> <Trans>Feed by {sanitizeHandle(feed.creatorHandle, '@')}</Trans>
@@ -185,7 +185,7 @@ export function FeedSourceCardLoaded({
a.text_sm, a.text_sm,
a.font_bold, a.font_bold,
t.atoms.text_contrast_medium, t.atoms.text_contrast_medium,
a.leading_tight, a.leading_snug,
]}> ]}>
<Trans> <Trans>
Liked by{' '} Liked by{' '}