changed timer display format

LooLzzz · Sep 2, 2024 · da81554 · da81554
1 parent 6d38614
commit da81554
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 6 deletions.
diff --git a/src/components/Sidebar/index.tsx b/src/components/Sidebar/index.tsx
@@ -2,7 +2,7 @@ import { Button, Code, Divider, Drawer, DrawerProps, Stack, Switch, Text, Title,
 
 import { MoonStarsIcon, SunIcon } from '@/assets'
 import { useWordleStore } from '@/hooks'
-import { humanReadableSeconds } from '@/utils'
+import { secondsToHms } from '@/utils'
 
 interface SidebarProps extends DrawerProps {
 
@@ -32,7 +32,7 @@ const Sidebar = ({ opened, onClose, ...props }: SidebarProps) => {
     >
       <Stack>
         <Text>
-          Session Time: <Code fz='sm'>{humanReadableSeconds(time, 1)}</Code>
+          Session Time: <Code fz='sm'>{secondsToHms(time)}</Code>
         </Text>
 
         <Divider />

diff --git a/src/components/WordsGuesser/index.tsx b/src/components/WordsGuesser/index.tsx
@@ -5,7 +5,7 @@ import { useCallback, useEffect, useState } from 'react'
 
 import { wordsSet } from '@/assets'
 import { useWordleStore } from '@/hooks'
-import { humanReadableSeconds } from '@/utils'
+import { secondsToHms } from '@/utils'
 
 import Guess from './Guess'
 import classes from './index.module.scss'
@@ -185,7 +185,7 @@ const WordsGuesser = () => {
             }
           </Text>
           <Text>
-            Time: <Code fz='md'>{humanReadableSeconds(time)}</Code>
+            Time: <Code fz='md'>{secondsToHms(time)}</Code>
           </Text>
           <Button onClick={resetStore}>Play Again</Button>
         </Stack>

diff --git a/src/main.tsx b/src/main.tsx
@@ -59,5 +59,5 @@ createRoot(document.getElementById('root')!).render(
       />
       <App />
     </MantineProvider>
-  </StrictMode>,
+  </StrictMode>
 )
diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -1,4 +1,12 @@
 
+const secondsToHms = (seconds: number) => {
+  var h = Math.floor(seconds / 3600).toString().padStart(2, '0')
+  var m = Math.floor(seconds % 3600 / 60).toString().padStart(2, '0')
+  var s = Math.floor(seconds % 3600 % 60).toString().padStart(2, '0')
+
+  return `${h}:${m}:${s}`
+}
+
 const humanReadableSeconds = (seconds: number, precision: number = 1) => {
   const prefixes = [
     'second',
@@ -27,5 +35,6 @@ const humanReadableSeconds = (seconds: number, precision: number = 1) => {
 }
 
 export {
-  humanReadableSeconds
+  humanReadableSeconds,
+  secondsToHms
 }