🔥

components/Time.tsx

@@ -1,22 +1,24 @@
 import { FaClock } from 'react-icons/fa';
+import { dayjs } from 'components/dayjs'
 import { useEffect, useState } from 'react'
 import styles from 'styles/Home.module.scss'
 
-const Timer = () => {
-    const [date, setDate] = useState(new Date())
-    
-    useEffect(() => {      
-        const interval = setInterval(() => {
-            setDate(new Date())
-        }, 1000)
-        return () => clearInterval(interval)
-    })
+const now = () => dayjs().tz()
 
-    return(
-        <div className={styles.time}>
-            <p><FaClock /> {date.toLocaleDateString('en-GB', { dateStyle: 'short' }) + ' • ' + date.toLocaleTimeString('en-GB', { timeStyle: 'medium', hour12: true,  timeZone: 'Europe/Budapest'}).toUpperCase()}</p>
-        </div>
-    )
+const Time = () => {
+  const [date, setDate] = useState(now())
+
+  useEffect(() => {
+    const timer = setInterval(() => setDate(now()), 1000)
+    return () => clearInterval(timer)
+  }, [])
+
+  return (
+    <p className={styles.time}>
+      <FaClock />
+      {' '}{date.format('DD/MM/YYYY • h:mm:ss A')}
+    </p>
+  )
 }
 
-export default Timer
+export default Time