semi dynamic page

1 files changed, 74 insertions, 73 deletions

diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx
index b0de5168..3a61e9be 100644
--- a/src/lib/cart/components/Cart.jsx
+++ b/src/lib/cart/components/Cart.jsx
@@ -329,91 +329,92 @@ const Cart = () => {
                     <td colSpan={6}>Keranjang belanja anda masih kosong</td>
                   </tr>
                 )}
-                {products && products?.map((product) => (
-                  <tr key={product.id}>
-                    <td>
-                      <input
-                        type='checkbox'
-                        onClick={() => toggleSelected(product.id)}
-                        checked={product?.selected}
-                        className='accent-danger-500 w-4'
-                      />
-                    </td>
-                    <td className='flex'>
-                      <Link
-                        href={createSlug(
-                          '/shop/product/',
-                          product?.parent.name,
-                          product?.parent.id
-                        )}
-                        className='w-[20%] flex-shrink-0'
-                      >
-                        <Image
-                          src={product?.parent?.image}
-                          alt={product?.name}
-                          className='object-contain object-center border border-gray_r-6 h-28 w-full rounded-md'
+                {products &&
+                  products?.map((product) => (
+                    <tr key={product.id}>
+                      <td>
+                        <input
+                          type='checkbox'
+                          onClick={() => toggleSelected(product.id)}
+                          checked={product?.selected}
+                          className='accent-danger-500 w-4'
                         />
-                      </Link>
-                      <div className='px-2 text-left'>
+                      </td>
+                      <td className='flex'>
                         <Link
                           href={createSlug(
                             '/shop/product/',
                             product?.parent.name,
                             product?.parent.id
                           )}
-                          className='line-clamp-2 leading-6 !text-gray_r-12 font-normal'
+                          className='w-[20%] flex-shrink-0'
                         >
-                          {product?.parent?.name}
+                          <Image
+                            src={product?.parent?.image}
+                            alt={product?.name}
+                            className='object-contain object-center border border-gray_r-6 h-28 w-full rounded-md'
+                          />
                         </Link>
-                        <div className='text-gray_r-11 mt-2'>
-                          {product?.code}{' '}
-                          {product?.attributes.length > 0
-                            ? `| ${product?.attributes.join(', ')}`
-                            : ''}
-                        </div>
-                      </div>
-                    </td>
-                    <td>
-                      <input
-                        className='form-input w-16 py-2 text-center bg-gray_r-1'
-                        type='number'
-                        value={product?.quantity}
-                        onChange={(e) => updateQuantity(e.target.value, product?.id)}
-                        onBlur={(e) => updateQuantity(e.target.value, product?.id, 'BLUR')}
-                      />
-                    </td>
-                    <td>
-                      {product?.price?.discountPercentage > 0 && (
-                        <div className='flex gap-x-1 items-center justify-center mt-3'>
-                          <div className='text-gray_r-11 line-through text-caption-1'>
-                            {currencyFormat(product?.price?.price)}
+                        <div className='px-2 text-left'>
+                          <Link
+                            href={createSlug(
+                              '/shop/product/',
+                              product?.parent.name,
+                              product?.parent.id
+                            )}
+                            className='line-clamp-2 leading-6 !text-gray_r-12 font-normal'
+                          >
+                            {product?.parent?.name}
+                          </Link>
+                          <div className='text-gray_r-11 mt-2'>
+                            {product?.code}{' '}
+                            {product?.attributes.length > 0
+                              ? `| ${product?.attributes.join(', ')}`
+                              : ''}
                           </div>
-                          <div className='badge-solid-red'>
-                            {product?.price?.discountPercentage}%
+                        </div>
+                      </td>
+                      <td>
+                        <input
+                          className='form-input w-16 py-2 text-center bg-gray_r-1'
+                          type='number'
+                          value={product?.quantity}
+                          onChange={(e) => updateQuantity(e.target.value, product?.id)}
+                          onBlur={(e) => updateQuantity(e.target.value, product?.id, 'BLUR')}
+                        />
+                      </td>
+                      <td>
+                        {product?.price?.discountPercentage > 0 && (
+                          <div className='flex gap-x-1 items-center justify-center mt-3'>
+                            <div className='text-gray_r-11 line-through text-caption-1'>
+                              {currencyFormat(product?.price?.price)}
+                            </div>
+                            <div className='badge-solid-red'>
+                              {product?.price?.discountPercentage}%
+                            </div>
                           </div>
+                        )}
+                        <div className='font-normal mt-1'>
+                          {currencyFormat(product?.price?.priceDiscount)}
                         </div>
-                      )}
-                      <div className='font-normal mt-1'>
-                        {currencyFormat(product?.price?.priceDiscount)}
-                      </div>
-                    </td>
-                    <td>
-                      <div className='text-danger-500 font-medium'>
-                        {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
-                      </div>
-                    </td>
-                    <td>
-                      <div className='flex justify-center items-center h-full'>
-                        <button
-                          className='btn-red p-1 ml-1'
-                          onClick={() => setDeleteConfirmation(product)}
-                        >
-                          <TrashIcon className='w-4' />
-                        </button>
-                      </div>
-                    </td>
-                  </tr>
-                ))}
+                      </td>
+                      <td>
+                        <div className='text-danger-500 font-medium'>
+                          {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
+                        </div>
+                      </td>
+                      <td>
+                        <div className='flex justify-center items-center h-full'>
+                          <button
+                            className='btn-red p-1 ml-1'
+                            onClick={() => setDeleteConfirmation(product)}
+                          >
+                            <TrashIcon className='w-4' />
+                          </button>
+                        </div>
+                      </td>
+                    </tr>
+                  ))}
               </tbody>
             </table>