Fix infinity problem when video is streaming or does not have duration data

This commit is contained in:
danidfra 2025-01-31 15:45:01 -03:00
parent 5f95348ac0
commit 5f874b87c1
1 changed files with 13 additions and 8 deletions

View File

@ -191,10 +191,12 @@ const Video: React.FC<IVideo> = ({
};
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 => {
@ -649,9 +651,13 @@ const Video: React.FC<IVideo> = ({
<span>
<span className='text-sm font-medium text-white/75'>{formatTime(currentTime)}</span>
{duration > 0 && (
<>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<span className='mx-1.5 inline-block text-sm font-medium text-white/75'>/</span>
<span className='text-sm font-medium text-white/75'>{formatTime(duration)}</span>
</>
)}
</span>
{link && (
@ -660,7 +666,6 @@ const Video: React.FC<IVideo> = ({
</span>
)}
</div>
<div className='flex min-w-[30px] flex-auto items-center truncate text-[16px]'>
<button
type='button'