From 9272a07644a75d201753501cfff173b1260963ea Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Wed, 5 Jul 2023 09:29:46 +0700
Subject: cart, checkout dan nav bar mobile

---
 src/lib/cart/components/Cart.jsx | 69 +++++++++++++++++++++++++++++++++++-----
 1 file changed, 61 insertions(+), 8 deletions(-)

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

diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx
index f1584f98..224d02d1 100644
--- a/src/lib/cart/components/Cart.jsx
+++ b/src/lib/cart/components/Cart.jsx
@@ -278,18 +278,18 @@ const Cart = () => {
                     <div className='flex gap-x-2 bg-yellow-100 p-2 items-center'>
                       {product.program ? (
                         <>
-                          <div className='flex border border-solid border-red-600 rounded-md p-1 text-caption-2'>
+                          <div className='border border-solid border-red-600 rounded-md p-1 text-caption-2 whitespace-nowrap'>
                             <span className='text-red-600'>{product.program.type.label}</span>
                           </div>
-                          <div className='flex text-caption-2'>
+                          <div className='text-caption-2'>
                             {product.program.type.value == 'merchandise' ? (
                               <>Selamat anda mendapatkan merchandise indoteknik.com</>
                             ) : (
                               <>
-                                Selamat! Pembelian anda lebih hemat
-                                <span className='text-red-600 font-semibold ml-2 text-caption-2'>
+                                Selamat! Pembelian anda hemat
+                                <span className='text-red-600 font-semibold text-caption-2'>
                                   {' '}
-                                  {currencyFormat(product.program.price.priceDiscount)}
+                                  {currencyFormat(product.program?.totalSavings)}
                                 </span>
                               </>
                             )}
@@ -307,9 +307,12 @@ const Cart = () => {
                         onClick={() =>
                           handlePopUpPromo(product.id, product.quantity, product.program?.id)
                         }
-                        className='ml-auto text-red-500 flex gap-x-1 cursor-pointer'
+                        className='ml-auto text-red-500 flex gap-x-0 cursor-pointer'
                       >
-                        <div className='font-semibold text-caption-2'> Cek Promo</div>
+                        <div className='font-semibold text-caption-2 whitespace-nowrap'>
+                          {' '}
+                          Cek Promo
+                        </div>
                         <div>
                           <svg
                             aria-hidden='true'
@@ -329,7 +332,8 @@ const Cart = () => {
                       </div>
                     </div>
                   )}
-                  <div key={product?.id} className='flex mx-4'>
+                  <div key={product?.id} className='flex mx-4 relative'>
+                    <ComponentCanBuy canBuy={product.canBuy} />
                     <input
                       type='checkbox'
                       onClick={() => toggleSelected(product.id)}
@@ -414,6 +418,55 @@ const Cart = () => {
                       </div>
                     </div>
                   </div>
+                  {product.program &&
+                    product.program.items &&
+                    product.program.items.map((item) => (
+                      <div key={item.id} className='flex mx-4 relative'>
+                         <ComponentCanBuy canBuy={product.canBuy} />
+                        <input className='mr-2 accent-danger-500 w-4' />
+                        <Link
+                          href={createSlug(
+                            '/shop/product/',
+                            product?.parent.name,
+                            product?.parent.id
+                          )}
+                          className='w-[30%] flex-shrink-0'
+                        >
+                          <Image
+                            src={item?.parent?.image}
+                            alt={item?.name}
+                            className='object-contain object-center border border-gray_r-6 h-40 w-full rounded-md'
+                          />
+                        </Link>
+                        <div className='flex-1 px-2 text-caption-2'>
+                          <Link
+                            href={createSlug(
+                              '/shop/product/',
+                              product?.parent.name,
+                              product?.parent.id
+                            )}
+                            className='line-clamp-2 leading-6 !text-gray_r-12 font-normal'
+                          >
+                            <div className='px-2 text-left mt-2'>
+                              <div className='mb-2'>
+                                <span className='border border-solid border-red-600 rounded-md p-1 text-red-600'>
+                                  {product.program.type.label}
+                                </span>
+                              </div>
+                              <div>{item.name}</div>
+                            </div>
+                          </Link>
+                          {item.price?.discountPercentage > 0 && (
+                            <div className='flex gap-x-1 items-center mt-3 ml-3'>
+                              <div className='text-gray_r-11 line-through text-caption-2'>
+                                {currencyFormat(item?.price?.price)}
+                              </div>
+                            </div>
+                          )}
+                          <div className='text-danger-500 font-medium mt-1 ml-3'>Gratis</div>
+                        </div>
+                      </div>
+                    ))}
                 </>
               ))}
 
-- 
cgit v1.2.3

