handling cart

1 files changed, 31 insertions, 6 deletions

diff --git a/src/lib/promotinProgram/components/PromotionType.jsx b/src/lib/promotinProgram/components/PromotionType.jsx
index a6382cb1..8c31cf0d 100644
--- a/src/lib/promotinProgram/components/PromotionType.jsx
+++ b/src/lib/promotinProgram/components/PromotionType.jsx
@@ -47,6 +47,20 @@ const PromotionType = ({ isModal = false }) => {
       type: 'Promo Bundling'
     },
     {
+      id: 7,
+      title: 'Promo 5',
+      description: 'Deskripsi Promo 2',
+      image: '/path/to/image2.jpg',
+      type: 'Promo Bundling'
+    },
+    {
+      id: 8,
+      title: 'Promo 5',
+      description: 'Deskripsi Promo 2',
+      image: '/path/to/image2.jpg',
+      type: 'Promo Bundling'
+    },
+    {
       id: 6,
       title: 'Promo 6',
       description: 'Deskripsi Promo 3',
@@ -76,12 +90,12 @@ const PromotionType = ({ isModal = false }) => {
   }
 
   const handlePopUp = () => {
-    if(isModal == false){
+    if (isModal == false) {
       setPromotionType(true)
     }
   }
   return (
-    <div className='h-[50%]'>
+    <div className='h-[50%] relative'>
       <div className='relative rounded-lg border border-solid border-gray-300 mb-2 w-full'>
         <Image src='https://placehold.co/537x50.png' alt='' layout='fill' objectFit='cover' />
         <div className='h-full absolute top-0 left-0 w-full flex items-center justify-between p-2'>
@@ -144,9 +158,15 @@ const PromotionType = ({ isModal = false }) => {
                       </div>
                       <p className='text-justify text-gray-500 line-clamp-3'>
                         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut nibh at arcu
-                        commodo auctor. Maecenas efficitur, ipsum sed mollis fermentum, nulla sem ada lah ini ditu kamu dia merek
+                        commodo auctor. Maecenas efficitur, ipsum sed mollis fermentum, nulla sem
+                        ada lah ini ditu kamu dia merek
                       </p>
-                      <div className='text-danger-500 font-semibold mb-1 mt-2'>Rp. 999.000</div>
+                      <div className='flex justify-between mt-3'>
+                        <div className='text-danger-500 font-semibold '>Rp. 999.000</div>
+                        <div className='w-[50%] bg-yellow-200 rounded-full h-5'>
+                          <div className='bg-yellow-500 h-5 rounded-full w-[90%]'> <span className='text-black ml-1'>+999 Produk Terjual</span></div>
+                        </div>
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -157,7 +177,7 @@ const PromotionType = ({ isModal = false }) => {
             if (index > 2) {
               return null
             } else {
-              if (index === 2) {
+              if (index === 2 && promos.length > 2) {
                 return (
                   <>
                     <div
@@ -205,8 +225,13 @@ const PromotionType = ({ isModal = false }) => {
                       </div>
                       <div className='p-2'>
                         <div className='badge-yellow  text-black mb-1'>{promo.title}</div>
-                        <p className='text-justify line-clamp-2'>Lorem ipsum dolor sit amet, consectetur ...</p>
+                        <p className='text-justify line-clamp-2'>
+                          Lorem ipsum dolor sit amet, consectetur ...
+                        </p>
                         <div className='text-danger-500 font-semibold mb-1 mt-1'>999900</div>
+                        <div className='w-full bg-yellow-200 rounded-full h-1.5 mb-2'>
+                          <div className='bg-yellow-500 h-1.5 rounded-full w-[45%]'></div>
+                        </div>
                         <div>
                           <CountDown2 initialTime={360}></CountDown2>
                         </div>