if variant = 1

1 files changed, 100 insertions, 73 deletions

diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index e0d2a959..8983f241 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -161,14 +161,38 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
                 </span>
               )}
             </h3>
-
-            <button
-              type='button'
-              onClick={goToVariantSection}
-              className='btn-solid-red w-full mt-6'
-            >
-              Lihat Varian
-            </button>
+            {product.variants.length > 1 ? (
+              <button
+                type='button'
+                onClick={goToVariantSection}
+                className='btn-solid-red w-full mt-6'
+              >
+                Lihat Varian
+              </button>
+            ) : (
+              <td className='flex gap-x-3 mt-4'>
+                <input
+                  type='number'
+                  className='form-input w-16 py-2 text-center bg-gray_r-1'
+                  ref={setVariantQuantityRef(product.variants[0].id)}
+                  defaultValue={1}
+                />
+                <button
+                  type='button'
+                  onClick={() => handleAddToCart(product.variants[0].id)}
+                  className='flex-1 py-2 btn-yellow'
+                >
+                  Keranjang
+                </button>
+                <button
+                  type='button'
+                  onClick={() => handleBuy(product.variants[0].id)}
+                  className='flex-1 py-2 btn-solid-red'
+                >
+                  Beli
+                </button>
+              </td>
+            )}
 
             <div className='flex mt-4'>
               <button className='flex items-center gap-x-1' onClick={toggleWishlist}>
@@ -183,73 +207,76 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
           </div>
         </div>
 
-        <div className='mt-12' ref={variantSectionRef}>
-          <div className='text-h-lg font-semibold mb-6'>Varian Produk</div>
-          <div className='table-specification'>
-            <table>
-              <thead>
-                <tr>
-                  <th>Part Number</th>
-                  <th>Varian</th>
-                  <th>Harga</th>
-                  <th>Jumlah</th>
-                  <th>Action</th>
-                </tr>
-              </thead>
-              <tbody>
-                {product.variants.map((variant) => (
-                  <tr key={variant.id}>
-                    <td>{variant.code}</td>
-                    <td>{variant.attributes.join(', ') || '-'}</td>
-                    <td>
-                      {variant.price.discountPercentage > 0 && variant.price.priceDiscount > 0 && (
-                        <>
-                          <div className='line-through text-caption-1 text-gray_r-11 mb-1'>
-                            {currencyFormat(variant.price.price)}
-                          </div>{' '}
-                        </>
-                      )}
-                      <div>
-                        {variant.price.priceDiscount > 0 ? (
-                          currencyFormat(variant.price.priceDiscount)
-                        ) : (
-                          <a href='https://wa.me/' className='text-red_r-11'>
-                            Call for price
-                          </a>
-                        )}
-                      </div>
-                      {/* <VariantPrice id={variant.id} /> */}
-                    </td>
-                    <td>
-                      <input
-                        type='number'
-                        className='form-input w-16 py-2 text-center bg-gray_r-1'
-                        ref={setVariantQuantityRef(variant.id)}
-                        defaultValue={1}
-                      />
-                    </td>
-                    <td className='flex gap-x-3'>
-                      <button
-                        type='button'
-                        onClick={() => handleAddToCart(variant.id)}
-                        className='flex-1 py-2 btn-yellow'
-                      >
-                        Keranjang
-                      </button>
-                      <button
-                        type='button'
-                        onClick={() => handleBuy(variant.id)}
-                        className='flex-1 py-2 btn-solid-red'
-                      >
-                        Beli
-                      </button>
-                    </td>
+        {product.variants.length > 1 && (
+          <div className='mt-12' ref={variantSectionRef}>
+            <div className='text-h-lg font-semibold mb-6'>Varian Produk</div>
+            <div className='table-specification'>
+              <table>
+                <thead>
+                  <tr>
+                    <th>Part Number</th>
+                    <th>Varian</th>
+                    <th>Harga</th>
+                    <th>Jumlah</th>
+                    <th>Action</th>
                   </tr>
-                ))}
-              </tbody>
-            </table>
+                </thead>
+                <tbody>
+                  {product.variants.map((variant) => (
+                    <tr key={variant.id}>
+                      <td>{variant.code}</td>
+                      <td>{variant.attributes.join(', ') || '-'}</td>
+                      <td>
+                        {variant.price.discountPercentage > 0 &&
+                          variant.price.priceDiscount > 0 && (
+                            <>
+                              <div className='line-through text-caption-1 text-gray_r-11 mb-1'>
+                                {currencyFormat(variant.price.price)}
+                              </div>{' '}
+                            </>
+                          )}
+                        <div>
+                          {variant.price.priceDiscount > 0 ? (
+                            currencyFormat(variant.price.priceDiscount)
+                          ) : (
+                            <a href='https://wa.me/' className='text-red_r-11'>
+                              Call for price
+                            </a>
+                          )}
+                        </div>
+                        {/* <VariantPrice id={variant.id} /> */}
+                      </td>
+                      <td>
+                        <input
+                          type='number'
+                          className='form-input w-16 py-2 text-center bg-gray_r-1'
+                          ref={setVariantQuantityRef(variant.id)}
+                          defaultValue={1}
+                        />
+                      </td>
+                      <td className='flex gap-x-3'>
+                        <button
+                          type='button'
+                          onClick={() => handleAddToCart(variant.id)}
+                          className='flex-1 py-2 btn-yellow'
+                        >
+                          Keranjang
+                        </button>
+                        <button
+                          type='button'
+                          onClick={() => handleBuy(variant.id)}
+                          className='flex-1 py-2 btn-solid-red'
+                        >
+                          Beli
+                        </button>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
           </div>
-        </div>
+        )}
 
         <div className='mt-12'>
           <div className='text-h-lg font-semibold'>Informasi Produk</div>