diff --git a/src/components/interstitials/TrendingVideos.tsx b/src/components/interstitials/TrendingVideos.tsx index 4d59e2fb5c..6be64335a2 100644 --- a/src/components/interstitials/TrendingVideos.tsx +++ b/src/components/interstitials/TrendingVideos.tsx @@ -1,4 +1,4 @@ -import React, {useEffect} from 'react' +import {useCallback, useEffect, useMemo} from 'react' import {ScrollView, View} from 'react-native' import {AppBskyEmbedVideo, AtUri} from '@atproto/api' import {msg, Trans} from '@lingui/macro' @@ -55,7 +55,7 @@ export function TrendingVideos() { const {setTrendingVideoDisabled} = useTrendingSettingsApi() const trendingPrompt = Prompt.usePromptControl() - const onConfirmHide = React.useCallback(() => { + const onConfirmHide = useCallback(() => { setTrendingVideoDisabled(true) logEvent('trendingVideos:hide', {context: 'interstitial:discover'}) }, [setTrendingVideoDisabled]) @@ -147,9 +147,7 @@ function VideoCards({ }: { data: Exclude['data'], undefined> }) { - const t = useTheme() - const {_} = useLingui() - const items = React.useMemo(() => { + const items = useMemo(() => { return data.pages .flatMap(page => page.slices) .map(slice => slice.items[0]) @@ -157,10 +155,6 @@ function VideoCards({ .filter(item => AppBskyEmbedVideo.isView(item.post.embed)) .slice(0, 8) }, [data]) - const href = React.useMemo(() => { - const urip = new AtUri(VIDEO_FEED_URI) - return makeCustomFeedLink(urip.host, urip.rkey, undefined, 'discover') - }, []) return ( <> @@ -183,50 +177,58 @@ function VideoCards({ ))} - - - {({pressed}) => ( - - - View more - - - - - - )} - - + ) } + +function ViewMoreCard() { + const t = useTheme() + const {_} = useLingui() + + const href = useMemo(() => { + const urip = new AtUri(VIDEO_FEED_URI) + return makeCustomFeedLink(urip.host, urip.rkey, undefined, 'discover') + }, []) + + return ( + + + {({pressed}) => ( + + + View more + + + + )} + + + ) +}