notif berhasil di tambahkan ke cart

1 files changed, 25 insertions, 1 deletions

diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index dbe37068..0ff904af 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -10,12 +10,16 @@ import { toast } from 'react-hot-toast'
 import { updateItemCart } from '@/core/utils/cart'
 import { useRouter } from 'next/router'
 import { createSlug } from '@/core/utils/slug'
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
+import { Toast } from 'flowbite-react'
 
 const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
   const router = useRouter()
 
   const [lowestPrice, setLowestPrice] = useState(null)
 
+  const [addCartAlert, setAddCartAlert] = useState(false)
+
   const getLowestPrice = useCallback(() => {
     const prices = product.variants.map((variant) => variant.price)
     const lowest = prices.reduce((lowest, price) => {
@@ -54,7 +58,8 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
       quantity,
       selected: true
     })
-    toast.success('Berhasil menambahkan ke keranjang')
+    setAddCartAlert(true)
+    // toast.success('Berhasil menambahkan ke keranjang')
   }
 
   const handleBuy = (variantId) => {
@@ -316,6 +321,25 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
             <ProductSimilar query={productSimilarQuery} />
           </LazyLoad>
         </div>
+        <div>
+          <BottomPopup
+            title='Berhasil Ditambahkan'
+            active={addCartAlert}
+            close={() => setAddCartAlert(false)}
+          >
+            <div className='flex mt-10 mb-5'>
+              <div className='w-[15%]'>
+                <Image
+                  src={product.image}
+                  alt={product.name}
+                  className='h-20 object-contain object-center w-full border border-gray_r-4'
+                />
+              </div>
+              <div className='ml-3 flex items-center text-sm font-normal'>{product.name}</div>
+              <div className='w-[15%] ml-3 flex items-center text-sm font-normal align-middle'>Lihat Keranjang</div>
+            </div>
+          </BottomPopup>
+        </div>
       </div>
     </DesktopView>
   )