add measurePromise

alexlevy0 · Dec 2, 2023 · 269e580 · 269e580
1 parent d7ea63b
commit 269e580
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 21 deletions.
diff --git a/src/app/Main.tsx b/src/app/Main.tsx
@@ -34,7 +34,7 @@ import { Auth, Storage } from 'aws-amplify';
 // @ts-ignore
 import { Features } from './Features.tsx';
 // @ts-ignore
-import { retry, noop, getData } from './utils.ts';
+import { retry, noop, getData, measurePromise } from './utils.ts';
 
 const Picker = (props: { onClick: any }) => {
   return (
@@ -381,22 +381,29 @@ const Clip = () => {
 
   const [url, setUrl] = useState('')
   const [urlEdited, setUrlEdited] = useState('')
+  const [processDurationSecond, setProcessDurationSecond] = useState('')
   const [status, setStatus] = useState(STANDBY)
 
   const onReady = () => {
     setStatus(READY)
   }
 
   const onSuccess = async ({ key = '' }) => {
-    if (!key) return
-    setStatus(`${PROCESSING} : ${key}…`)
-    // @ts-ignore
-    const url = await retry({ fn: async () => await getData(key, '') })
-    console.log({ url });
-    setUrl(url)
-    const urlEdited = await retry({ fn: async () => await getData(key) })
-    console.log({ urlEdited });
-    setUrlEdited(urlEdited)
+    try {
+      if (!key) return
+      setStatus(`${PROCESSING} : ${key}…`)
+      // @ts-ignore
+      const url = await retry({ fn: async () => await getData(key, '') })
+      setUrl(url)
+
+      const durationSecond = await measurePromise(async () => {
+        const urlEdited = await retry({ fn: async () => await getData(key) })
+        setUrlEdited(urlEdited)
+      })
+      setProcessDurationSecond(`⏱️ ${durationSecond}s `)
+    } catch (error) {
+      console.error(`onSuccess ERROR : ${error}`);
+    }
   }
 
   const onResetVideoUrl = () => setUrl('')
@@ -429,34 +436,46 @@ const Clip = () => {
           placeholder="Paste YouTube link or drop a file"
         />
       </Flex> */}
-      {status !== READY && status !== STANDBY && (
+      <Heading
+        level={5}
+      >
+        {status}
+      </Heading>
+      {!!url && processDurationSecond === '' && (
         <Flex
           backgroundColor={'rgb(13, 25, 38)'}
           direction="column"
           gap="small"
           justifyContent="space-around"
         >
-          <Heading
-            level={6}
-          >
-            {status}
-          </Heading>
           <Loader
             emptyColor={'rgb(13, 25, 38)'}
             filledColor={'rgb(125, 214, 232)'}
             variation="linear"
           />
         </Flex>
       )}
+      {processDurationSecond !== '' && (
+        <Flex
+          backgroundColor={'rgb(13, 25, 38)'}
+          direction="column"
+          gap="small"
+          justifyContent="space-around"
+        >
+          <Heading
+            level={5}
+          >
+            {processDurationSecond}
+          </Heading>
+        </Flex>
+      )}
       <Flex
-        // backgroundColor={'black'}
         alignContent="center"
         justifyContent={'center'}
         gap="small"
       >
         <ReactPlayer
           style={{ backgroundColor: 'black' }}
-          onReady={onReady}
           playing={true}
           controls={true}
           url={url}

diff --git a/src/app/utils.ts b/src/app/utils.ts
@@ -9,8 +9,8 @@ export const sleep = (ms: number) =>
 
 export const retry = async ({
   fn = noop,
-  retries = 120,
-  delay = 4000,
+  retries = 60 * 5 * 3,
+  delay = 333,
   err = '',
 }) => {
   const attempt = async (
@@ -40,9 +40,15 @@ export const getData = async (key: string, prefix = '_edited') => {
     }
     const [name, format] = key.split('.')
     const newKey = `${name}${prefix}.${format}`
-    console.log({ newKey })
     return await Storage.get(newKey, config)
   } catch (error) {
     throw new Error('No data yet')
   }
 }
+
+export async function measurePromise(fn: () => Promise<any>): Promise<number> {
+  const start = performance.now()
+  await fn()
+  const durationInMilliseconds = performance.now() - start
+  return parseFloat((durationInMilliseconds / 1000).toFixed(2))
+}