Minor video feed refactor (#7536)
* Remove useless TS checks * Remove default argument
This commit is contained in:
@@ -165,6 +165,7 @@ type CurrentSource = {
|
|||||||
type VideoItem = {
|
type VideoItem = {
|
||||||
moderation: ModerationDecision
|
moderation: ModerationDecision
|
||||||
post: AppBskyFeedDefs.PostView
|
post: AppBskyFeedDefs.PostView
|
||||||
|
video: AppBskyEmbedVideo.View
|
||||||
feedContext: string | undefined
|
feedContext: string | undefined
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -197,30 +198,30 @@ function Feed() {
|
|||||||
|
|
||||||
const videos = useMemo(() => {
|
const videos = useMemo(() => {
|
||||||
let vids =
|
let vids =
|
||||||
data?.pages
|
data?.pages.flatMap(page => {
|
||||||
.flatMap(page => {
|
const items: {
|
||||||
const items: {
|
_reactKey: string
|
||||||
_reactKey: string
|
moderation: ModerationDecision
|
||||||
moderation: ModerationDecision
|
post: AppBskyFeedDefs.PostView
|
||||||
post: AppBskyFeedDefs.PostView
|
video: AppBskyEmbedVideo.View
|
||||||
feedContext: string | undefined
|
feedContext: string | undefined
|
||||||
}[] = []
|
}[] = []
|
||||||
for (const slice of page.slices) {
|
for (const slice of page.slices) {
|
||||||
const feedPost = slice.items.find(
|
const feedPost = slice.items.find(
|
||||||
item => item.uri === slice.feedPostUri,
|
item => item.uri === slice.feedPostUri,
|
||||||
)
|
)
|
||||||
if (feedPost) {
|
if (feedPost && AppBskyEmbedVideo.isView(feedPost.post.embed)) {
|
||||||
items.push({
|
items.push({
|
||||||
_reactKey: feedPost._reactKey,
|
_reactKey: feedPost._reactKey,
|
||||||
moderation: feedPost.moderation,
|
moderation: feedPost.moderation,
|
||||||
post: feedPost.post,
|
post: feedPost.post,
|
||||||
feedContext: slice.feedContext,
|
video: feedPost.post.embed,
|
||||||
})
|
feedContext: slice.feedContext,
|
||||||
}
|
})
|
||||||
}
|
}
|
||||||
return items
|
}
|
||||||
})
|
return items
|
||||||
.filter(item => AppBskyEmbedVideo.isView(item.post.embed)) || []
|
}) ?? []
|
||||||
const startingVideoIndex = vids?.findIndex(video => {
|
const startingVideoIndex = vids?.findIndex(video => {
|
||||||
return video.post.uri === params.initialPostUri
|
return video.post.uri === params.initialPostUri
|
||||||
})
|
})
|
||||||
@@ -244,13 +245,7 @@ function Feed() {
|
|||||||
|
|
||||||
const renderItem: ListRenderItem<VideoItem> = useCallback(
|
const renderItem: ListRenderItem<VideoItem> = useCallback(
|
||||||
({item, index}) => {
|
({item, index}) => {
|
||||||
const {post} = item
|
const {post, video} = item
|
||||||
|
|
||||||
// filtered above, here for TS
|
|
||||||
if (!post.embed || !AppBskyEmbedVideo.isView(post.embed)) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
const player = players?.[index % 3]
|
const player = players?.[index % 3]
|
||||||
const currentSource = currentSources[index % 3]
|
const currentSource = currentSources[index % 3]
|
||||||
|
|
||||||
@@ -258,11 +253,11 @@ function Feed() {
|
|||||||
<VideoItem
|
<VideoItem
|
||||||
player={player}
|
player={player}
|
||||||
post={post}
|
post={post}
|
||||||
embed={post.embed}
|
embed={video}
|
||||||
active={
|
active={
|
||||||
isFocused &&
|
isFocused &&
|
||||||
index === currentIndex &&
|
index === currentIndex &&
|
||||||
currentSource?.source === post.embed.playlist
|
currentSource?.source === video.playlist
|
||||||
}
|
}
|
||||||
adjacent={index === currentIndex - 1 || index === currentIndex + 1}
|
adjacent={index === currentIndex - 1 || index === currentIndex + 1}
|
||||||
moderation={item.moderation}
|
moderation={item.moderation}
|
||||||
@@ -275,15 +270,9 @@ function Feed() {
|
|||||||
)
|
)
|
||||||
|
|
||||||
const updateVideoState = useCallback(
|
const updateVideoState = useCallback(
|
||||||
(index?: number) => {
|
(index: number) => {
|
||||||
if (!videos.length) return
|
if (!videos.length) return
|
||||||
|
|
||||||
if (index === undefined) {
|
|
||||||
index = currentIndex
|
|
||||||
} else {
|
|
||||||
setCurrentIndex(index)
|
|
||||||
}
|
|
||||||
|
|
||||||
const prevSlice = videos.at(index - 1)
|
const prevSlice = videos.at(index - 1)
|
||||||
const prevPost = prevSlice?.post
|
const prevPost = prevSlice?.post
|
||||||
const prevEmbed = prevPost?.embed
|
const prevEmbed = prevPost?.embed
|
||||||
@@ -384,11 +373,11 @@ function Feed() {
|
|||||||
setCurrentSources(updatedSources)
|
setCurrentSources(updatedSources)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[videos, currentSources, currentIndex, players],
|
[videos, currentSources, players],
|
||||||
)
|
)
|
||||||
|
|
||||||
const updateVideoStateInitially = useNonReactiveCallback(() => {
|
const updateVideoStateInitially = useNonReactiveCallback(() => {
|
||||||
updateVideoState()
|
updateVideoState(currentIndex)
|
||||||
})
|
})
|
||||||
|
|
||||||
useFocusEffect(
|
useFocusEffect(
|
||||||
@@ -410,7 +399,9 @@ function Feed() {
|
|||||||
const onViewableItemsChanged = useCallback(
|
const onViewableItemsChanged = useCallback(
|
||||||
({viewableItems}: {viewableItems: ViewToken[]; changed: ViewToken[]}) => {
|
({viewableItems}: {viewableItems: ViewToken[]; changed: ViewToken[]}) => {
|
||||||
if (viewableItems[0] && viewableItems[0].index !== null) {
|
if (viewableItems[0] && viewableItems[0].index !== null) {
|
||||||
updateVideoState(viewableItems[0].index)
|
const newIndex = viewableItems[0].index
|
||||||
|
setCurrentIndex(newIndex)
|
||||||
|
updateVideoState(newIndex)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[updateVideoState],
|
[updateVideoState],
|
||||||
|
|||||||
Reference in New Issue
Block a user