diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx index cc30176c86..aead6ec38d 100644 --- a/ts/components/Lightbox.tsx +++ b/ts/components/Lightbox.tsx @@ -170,22 +170,29 @@ export function Lightbox({ }; }, [onKeyDown]); + const { attachment, contentType, loop = false, objectURL, message } = + media[selectedIndex] || {}; + + const isAttachmentGIF = isGIF([attachment]); + useEffect(() => { playVideo(); - if (videoElement && isViewOnce) { - videoElement.addEventListener('timeupdate', onTimeUpdate); - - return () => { - videoElement.removeEventListener('timeupdate', onTimeUpdate); - }; + if (!videoElement || !isViewOnce) { + return noop; } - return noop; - }, [isViewOnce, onTimeUpdate, playVideo, videoElement]); + if (isAttachmentGIF) { + return noop; + } + + videoElement.addEventListener('timeupdate', onTimeUpdate); + + return () => { + videoElement.removeEventListener('timeupdate', onTimeUpdate); + }; + }, [isViewOnce, isAttachmentGIF, onTimeUpdate, playVideo, videoElement]); - const { attachment, contentType, loop = false, objectURL, message } = - media[selectedIndex] || {}; const caption = attachment?.caption; let content: JSX.Element; @@ -239,7 +246,8 @@ export function Lightbox({ ); } } else if (isVideoTypeSupported) { - const shouldLoop = loop || isGIF([attachment]) || isViewOnce; + const shouldLoop = loop || isAttachmentGIF || isViewOnce; + content = (