summaryrefslogtreecommitdiff
path: root/src/core/components/elements
diff options
context:
space:
mode:
Diffstat (limited to 'src/core/components/elements')
-rw-r--r--src/core/components/elements/CountDown/CountDown.jsx55
-rw-r--r--src/core/components/elements/Navbar/NavbarUserDropdown.jsx1
2 files changed, 56 insertions, 0 deletions
diff --git a/src/core/components/elements/CountDown/CountDown.jsx b/src/core/components/elements/CountDown/CountDown.jsx
new file mode 100644
index 00000000..49a33d77
--- /dev/null
+++ b/src/core/components/elements/CountDown/CountDown.jsx
@@ -0,0 +1,55 @@
+import { useEffect, useState } from 'react'
+
+const CountDown = ({ initialTime }) => {
+ const days = Math.floor(initialTime / 86400)
+ const hours = Math.floor((initialTime % 86400) / 3600)
+ const minutes = Math.floor((initialTime % 3600) / 60)
+ const seconds = initialTime % 60
+
+ const [timeLeft, setTimeLeft] = useState({
+ day: days,
+ hour: hours,
+ minute: minutes,
+ second: seconds
+ })
+
+ useEffect(() => {
+ const timer = setInterval(() => {
+ const totalSeconds = timeLeft.day * 86400 + timeLeft.hour * 3600 + timeLeft.minute * 60 + timeLeft.second
+ const secondsLeft = totalSeconds - 1
+ if (secondsLeft < 0) {
+ clearInterval(timer)
+ } else {
+ const days = Math.floor(secondsLeft / 86400)
+ const hours = Math.floor((secondsLeft % 86400) / 3600)
+ const minutes = Math.floor((secondsLeft % 3600) / 60)
+ const seconds = secondsLeft % 60
+ setTimeLeft({ day: days, hour: hours, minute: minutes, second: seconds })
+ }
+ }, 1000)
+ return () => clearInterval(timer)
+ }, [timeLeft])
+
+ return (
+ <div className='flex gap-x-3 w-fit'>
+ <div className='flex flex-col items-center'>
+ <span className='bg-red-600 text-white font-semibold w-10 h-10 flex items-center justify-center rounded'>{timeLeft.day}</span>
+ <span className='text-caption-1 text-gray-807'>Hari</span>
+ </div>
+ <div className='flex flex-col items-center'>
+ <span className='bg-red-600 text-white font-semibold w-10 h-10 flex items-center justify-center rounded'>{timeLeft.hour}</span>
+ <span className='text-caption-1 text-gray-807'>Jam</span>
+ </div>
+ <div className='flex flex-col items-center'>
+ <span className='bg-red-600 text-white font-semibold w-10 h-10 flex items-center justify-center rounded'>{timeLeft.minute}</span>
+ <span className='text-caption-1 text-gray-700'>Menit</span>
+ </div>
+ <div className='flex flex-col items-center'>
+ <span className='bg-red-600 text-white font-semibold w-10 h-10 flex items-center justify-center rounded'>{timeLeft.second}</span>
+ <span className='text-caption-1 text-gray-700'>Detik</span>
+ </div>
+ </div>
+ )
+}
+
+export default CountDown
diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
index 1d2429a7..7848124c 100644
--- a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
+++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
@@ -13,6 +13,7 @@ const NavbarUserDropdown = () => {
return (
<div className='navbar-user-dropdown-wrapper'>
<div className='navbar-user-dropdown'>
+ <Link href='/my/quotations'>Daftar Quotation</Link>
<Link href='/my/transactions'>Daftar Transaksi</Link>
<Link href='/my/invoices'>Invoice & Faktur Pajak</Link>
<Link href='/my/wishlist'>Wishlist</Link>