diff options
| -rw-r--r-- | src/view/com/util/post-embeds/VideoEmbed.web.tsx | 19 |
1 files changed, 7 insertions, 12 deletions
diff --git a/src/view/com/util/post-embeds/VideoEmbed.web.tsx b/src/view/com/util/post-embeds/VideoEmbed.web.tsx index e96b75926..e88b2ff48 100644 --- a/src/view/com/util/post-embeds/VideoEmbed.web.tsx +++ b/src/view/com/util/post-embeds/VideoEmbed.web.tsx @@ -4,6 +4,7 @@ import {AppBskyEmbedVideo} from '@atproto/api' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {isFirefox} from '#/lib/browser' import {clamp} from '#/lib/numbers' import {useGate} from '#/lib/statsig/statsig' import { @@ -23,9 +24,11 @@ export function VideoEmbed({embed}: {embed: AppBskyEmbedVideo.View}) { const {active, setActive, sendPosition, currentActiveView} = useActiveVideoWeb() const [onScreen, setOnScreen] = useState(false) + const [isFullscreen] = useFullscreen() useEffect(() => { if (!ref.current) return + if (isFullscreen && !isFirefox) return const observer = new IntersectionObserver( entries => { const entry = entries[0] @@ -39,7 +42,7 @@ export function VideoEmbed({embed}: {embed: AppBskyEmbedVideo.View}) { ) observer.observe(ref.current) return () => observer.disconnect() - }, [sendPosition]) + }, [sendPosition, isFullscreen]) const [key, setKey] = useState(0) const renderError = useCallback( @@ -108,12 +111,12 @@ function ViewportObserver({ const ref = useRef<HTMLDivElement>(null) const [nearScreen, setNearScreen] = useState(false) const [isFullscreen] = useFullscreen() - const [nearScreenOrFullscreen, setNearScreenOrFullscreen] = useState(false) // Send position when scrolling. This is done with an IntersectionObserver // observing a div of 100vh height useEffect(() => { if (!ref.current) return + if (isFullscreen && !isFirefox) return const observer = new IntersectionObserver( entries => { const entry = entries[0] @@ -127,7 +130,7 @@ function ViewportObserver({ ) observer.observe(ref.current) return () => observer.disconnect() - }, [sendPosition]) + }, [sendPosition, isFullscreen]) // In case scrolling hasn't started yet, send up the position useEffect(() => { @@ -138,17 +141,9 @@ function ViewportObserver({ } }, [isAnyViewActive, sendPosition]) - // disguesting effect - it should be `nearScreen` except when fullscreen - // when it should be whatever it was before fullscreen changed - useEffect(() => { - if (!isFullscreen) { - setNearScreenOrFullscreen(nearScreen) - } - }, [isFullscreen, nearScreen]) - return ( <View style={[a.flex_1, a.flex_row]}> - {nearScreenOrFullscreen && children} + {nearScreen && children} <div ref={ref} style={{ |