From 12f581a4c0c4a3316385015622823c9e5935bb05 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 31 Jul 2024 14:13:10 +0700
Subject: <iman> update pop up cart

---
 src/lib/cart/components/Cartheader.jsx | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

(limited to 'src/lib/cart/components/Cartheader.jsx')

diff --git a/src/lib/cart/components/Cartheader.jsx b/src/lib/cart/components/Cartheader.jsx
index a7dd621d..c8aa7cc3 100644
--- a/src/lib/cart/components/Cartheader.jsx
+++ b/src/lib/cart/components/Cartheader.jsx
@@ -26,6 +26,7 @@ const Cardheader = (cartCount) => {
     useProductCartContext()
 
   const [isHovered, setIsHovered] = useState(false)
+  const [isTop, setIsTop] = useState(true)
 
   const products = useMemo(() => {
     return productCart?.products || []
@@ -84,12 +85,24 @@ const Cardheader = (cartCount) => {
     setCountCart(cartCount.cartCount)
   }, [cartCount])
 
+  useEffect(() => {
+    const handleScroll = () => {
+      setIsTop(window.scrollY === 0)
+    }
+
+    window.addEventListener('scroll', handleScroll)
+    return () => {
+      window.removeEventListener('scroll', handleScroll)
+    }
+  }, [])
+
   const handleCheckout = async () => {
     SetButtonTerapkan(true)
     let checkoutAll = await odooApi('POST', `/api/v1/user/${auth.id}/cart/select-all`)
     router.push('/shop/checkout')
   }
 
+
   return (
     <div className='relative group'>
       <div>
@@ -121,10 +134,10 @@ const Cardheader = (cartCount) => {
           <>
             <motion.div
               initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
+              animate={{ opacity: 1, top: isTop ? 230 : 155 }}
               exit={{ opacity: 0 }}
-              transition={{ duration: 0.15 }}
-              className='fixed top-[230px] left-0 w-full h-full bg-black/50 z-10'
+              transition={{ duration: 0.15, top: { duration: 0.3 } }}
+              className={`fixed left-0 w-full h-full bg-black/50 z-10`}
             />
 
             <motion.div
-- 
cgit v1.2.3

