format + notif

src/app/Main.tsx

@@ -384,6 +384,10 @@ const Clip = () => {
   const [processDurationSecond, setProcessDurationSecond] = useState('')
   const [status, setStatus] = useState(STANDBY)
 
+  useEffect(() => {
+    Notification.requestPermission()
+  }, []);
+
   const onReady = () => {
     setStatus(READY)
   }
@@ -400,7 +404,8 @@ const Clip = () => {
         const urlEdited = await retry({ fn: async () => await getData(key) })
         setUrlEdited(urlEdited)
       })
-      setProcessDurationSecond(`⏱️ ${durationSecond}s `)
+      setProcessDurationSecond(`⏱️ ${durationSecond}`)
+      new Notification(`⏱️ ${durationSecond}`)
     } catch (error) {
       console.error(`onSuccess ERROR : ${error}`);
     }
@@ -476,15 +481,15 @@ const Clip = () => {
       >
         <ReactPlayer
           style={{ backgroundColor: 'black' }}
-          playing={true}
+          playing={false}
           controls={true}
           url={url}
           width={"100%"}
         />
         <ReactPlayer
           style={{ backgroundColor: 'grey' }}
           onReady={onReady}
-          playing={true}
+          playing={false}
           controls={true}
           url={urlEdited}
           width={"100%"}

src/app/utils.ts

@@ -46,9 +46,12 @@ export const getData = async (key: string, prefix = '_edited') => {
   }
 }
 
-export async function measurePromise(fn: () => Promise<any>): Promise<number> {
+export async function measurePromise(fn: () => Promise<any>): Promise<string> {
   const start = performance.now()
   await fn()
-  const durationInMilliseconds = performance.now() - start
-  return parseFloat((durationInMilliseconds / 1000).toFixed(2))
+  const durationInMinutes = (performance.now() - start) / 60000
+  const wholeMinutes = Math.floor(durationInMinutes)
+  const seconds = Math.round((durationInMinutes - wholeMinutes) * 60)
+  const formattedSeconds = seconds.toString().padStart(2, '0');
+  return `${wholeMinutes}mn ${formattedSeconds}s`
 }