diff --git a/src/components/FeedInterstitials.tsx b/src/components/FeedInterstitials.tsx
index 9f1505cc98..268a5ff5b8 100644
--- a/src/components/FeedInterstitials.tsx
+++ b/src/components/FeedInterstitials.tsx
@@ -18,16 +18,14 @@ import * as userActionHistory from '#/state/userActionHistory'
import {SeenPost} from '#/state/userActionHistory'
import {BlockDrawerGesture} from '#/view/shell/BlockDrawerGesture'
import {atoms as a, useBreakpoints, useTheme, ViewStyleProp, web} from '#/alf'
-import {Button, ButtonIcon, ButtonText} from '#/components/Button'
+import {Button} from '#/components/Button'
import * as FeedCard from '#/components/FeedCard'
-import {ArrowRight_Stroke2_Corner0_Rounded as ArrowRightIcon} from '#/components/icons/Arrow'
import {ArrowRight_Stroke2_Corner0_Rounded as Arrow} from '#/components/icons/Arrow'
import {Hashtag_Stroke2_Corner0_Rounded as Hashtag} from '#/components/icons/Hashtag'
import {PersonPlus_Stroke2_Corner0_Rounded as Person} from '#/components/icons/Person'
-import {InlineLinkText, Link} from '#/components/Link'
+import {InlineLinkText} from '#/components/Link'
import * as ProfileCard from '#/components/ProfileCard'
import {Text} from '#/components/Typography'
-import {LinearGradientBackground} from './LinearGradientBackground'
import {ProgressGuideList} from './ProgressGuide/List'
const MOBILE_CARD_WIDTH = 300
@@ -520,43 +518,3 @@ export function ProgressGuide() {
)
}
-
-export function VideoModeEntranceInterstitial() {
- const {_} = useLingui()
- const t = useTheme()
-
- return (
-
-
-
-
- NEW!
- {' '}
- Scroll this feed in video mode
-
-
-
- Start watching
-
-
-
-
-
- )
-}
diff --git a/src/components/VideoPostCard.tsx b/src/components/VideoPostCard.tsx
index 401771dd1b..c8072464df 100644
--- a/src/components/VideoPostCard.tsx
+++ b/src/components/VideoPostCard.tsx
@@ -1,7 +1,7 @@
import {View} from 'react-native'
import {Image} from 'expo-image'
import {LinearGradient} from 'expo-linear-gradient'
-import {AppBskyEmbedVideo, AppBskyFeedDefs} from '@atproto/api'
+import {AppBskyEmbedVideo, AppBskyFeedDefs, AppBskyFeedPost} from '@atproto/api'
import {msg} from '@lingui/macro'
import {useLingui} from '@lingui/react'
@@ -16,6 +16,7 @@ import {useInteractionState} from '#/components/hooks/useInteractionState'
import {Heart2_Stroke2_Corner0_Rounded as Heart} from '#/components/icons/Heart2'
import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost'
import {Link} from '#/components/Link'
+import {MediaInsetBorder} from '#/components/MediaInsetBorder'
import {Text} from '#/components/Typography'
export function VideoPostCard({
@@ -29,9 +30,9 @@ export function VideoPostCard({
const {_, i18n} = useLingui()
const embed = post.embed
const {
- state: hovered,
- onIn: onHoverIn,
- onOut: onHoverOut,
+ state: pressed,
+ onIn: onPressIn,
+ onOut: onPressOut,
} = useInteractionState()
/**
@@ -40,9 +41,12 @@ export function VideoPostCard({
*/
if (!AppBskyEmbedVideo.isView(embed)) return null
+ const text = AppBskyFeedPost.isRecord(post.record) ? post.record?.text : ''
+ const likeCount = post?.likeCount ?? 0
+ const repostCount = post?.repostCount ?? 0
const {thumbnail} = embed
const black = select(t.name, {
- light: t.atoms.bg_contrast_25.backgroundColor,
+ light: t.palette.black,
dark: t.atoms.bg_contrast_25.backgroundColor,
dim: `hsl(${BLUE_HUE}, 28%, 6%)`,
})
@@ -57,8 +61,8 @@ export function VideoPostCard({
postUri: post.uri,
},
}}
- onHoverIn={onHoverIn}
- onHoverOut={onHoverOut}
+ onPressIn={onPressIn}
+ onPressOut={onPressOut}
style={[
a.flex_col,
{
@@ -69,7 +73,7 @@ export function VideoPostCard({
+
-
-
-
-
-
- {formatCount(i18n, post.likeCount || 0)}
-
-
-
-
-
- {formatCount(i18n, post.repostCount || 0)}
-
-
+ {likeCount > 0 && (
+
+
+
+ {formatCount(i18n, likeCount)}
+
+
+ )}
+ {repostCount > 0 && (
+
+
+
+ {formatCount(i18n, repostCount)}
+
+
+ )}
-
-
-
- {sanitizeHandle(post.author.handle, '@')}
-
+
+ {text && (
+
+ {text}
+
+ )}
+
+
+
+ {sanitizeHandle(post.author.handle, '@')}
+
+
)
diff --git a/src/components/feeds/PostFeedVideoGridRow.tsx b/src/components/feeds/PostFeedVideoGridRow.tsx
index 11fa84eb73..222290377b 100644
--- a/src/components/feeds/PostFeedVideoGridRow.tsx
+++ b/src/components/feeds/PostFeedVideoGridRow.tsx
@@ -25,7 +25,7 @@ export function PostFeedVideoGridRow({
return (
-
+
{posts.map(post => (
diff --git a/src/view/com/posts/PostFeed.tsx b/src/view/com/posts/PostFeed.tsx
index 7844fb40b8..8325756f7c 100644
--- a/src/view/com/posts/PostFeed.tsx
+++ b/src/view/com/posts/PostFeed.tsx
@@ -44,11 +44,7 @@ import {List, ListRef} from '#/view/com/util/List'
import {PostFeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
import {LoadMoreRetryBtn} from '#/view/com/util/LoadMoreRetryBtn'
import {useBreakpoints} from '#/alf'
-import {
- ProgressGuide,
- SuggestedFollows,
- VideoModeEntranceInterstitial,
-} from '#/components/FeedInterstitials'
+import {ProgressGuide, SuggestedFollows} from '#/components/FeedInterstitials'
import {PostFeedVideoGridRow} from '#/components/feeds/PostFeedVideoGridRow'
import {TrendingInterstitial} from '#/components/interstitials/Trending'
import {DiscoverFallbackHeader} from './DiscoverFallbackHeader'
@@ -113,10 +109,6 @@ type FeedRow =
type: 'interstitialTrending'
key: string
}
- | {
- type: 'videoModeEntrance'
- key: string
- }
export function getFeedPostSlice(feedRow: FeedRow): FeedPostSlice | null {
if (feedRow.type === 'sliceItem') {
@@ -327,13 +319,6 @@ let PostFeed = ({
let sliceIndex = -1
for (const page of data?.pages) {
if (feedKind === 'thevids' && isNative) {
- if (sliceIndex === -1) {
- arr.push({
- type: 'videoModeEntrance',
- key: 'videoModeEntrance',
- })
- }
-
const rows: FeedPostSliceItem[][] = []
for (let i = 0; i < page.slices.length; i++) {
const slice = page.slices[i]
@@ -560,8 +545,6 @@ let PostFeed = ({
return
} else if (row.type === 'interstitialTrending') {
return
- } else if (row.type === 'videoModeEntrance') {
- return
} else if (row.type === 'sliceItem') {
const slice = row.slice
if (slice.isFallbackMarker) {