From 5f874b87c19b4bcc6e661982445aaa8a19bdbd16 Mon Sep 17 00:00:00 2001
From: danidfra <danielfilemondev@gmail.com>
Date: Fri, 31 Jan 2025 15:45:01 -0300
Subject: [PATCH] Fix infinity problem when video is streaming or does not have
 duration data

---
 src/features/video/index.tsx | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/features/video/index.tsx b/src/features/video/index.tsx
index c58ded688..8c6cc71f9 100644
--- a/src/features/video/index.tsx
+++ b/src/features/video/index.tsx
@@ -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>
-              {/* 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>
+              {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'