From 3f849355048e5c280a35a5747577e5296b90e9fd Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 25 Jan 2024 15:27:27 +0700
Subject: Add all promo page

---
 src-migrate/modules/promo/components/Voucher.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 src-migrate/modules/promo/components/Voucher.tsx

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
new file mode 100644
index 00000000..11742f9a
--- /dev/null
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -0,0 +1,11 @@
+import style from '../styles/voucher.module.css'
+
+const Voucher = () => {
+  return (
+    <>
+      <div className={style['title']}>Pakai Voucher Belanja</div>
+    </>
+  )
+}
+
+export default Voucher
\ No newline at end of file
-- 
cgit v1.2.3


From 8d8c43d90373aab6238773e291a48d65d55c52a2 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 17 Feb 2024 10:23:23 +0700
Subject: Add voucher section

---
 src-migrate/modules/promo/components/Voucher.tsx | 73 ++++++++++++++++++++++++
 1 file changed, 73 insertions(+)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 11742f9a..0706f044 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -1,9 +1,82 @@
+import { useMemo } from 'react'
+import { useQuery } from 'react-query'
+import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'
+import { getVoucher } from '~/services/voucher'
 import style from '../styles/voucher.module.css'
+import Image from 'next/image'
+import { useToast } from '@chakra-ui/react'
+
+const swiperVoucher: SwiperProps = {
+  autoplay: {
+    delay: 6000,
+    disableOnInteraction: false
+  },
+  loop: false,
+  className: 'h-[160px] w-full',
+  slidesPerView: 3,
+  spaceBetween: 16
+}
 
 const Voucher = () => {
+  const toast = useToast();
+  const voucherQuery = useQuery({
+    queryKey: ['voucher.all-voucher'],
+    queryFn: getVoucher
+  })
+
+  const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
+
+  const copyText = (text: string) => {
+    navigator.clipboard.writeText(text)
+    toast({
+      title: 'Salin ke papan klip',
+      description: 'Kode voucher berhasil disalin',
+      status: 'success',
+      duration: 3000,
+      isClosable: true,
+      position: 'bottom',
+    })
+  }
+
   return (
     <>
       <div className={style['title']}>Pakai Voucher Belanja</div>
+
+      <div className='h-6' />
+
+      {voucherQuery.isLoading && (
+        <div className='grid grid-cols-3 gap-x-4 animate-pulse'>
+          {Array.from({ length: 3 }).map((_, index) => (
+            <div key={index} className='w-full h-[160px] bg-gray-200 rounded-xl' />
+          ))}
+        </div>
+      )}
+      {!voucherQuery.isLoading && (
+        <div className={style['voucher-section']}>
+          <Swiper {...swiperVoucher}>
+            {vouchers.map((voucher) => (
+              <SwiperSlide key={voucher.id} className='pb-2'>
+                <div className={style['voucher-card']}>
+                  <Image src={voucher.image} alt={voucher.name} width={128} height={128} className={style['voucher-image']} />
+
+                  <div className={style['voucher-content']}>
+                    <div className={style['voucher-title']}>{voucher.name}</div>
+                    <div className={style['voucher-desc']}>{voucher.description} Lorem ipsum dolor sit, amet consectetur adipisicing elit. Officiis magni nobis sint aspernatur soluta deserunt excepturi delectus corporis libero, voluptate odit! Cupiditate, quibusdam ipsa saepe voluptas repudiandae eum quaerat suscipit.</div>
+                    <div className={style['voucher-bottom']}>
+                      <div>
+                        <div className={style['voucher-code-desc']}>Kode Promo</div>
+                        <div className={style['voucher-code']}>{voucher.code}</div>
+                      </div>
+                      <button className={style['voucher-copy']} onClick={() => copyText(voucher.code)}>Salin</button>
+                    </div>
+                  </div>
+                </div>
+              </SwiperSlide>
+            ))}
+          </Swiper>
+        </div>
+      )}
+
     </>
   )
 }
-- 
cgit v1.2.3


From 040657403a01205b22e1028d8ebea971f5df9ac5 Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Tue, 4 Jun 2024 13:28:20 +0700
Subject: promo line

---
 src-migrate/modules/promo/components/Voucher.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 0706f044..14d3c301 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -61,7 +61,7 @@ const Voucher = () => {
 
                   <div className={style['voucher-content']}>
                     <div className={style['voucher-title']}>{voucher.name}</div>
-                    <div className={style['voucher-desc']}>{voucher.description} Lorem ipsum dolor sit, amet consectetur adipisicing elit. Officiis magni nobis sint aspernatur soluta deserunt excepturi delectus corporis libero, voluptate odit! Cupiditate, quibusdam ipsa saepe voluptas repudiandae eum quaerat suscipit.</div>
+                    <div className={style['voucher-desc']}>{voucher.description}</div>
                     <div className={style['voucher-bottom']}>
                       <div>
                         <div className={style['voucher-code-desc']}>Kode Promo</div>
-- 
cgit v1.2.3


From 367bf6f382392774680abcf4a5ca4b4d03915650 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 14:31:45 +0700
Subject: <iman> update mobile view

---
 src-migrate/modules/promo/components/Voucher.tsx | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 14d3c301..397134e8 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -5,25 +5,27 @@ import { getVoucher } from '~/services/voucher'
 import style from '../styles/voucher.module.css'
 import Image from 'next/image'
 import { useToast } from '@chakra-ui/react'
+import useDevice from '@/core/hooks/useDevice';
 
-const swiperVoucher: SwiperProps = {
-  autoplay: {
-    delay: 6000,
-    disableOnInteraction: false
-  },
-  loop: false,
-  className: 'h-[160px] w-full',
-  slidesPerView: 3,
-  spaceBetween: 16
-}
 
 const Voucher = () => {
+  const { isMobile } = useDevice();
   const toast = useToast();
   const voucherQuery = useQuery({
     queryKey: ['voucher.all-voucher'],
     queryFn: getVoucher
   })
-
+  
+  const swiperVoucher: SwiperProps = {
+    autoplay: {
+      delay: 6000,
+      disableOnInteraction: false
+    },
+    loop: false,
+    className: 'h-[160px] w-full',
+    slidesPerView: isMobile ? 1.2 : 3,
+    spaceBetween: 16
+  }
   const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
 
   const copyText = (text: string) => {
-- 
cgit v1.2.3


From aedf523be9b0faf9cdd7a2231912a074fccdb262 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 15:00:29 +0700
Subject: <iman> update salin voucher

---
 src-migrate/modules/promo/components/Voucher.tsx | 54 ++++++++++++++++++------
 1 file changed, 42 insertions(+), 12 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 397134e8..c978dc7b 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -7,7 +7,6 @@ import Image from 'next/image'
 import { useToast } from '@chakra-ui/react'
 import useDevice from '@/core/hooks/useDevice';
 
-
 const Voucher = () => {
   const { isMobile } = useDevice();
   const toast = useToast();
@@ -26,18 +25,50 @@ const Voucher = () => {
     slidesPerView: isMobile ? 1.2 : 3,
     spaceBetween: 16
   }
+  
   const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
 
   const copyText = (text: string) => {
-    navigator.clipboard.writeText(text)
-    toast({
-      title: 'Salin ke papan klip',
-      description: 'Kode voucher berhasil disalin',
-      status: 'success',
-      duration: 3000,
-      isClosable: true,
-      position: 'bottom',
-    })
+    if (navigator.clipboard && navigator.clipboard.writeText) {
+      navigator.clipboard.writeText(text)
+        .then(() => {
+          toast({
+            title: 'Salin ke papan klip',
+            description: 'Kode voucher berhasil disalin',
+            status: 'success',
+            duration: 3000,
+            isClosable: true,
+            position: 'bottom',
+          })
+        })
+        .catch(() => {
+          fallbackCopyTextToClipboard(text);
+        });
+    } else {
+      fallbackCopyTextToClipboard(text);
+    }
+  }
+
+  const fallbackCopyTextToClipboard = (text: string) => {
+    const textArea = document.createElement("textarea");
+    textArea.value = text;
+    document.body.appendChild(textArea);
+    textArea.focus();
+    textArea.select();
+    try {
+      document.execCommand('copy');
+      toast({
+        title: 'Salin ke papan klip',
+        description: 'Kode voucher berhasil disalin',
+        status: 'success',
+        duration: 3000,
+        isClosable: true,
+        position: 'bottom',
+      })
+    } catch (err) {
+      console.error('Fallback: Oops, unable to copy', err);
+    }
+    document.body.removeChild(textArea);
   }
 
   return (
@@ -78,9 +109,8 @@ const Voucher = () => {
           </Swiper>
         </div>
       )}
-
     </>
   )
 }
 
-export default Voucher
\ No newline at end of file
+export default Voucher
-- 
cgit v1.2.3


From 6a9e4aaaf73677b3b0650e93560c6738781f76c2 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 15:13:01 +0700
Subject: <iman> update button salin voucher

---
 src-migrate/modules/promo/components/Voucher.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index c978dc7b..b5a25aa9 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -28,7 +28,8 @@ const Voucher = () => {
   
   const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
 
-  const copyText = (text: string) => {
+  const copyText = (text: string, event: React.MouseEvent<HTMLButtonElement>) => {
+    event.preventDefault();
     if (navigator.clipboard && navigator.clipboard.writeText) {
       navigator.clipboard.writeText(text)
         .then(() => {
@@ -100,7 +101,7 @@ const Voucher = () => {
                         <div className={style['voucher-code-desc']}>Kode Promo</div>
                         <div className={style['voucher-code']}>{voucher.code}</div>
                       </div>
-                      <button className={style['voucher-copy']} onClick={() => copyText(voucher.code)}>Salin</button>
+                      <button className={style['voucher-copy']} onClick={(event) => copyText(voucher.code, event)}>Salin</button>
                     </div>
                   </div>
                 </div>
-- 
cgit v1.2.3


From 120804d474b12743fb7e6fe9a5a3b024e52707d7 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 15:16:34 +0700
Subject: <iman> update button salin voucher

---
 src-migrate/modules/promo/components/Voucher.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index b5a25aa9..9e28a583 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -28,8 +28,7 @@ const Voucher = () => {
   
   const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
 
-  const copyText = (text: string, event: React.MouseEvent<HTMLButtonElement>) => {
-    event.preventDefault();
+  const copyText = (text: string) => {
     if (navigator.clipboard && navigator.clipboard.writeText) {
       navigator.clipboard.writeText(text)
         .then(() => {
@@ -53,6 +52,17 @@ const Voucher = () => {
   const fallbackCopyTextToClipboard = (text: string) => {
     const textArea = document.createElement("textarea");
     textArea.value = text;
+    // Tambahkan style untuk menyembunyikan textArea secara visual
+    textArea.style.position = 'fixed';
+    textArea.style.top = '0';
+    textArea.style.left = '0';
+    textArea.style.width = '2em';
+    textArea.style.height = '2em';
+    textArea.style.padding = '0';
+    textArea.style.border = 'none';
+    textArea.style.outline = 'none';
+    textArea.style.boxShadow = 'none';
+    textArea.style.background = 'transparent';
     document.body.appendChild(textArea);
     textArea.focus();
     textArea.select();
@@ -101,7 +111,7 @@ const Voucher = () => {
                         <div className={style['voucher-code-desc']}>Kode Promo</div>
                         <div className={style['voucher-code']}>{voucher.code}</div>
                       </div>
-                      <button className={style['voucher-copy']} onClick={(event) => copyText(voucher.code, event)}>Salin</button>
+                      <button className={style['voucher-copy']} onClick={() => copyText(voucher.code)}>Salin</button>
                     </div>
                   </div>
                 </div>
-- 
cgit v1.2.3


From 2fbf5023e0d29765458b3385f354b416d08c42c4 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 15:32:34 +0700
Subject: <iman> update position toast

---
 src-migrate/modules/promo/components/Voucher.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 9e28a583..89b08a01 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -38,7 +38,7 @@ const Voucher = () => {
             status: 'success',
             duration: 3000,
             isClosable: true,
-            position: 'bottom',
+            position: 'top',
           })
         })
         .catch(() => {
-- 
cgit v1.2.3


From ffaf9994e8c47c5a32a2091b7d0949302528ee2e Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 17:06:55 +0700
Subject: <iman> update button voucher

---
 src-migrate/modules/promo/components/Voucher.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 89b08a01..64b6b935 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -74,7 +74,7 @@ const Voucher = () => {
         status: 'success',
         duration: 3000,
         isClosable: true,
-        position: 'bottom',
+        position: 'top',
       })
     } catch (err) {
       console.error('Fallback: Oops, unable to copy', err);
-- 
cgit v1.2.3


From 061400a92ef10ac5f9eb1ac05a7b97bd4b3a0cd5 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 11 Jul 2024 14:09:29 +0700
Subject: <iman> update voucher default & coucher by id

---
 src-migrate/modules/promo/components/Voucher.tsx | 67 ++++++++++++++++++------
 1 file changed, 50 insertions(+), 17 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 64b6b935..729d957e 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -1,32 +1,65 @@
-import { useMemo } from 'react'
-import { useQuery } from 'react-query'
-import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'
-import { getVoucher } from '~/services/voucher'
-import style from '../styles/voucher.module.css'
-import Image from 'next/image'
-import { useToast } from '@chakra-ui/react'
+import { useMemo, useState, useEffect } from 'react';
+import { useQuery } from 'react-query';
+import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react';
+import { getVoucherAll } from '~/services/voucher';
+import style from '../styles/voucher.module.css';
+import Image from 'next/image';
+import { useToast } from '@chakra-ui/react';
 import useDevice from '@/core/hooks/useDevice';
+import useAuth from '@/core/hooks/useAuth';
+import { getVoucher } from '../../../../src/lib/checkout/api/getVoucher';
 
-const Voucher = () => {
+interface Auth {
+  id: string;
+}
+interface Voucher {
+  id: string;
+  image: string;
+  name: string;
+  description: string;
+  code: string;
+}
+
+const VoucherComponent = () => {
+  const [listVouchers, setListVouchers] = useState<Voucher[] | null>(null);
+  const [loadingVoucher, setLoadingVoucher] = useState(true);
   const { isMobile } = useDevice();
+  const auth = useAuth() as unknown as Auth;
   const toast = useToast();
+
+  useEffect(() => {
+    if (!listVouchers && auth?.id) {
+      (async () => {
+        try {
+          const dataVoucher = await getVoucher(auth.id);
+          setListVouchers(dataVoucher);
+        } finally {
+          setLoadingVoucher(false);
+        }
+      })();
+    }
+  }, [auth?.id, listVouchers]);
+
   const voucherQuery = useQuery({
     queryKey: ['voucher.all-voucher'],
-    queryFn: getVoucher
-  })
-  
+    queryFn: getVoucherAll,
+  });
+
   const swiperVoucher: SwiperProps = {
     autoplay: {
       delay: 6000,
-      disableOnInteraction: false
+      disableOnInteraction: false,
     },
     loop: false,
     className: 'h-[160px] w-full',
     slidesPerView: isMobile ? 1.2 : 3,
-    spaceBetween: 16
-  }
+    spaceBetween: 16,
+  };
   
-  const vouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
+  const dataVouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
+
+  const vouchers = auth?.id? listVouchers : dataVouchers;
+
 
   const copyText = (text: string) => {
     if (navigator.clipboard && navigator.clipboard.writeText) {
@@ -98,7 +131,7 @@ const Voucher = () => {
       {!voucherQuery.isLoading && (
         <div className={style['voucher-section']}>
           <Swiper {...swiperVoucher}>
-            {vouchers.map((voucher) => (
+            {vouchers?.map((voucher) => (
               <SwiperSlide key={voucher.id} className='pb-2'>
                 <div className={style['voucher-card']}>
                   <Image src={voucher.image} alt={voucher.name} width={128} height={128} className={style['voucher-image']} />
@@ -124,4 +157,4 @@ const Voucher = () => {
   )
 }
 
-export default Voucher
+export default VoucherComponent
-- 
cgit v1.2.3


From ec726a8d106992b4e4a9fd79863b64ea2112a218 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 17 Jul 2024 16:49:26 +0700
Subject: <iman> update voucher

---
 src-migrate/modules/promo/components/Voucher.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src-migrate/modules/promo/components/Voucher.tsx')

diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx
index 729d957e..e5877e51 100644
--- a/src-migrate/modules/promo/components/Voucher.tsx
+++ b/src-migrate/modules/promo/components/Voucher.tsx
@@ -52,8 +52,8 @@ const VoucherComponent = () => {
     },
     loop: false,
     className: 'h-[160px] w-full',
-    slidesPerView: isMobile ? 1.2 : 3,
-    spaceBetween: 16,
+    slidesPerView: isMobile ? 1.2 : 3.2,
+    spaceBetween: 2,
   };
   
   const dataVouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]);
-- 
cgit v1.2.3

