1 files changed, 9 insertions, 3 deletions
diff --git a/src-migrate/pages/shop/promo/index.tsx b/src-migrate/pages/shop/promo/index.tsx
index 133be6df..5fdd80aa 100644
--- a/src-migrate/pages/shop/promo/index.tsx
+++ b/src-migrate/pages/shop/promo/index.tsx
@@ -1,10 +1,13 @@
-import React from 'react'
+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'
+const PromoList = dynamic(() => import('../../../modules/promo/components/PromoList'));
 
 const PromoPage = () => {
+  const [selectedPromo, setSelectedPromo] = useState('Bundling');
   return (
     <>
       <LazyLoadComponent>
@@ -14,9 +17,12 @@ const PromoPage = () => {
       <div className='h-10' />
 
       <LazyLoadComponent>
-        <PromotionProgram/>
+      <PromotionProgram 
+                selectedPromo={selectedPromo} 
+                onSelectPromo={setSelectedPromo} 
+            />
       </LazyLoadComponent>
-      
+      <PromoList selectedPromo={selectedPromo} />
       <div className='h-10' />
 
       <LazyLoadComponent>