Improve display of estimated time

HipoFinance · Nov 18, 2023 · ddc50f5 · ddc50f5
1 parent 41447ae
commit ddc50f5
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 19 deletions.
diff --git a/src/Model.ts b/src/Model.ts
@@ -940,25 +940,13 @@ function formatDate(date: Date): string {
 }
 
 function formatEta(time: bigint): string {
-    if (time > 0) {
-        time += 5n * 60n // add 5 minutes as a gap for better estimation
-    }
+    time += 5n * 60n // add 5 minutes as a gap for better estimation
     const now = Math.floor(Date.now() / 1000)
-    const seconds = Math.max(0, Number(time) - now)
-    const hours = Math.floor(seconds / 3600)
-    const minutes = Math.floor(seconds / 60) % 60
-    const parts = []
-    if (hours > 1) {
-        parts.push(hours.toString() + ' hours')
-    } else if (hours === 1) {
-        parts.push('1 hour')
-    }
-    if (minutes > 1) {
-        parts.push(minutes.toString() + ' minutes')
-    } else if (minutes === 1) {
-        parts.push('1 minute')
-    }
-    return parts.join(' ') || 'about a minute'
+    if (time < now) {
+        return 'about a minute'
+    } else {
+        return formatDate(new Date(Number(time) * 1000))
+    }
 }
 
 function sleep(ms: number) {

diff --git a/src/StakeUnstake.tsx b/src/StakeUnstake.tsx
@@ -207,7 +207,7 @@ const StakeUnstake = observer(({ model }: Props) => {
                             <img src={question} className='peer ml-1 w-4 dark:hidden' />
                             <img src={questionDark} className='peer ml-1 hidden w-4 dark:block' />
                             <p className='absolute left-1/3 top-6 z-10 hidden -translate-x-1/4 rounded-lg bg-lightblue p-4 text-xs font-normal text-blue shadow-xl peer-hover:block'>
-                                How long it takes to get your {model.isStakeTabActive ? 'hTON' : 'TON'} if you{' '}
+                                When you will receive your {model.isStakeTabActive ? 'hTON' : 'TON'} if you{' '}
                                 {model.isStakeTabActive ? 'stake' : 'unstake'} now.
                             </p>
                             <p className='ml-auto'>{model.isStakeTabActive ? model.stakeEta : model.unstakeEta}</p>