From f62b2345f463695ef0f8f79830cd76b6e0332821 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 13 Jan 2024 10:35:22 +0700
Subject: Refactor src migrate folder

---
 .../product-detail/components/Information.tsx      | 84 ++++++++++++++++++++++
 1 file changed, 84 insertions(+)
 create mode 100644 src-migrate/modules/product-detail/components/Information.tsx

(limited to 'src-migrate/modules/product-detail/components/Information.tsx')

diff --git a/src-migrate/modules/product-detail/components/Information.tsx b/src-migrate/modules/product-detail/components/Information.tsx
new file mode 100644
index 00000000..fd0e0b3c
--- /dev/null
+++ b/src-migrate/modules/product-detail/components/Information.tsx
@@ -0,0 +1,84 @@
+import style from '../styles/information.module.css'
+
+import React from 'react'
+import dynamic from 'next/dynamic'
+import Link from 'next/link'
+import { useQuery } from 'react-query'
+
+import { IProductDetail } from '~/types/product'
+import { IProductVariantSLA } from '~/types/productVariant'
+import { createSlug } from '~/libs/slug'
+import { getVariantSLA } from '~/services/productVariant'
+
+const Skeleton = dynamic(() => import('@chakra-ui/react').then((mod) => mod.Skeleton))
+
+type Props = {
+  product: IProductDetail
+}
+
+const Information = ({ product }: Props) => {
+  const querySLA = useQuery<IProductVariantSLA>({
+    queryKey: ['variant-sla', product.variants[0].id],
+    queryFn: () => getVariantSLA(product.variants[0].id),
+    enabled: product.variant_total === 1
+  })
+
+  const sla = querySLA?.data
+
+  return (
+    <div className={style['wrapper']}>
+      <div className={style['row']}>
+        <div className={style['label']}>SKU Number</div>
+        <div className={style['value']}>SKU-{product.id}</div>
+      </div>
+      {/* <div className={style['row']}>
+        <div className={style['label']}>Part Number</div>
+        <div className={style['value']}>{product.code || '-'}</div>
+      </div> */}
+      <div className={style['row']}>
+        <div className={style['label']}>Manufacture</div>
+        <div className={style['value']}>
+          {!!product.manufacture.name ? (
+            <Link
+              href={createSlug('/shop/brands/', product.manufacture.name, product.manufacture.id.toString())}
+              className='text-danger-500 hover:underline'
+            >
+              {product.manufacture.name}
+            </Link>
+          ) : '-'}
+        </div>
+      </div>
+      {/* <div className={style['row']}>
+        <div className={style['label']}>Preparation Time</div>
+        <div className={style['value']}>
+          {product.variant_total > 1 && 'Lihat Variant'}
+          {product.variant_total === 1 && (
+            <Skeleton isLoaded={querySLA.isSuccess} w={querySLA.isSuccess ? '100%' : '40px'} h='100%'>
+              {sla?.sla_date}
+            </Skeleton>
+          )}
+        </div>
+      </div>
+      <div className={style['row']}>
+        <div className={style['label']}>Stock</div>
+        <div className={style['value']}>
+          {product.variant_total > 1 && 'Lihat Variant'}
+          {product.variant_total === 1 && (
+            <Skeleton isLoaded={querySLA.isSuccess} w={querySLA.isSuccess ? '100%' : '10px'} h='100%'>
+              {sla?.qty && sla.qty > 0 ? sla?.qty : '-'}
+            </Skeleton>
+          )}
+        </div>
+      </div>
+      <div className={style['row']}>
+        <div className={style['label']}>Weight</div>
+        <div className={style['value']}>
+          {product.variant_total > 1 && 'Lihat Variant'}
+          {product.variant_total === 1 && (product.weight > 0 ? `${product.weight} kg` : '-')}
+        </div>
+      </div> */}
+    </div>
+  )
+}
+
+export default Information
\ No newline at end of file
-- 
cgit v1.2.3


From a70fd5b6d9c7a769ac1aaa22a7d037ba3be27a05 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 16 Jan 2024 16:08:43 +0700
Subject: Update improve product detail performance

---
 .../product-detail/components/Information.tsx      | 34 ++--------------------
 1 file changed, 3 insertions(+), 31 deletions(-)

(limited to 'src-migrate/modules/product-detail/components/Information.tsx')

diff --git a/src-migrate/modules/product-detail/components/Information.tsx b/src-migrate/modules/product-detail/components/Information.tsx
index fd0e0b3c..52eb6b88 100644
--- a/src-migrate/modules/product-detail/components/Information.tsx
+++ b/src-migrate/modules/product-detail/components/Information.tsx
@@ -9,6 +9,7 @@ import { IProductDetail } from '~/types/product'
 import { IProductVariantSLA } from '~/types/productVariant'
 import { createSlug } from '~/libs/slug'
 import { getVariantSLA } from '~/services/productVariant'
+import { formatToShortText } from '~/libs/formatNumber'
 
 const Skeleton = dynamic(() => import('@chakra-ui/react').then((mod) => mod.Skeleton))
 
@@ -31,10 +32,6 @@ const Information = ({ product }: Props) => {
         <div className={style['label']}>SKU Number</div>
         <div className={style['value']}>SKU-{product.id}</div>
       </div>
-      {/* <div className={style['row']}>
-        <div className={style['label']}>Part Number</div>
-        <div className={style['value']}>{product.code || '-'}</div>
-      </div> */}
       <div className={style['row']}>
         <div className={style['label']}>Manufacture</div>
         <div className={style['value']}>
@@ -48,35 +45,10 @@ const Information = ({ product }: Props) => {
           ) : '-'}
         </div>
       </div>
-      {/* <div className={style['row']}>
-        <div className={style['label']}>Preparation Time</div>
-        <div className={style['value']}>
-          {product.variant_total > 1 && 'Lihat Variant'}
-          {product.variant_total === 1 && (
-            <Skeleton isLoaded={querySLA.isSuccess} w={querySLA.isSuccess ? '100%' : '40px'} h='100%'>
-              {sla?.sla_date}
-            </Skeleton>
-          )}
-        </div>
-      </div>
       <div className={style['row']}>
-        <div className={style['label']}>Stock</div>
-        <div className={style['value']}>
-          {product.variant_total > 1 && 'Lihat Variant'}
-          {product.variant_total === 1 && (
-            <Skeleton isLoaded={querySLA.isSuccess} w={querySLA.isSuccess ? '100%' : '10px'} h='100%'>
-              {sla?.qty && sla.qty > 0 ? sla?.qty : '-'}
-            </Skeleton>
-          )}
-        </div>
+        <div className={style['label']}>Terjual</div>
+        <div className={style['value']}>{product.qty_sold > 0 ? formatToShortText(product.qty_sold) : '-'}</div>
       </div>
-      <div className={style['row']}>
-        <div className={style['label']}>Weight</div>
-        <div className={style['value']}>
-          {product.variant_total > 1 && 'Lihat Variant'}
-          {product.variant_total === 1 && (product.weight > 0 ? `${product.weight} kg` : '-')}
-        </div>
-      </div> */}
     </div>
   )
 }
-- 
cgit v1.2.3