4 files changed, 75 insertions, 19 deletions

diff --git a/src-migrate/pages/shop/cart/cart.module.css b/src-migrate/pages/shop/cart/cart.module.css
index 98a6ac86..806104be 100644
--- a/src-migrate/pages/shop/cart/cart.module.css
+++ b/src-migrate/pages/shop/cart/cart.module.css
@@ -29,3 +29,7 @@
 .summary-buttons {
     @apply grid grid-cols-2 gap-x-3 mt-6;
 }
+
+.summary-buttons-step-approval {
+    @apply grid grid-cols-1 gap-y-3 mt-6;
+}
diff --git a/src-migrate/pages/shop/cart/index.tsx b/src-migrate/pages/shop/cart/index.tsx
index 4b4de92b..d89707d2 100644
--- a/src-migrate/pages/shop/cart/index.tsx
+++ b/src-migrate/pages/shop/cart/index.tsx
@@ -16,13 +16,17 @@ import Image from '~/components/ui/image';
 
 const CartPage = () => {
   const auth = getAuth();
+  const [isStepApproval, setIsStepApproval] = React.useState(false);
 
   const { loadCart, cart, summary } = useCartStore();
 
   const useDivvice = useDevice();
 
   useEffect(() => {
-    if (typeof auth === 'object' && !cart) loadCart(auth.id);
+    if (typeof auth === 'object' && !cart) {
+      loadCart(auth.id);
+      setIsStepApproval(auth?.feature?.soApproval);
+    }
   }, [auth, loadCart, cart]);
 
   const hasSelectedPromo = useMemo(() => {
@@ -106,7 +110,7 @@ const CartPage = () => {
               <CartSummary {...summary} isLoaded={!!cart} />
             )}
 
-            <div className={style['summary-buttons']}>
+            <div className={isStepApproval ? style['summary-buttons-step-approval'] : style['summary-buttons']  }>
               <Tooltip
                 label={
                   hasSelectedPromo &&
@@ -123,23 +127,24 @@ const CartPage = () => {
                   Quotation
                 </Button>
               </Tooltip>
-
-              <Tooltip
-                label={clsxm({
-                  'Tidak ada item yang dipilih': !hasSelected,
-                  'Terdapat item yang tidak ada harga': hasSelectNoPrice,
-                })}
-              >
-                <Button
-                  colorScheme='red'
-                  w='full'
-                  isDisabled={!hasSelected || hasSelectNoPrice}
-                  as={Link}
-                  href='/shop/checkout'
+              {!isStepApproval && (
+                <Tooltip
+                  label={clsxm({
+                    'Tidak ada item yang dipilih': !hasSelected,
+                    'Terdapat item yang tidak ada harga': hasSelectNoPrice,
+                  })}
                 >
-                  Checkout
-                </Button>
-              </Tooltip>
+                  <Button
+                    colorScheme='red'
+                    w='full'
+                    isDisabled={!hasSelected || hasSelectNoPrice}
+                    as={Link}
+                    href='/shop/checkout'
+                  >
+                    Checkout
+                  </Button>
+                </Tooltip>
+              )}
             </div>
           </div>
         </div>
diff --git a/src-migrate/pages/shop/product/[slug].tsx b/src-migrate/pages/shop/product/[slug].tsx
index 733e10d9..fc72a6b0 100644
--- a/src-migrate/pages/shop/product/[slug].tsx
+++ b/src-migrate/pages/shop/product/[slug].tsx
@@ -1,5 +1,5 @@
 import { GetServerSideProps, NextPage } from 'next'
-import React from 'react'
+import React, { useEffect } from 'react'
 import dynamic from 'next/dynamic'
 import cookie from 'cookie'
 
@@ -9,6 +9,7 @@ import { IProductDetail } from '~/types/product'
 
 import { Seo } from '~/components/seo'
 import { useRouter } from 'next/router'
+import { useProductContext } from '@/contexts/ProductContext'
 
 const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'), { ssr: false })
 const ProductDetail = dynamic(() => import('~/modules/product-detail'), { ssr: false })
@@ -40,6 +41,12 @@ const SELF_HOST = process.env.NEXT_PUBLIC_SELF_HOST
 const ProductDetailPage: NextPage<PageProps> = ({ product }) => {
   const router = useRouter();
 
+  const { setProduct } = useProductContext();
+
+  useEffect(() => {
+    if (product) setProduct(product);
+  }, [product, setProduct]);
+
   return (
     <BasicLayout>
       <Seo
diff --git a/src-migrate/pages/shop/promo/index.tsx b/src-migrate/pages/shop/promo/index.tsx
new file mode 100644
index 00000000..7c4df2c1
--- /dev/null
+++ b/src-migrate/pages/shop/promo/index.tsx
@@ -0,0 +1,40 @@
+import dynamic from 'next/dynamic'
+import React, { useState } from 'react'
+import { LazyLoadComponent } from 'react-lazy-load-image-component'
+import Hero from '~/modules/promo/components/Hero'
+import PromotionProgram from '~/modules/promo/components/PromotinProgram'
+import Voucher from '~/modules/promo/components/Voucher'
+import FlashSale from '../../../modules/promo/components/FlashSale'
+const PromoList = dynamic(() => import('../../../modules/promo/components/PromoList'));
+
+
+
+const PromoPage = () => {
+  const [selectedPromo, setSelectedPromo] = useState('Bundling');
+  return (
+    <>
+      <LazyLoadComponent>
+        <Hero />
+      </LazyLoadComponent>
+
+
+      <LazyLoadComponent>
+        <PromotionProgram 
+                  selectedPromo={selectedPromo} 
+                  onSelectPromo={setSelectedPromo} 
+              />
+        <PromoList selectedPromo={selectedPromo} />
+      </LazyLoadComponent>
+    
+      <LazyLoadComponent>
+        <FlashSale />
+      </LazyLoadComponent>
+      <h1 className='h-4'></h1>
+      <LazyLoadComponent>
+        <Voucher />
+      </LazyLoadComponent>
+    </>
+  )
+}
+
+export default PromoPage
\ No newline at end of file