<Miqdad> Move stock position mobile

2 files changed, 34 insertions, 16 deletions

diff --git a/src-migrate/modules/product-detail/components/PriceAction.tsx b/src-migrate/modules/product-detail/components/PriceAction.tsx
index 850c2d9d..f5c2d7b3 100644
--- a/src-migrate/modules/product-detail/components/PriceAction.tsx
+++ b/src-migrate/modules/product-detail/components/PriceAction.tsx
@@ -17,7 +17,9 @@ type Props = {
   product: IProductDetail;
 };
 
-const PPN : number = process.env.NEXT_PUBLIC_PPN ? parseFloat(process.env.NEXT_PUBLIC_PPN) : 0;
+const PPN: number = process.env.NEXT_PUBLIC_PPN
+  ? parseFloat(process.env.NEXT_PUBLIC_PPN)
+  : 0;
 const PriceAction = ({ product }: Props) => {
   const {
     activePrice,
@@ -104,6 +106,21 @@ const PriceAction = ({ product }: Props) => {
             Termasuk PPN: Rp{' '}
             {formatCurrency(Math.round(activePrice.price_discount * PPN))}
           </div>
+          {isMobile && (
+          <div>
+            <Skeleton
+              isLoaded={sla}
+              h='21px'
+              // w={16}
+              className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}
+            >
+              Stock : {sla?.qty}{' '}
+            </Skeleton>
+            {/* <span className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}>
+            {' '}
+          </span> */}
+          </div>
+          )}
         </>
       )}
 
@@ -149,19 +166,21 @@ const PriceAction = ({ product }: Props) => {
           </button>
         </div>
 
-        <div>
-          <Skeleton
-            isLoaded={sla}
-            h='21px'
-            // w={16}
-            className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}
-          >
-            Stock : {sla?.qty}{' '}
-          </Skeleton>
-          {/* <span className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}>
+        {isDesktop && (
+          <div>
+            <Skeleton
+              isLoaded={sla}
+              h='21px'
+              // w={16}
+              className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}
+            >
+              Stock : {sla?.qty}{' '}
+            </Skeleton>
+            {/* <span className={sla?.qty < 10 ? 'text-red-600 font-medium' : ''}>
             {' '}
           </span> */}
-        </div>
+          </div>
+        )}
         <div>
           {qtyPickUp > 0 && (
             <Link href='/panduan-pick-up-service' className='group'>
diff --git a/src-migrate/modules/product-detail/components/ProductDetail.tsx b/src-migrate/modules/product-detail/components/ProductDetail.tsx
index a6b4e6de..e6b77fb9 100644
--- a/src-migrate/modules/product-detail/components/ProductDetail.tsx
+++ b/src-migrate/modules/product-detail/components/ProductDetail.tsx
@@ -72,10 +72,9 @@ const ProductDetail = ({ product }: Props) => {
       product?.variants?.find((variant) => variant.is_in_bu) ||
       product?.variants?.[0];
     setSelectedVariant(selectedVariant);
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, []);
 
   // Gabungkan semua gambar produk (utama + tambahan)
-  // Gabungkan semua gambar produk (utama + tambahan)
   const allImages = (() => {
     const arr: string[] = [];
     if (product?.image) arr.push(product.image); // selalu masukkan utama, baik mobile maupun desktop
@@ -147,8 +146,8 @@ const ProductDetail = ({ product }: Props) => {
                     className='flex overflow-x-auto snap-x snap-mandatory scroll-smooth no-scrollbar'
                     style={{
                       scrollBehavior: 'smooth',
-                      msOverflowStyle: 'none', // IE/Edge lama
-                      scrollbarWidth: 'none', // Firefox
+                      msOverflowStyle: 'none',
+                      scrollbarWidth: 'none',
                     }}
                   >
                     {allImages.length > 0 ? (