diff --git a/src/features/video/index.tsx b/src/features/video/index.tsx index c58ded688..77047c5d5 100644 --- a/src/features/video/index.tsx +++ b/src/features/video/index.tsx @@ -191,10 +191,12 @@ const Video: React.FC = ({ }; const handleTimeUpdate = () => { - if (video.current) { - setCurrentTime(Math.floor(video.current.currentTime)); - setDuration(Math.floor(video.current.duration)); - } + if (!video.current) return; + + const { duration, currentTime } = video.current; + + setCurrentTime(Math.floor(currentTime)); + setDuration(Number.isNaN(duration) || (duration === Infinity) ? 0 : Math.floor(duration)); }; const handleVolumeMouseDown: React.MouseEventHandler = e => { @@ -480,7 +482,11 @@ const Video: React.FC = ({ const playerStyle: React.CSSProperties = {}; const startTimeout = () => { - timeoutRef.current = setTimeout(() => setHovered(false), 1000); + if (timeoutRef.current) clearTimeout(timeoutRef.current); + timeoutRef.current = setTimeout(() => { + setHovered(false); + timeoutRef.current = null; + }, 1000); }; if (inline && containerWidth) { @@ -649,9 +655,13 @@ const Video: React.FC = ({ {formatTime(currentTime)} - {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} - / - {formatTime(duration)} + {duration > 0 && ( + <> + {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} + / + {formatTime(duration)} + + )} {link && ( @@ -660,7 +670,6 @@ const Video: React.FC = ({ )} -