Merged in Feature/all-promotion (pull request #159)

Feature/all promotion

4 files changed, 56 insertions, 21 deletions

diff --git a/src-migrate/modules/cart/components/Item.tsx b/src-migrate/modules/cart/components/Item.tsx
index 6ded6373..a382279f 100644
--- a/src-migrate/modules/cart/components/Item.tsx
+++ b/src-migrate/modules/cart/components/Item.tsx
@@ -100,13 +100,14 @@ const CartItem = ({ item, editable = true }: Props) => {
 
 CartItem.Image = function CartItemImage({ item }: { item: CartItemProps }) {
   const image = item?.image || item?.parent?.image
+  const imageProgram = item?.image_program ? item.image_program[0] : item?.parent?.image;
 
-  return (
+  return (  
     <>
       {item.cart_type === 'promotion' && (
         <div className={style.image}>
-          {image && <Image src={image} alt={item.name} width={128} height={128} />}
-          {!image && <div className={style.noImage}>No Image</div>}
+          {imageProgram && <Image src={imageProgram} alt={item.name} width={128} height={128} />}
+          {!imageProgram && <div className={style.noImage}>No Image</div>}
         </div>
       )}
 
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
diff --git a/src-migrate/services/voucher.ts b/src-migrate/services/voucher.ts
index 447b448e..13d9e2c0 100644
--- a/src-migrate/services/voucher.ts
+++ b/src-migrate/services/voucher.ts
@@ -1,7 +1,7 @@
 import odooApi from '~/libs/odooApi';
 import { IVoucher } from '~/types/voucher';
 
-export const getVoucher = async (): Promise<IVoucher[]> => {
+export const getVoucherAll = async (): Promise<IVoucher[]> => {
   const url = `/api/v1/voucher`;
 
   return await odooApi('GET', url);
diff --git a/src-migrate/types/cart.ts b/src-migrate/types/cart.ts
index 5a2cf4a9..4e3c8b99 100644
--- a/src-migrate/types/cart.ts
+++ b/src-migrate/types/cart.ts
@@ -23,6 +23,7 @@ export type CartProduct = {
 };
 
 export type CartItem = {
+  image_program: string;
   cart_id: number;
   quantity: number;
   selected: boolean;