diff options
| -rw-r--r-- | src-migrate/modules/cart/components/Item.tsx | 59 | ||||
| -rw-r--r-- | src-migrate/modules/product-promo/components/Item.tsx | 97 |
2 files changed, 25 insertions, 131 deletions
diff --git a/src-migrate/modules/cart/components/Item.tsx b/src-migrate/modules/cart/components/Item.tsx index fed11eb0..6ded6373 100644 --- a/src-migrate/modules/cart/components/Item.tsx +++ b/src-migrate/modules/cart/components/Item.tsx @@ -4,8 +4,7 @@ import { Skeleton, SkeletonProps, Tooltip } from '@chakra-ui/react' import { InfoIcon } from 'lucide-react' import Image from 'next/image' import Link from 'next/link' -import ImageNext from 'next/image'; -import { useEffect, useState } from 'react'; + import { PROMO_CATEGORY } from '~/constants/promotion' import formatCurrency from '~/libs/formatCurrency' import { createSlug } from '~/libs/slug' @@ -21,31 +20,6 @@ type Props = { } const CartItem = ({ item, editable = true }: Props) => { - const [isSni, setIsSni] = useState(false); - const [isTkdn, setTkdn] = useState(false); - - useEffect(() => { - const fetchData = async () => { - try { - const responseSni = await fetch('URL_API_SNI'); - const dataSni = await responseSni.json(); - setIsSni(dataSni && dataSni.sni); - - const responseTkdn = await fetch('URL_API_TKDN'); - const dataTkdn = await responseTkdn.json(); - setTkdn(dataTkdn && dataTkdn.tkdn); - } catch (error) { - console.error('Error fetching data:', error); - setIsSni(false); - setTkdn(false); - } - }; - - fetchData(); - - return () => {}; - }, []); - return ( <div className={style.wrapper}> {item.cart_type === 'promotion' && ( @@ -72,7 +46,7 @@ const CartItem = ({ item, editable = true }: Props) => { {editable && <CartItemSelect item={item} />} <div className='w-4' /> - <CartItem.Image item={item} isSni={isSni} isTkdn={isTkdn} /> + <CartItem.Image item={item} /> <div className={style.details}> <CartItem.Name item={item} /> @@ -124,7 +98,7 @@ const CartItem = ({ item, editable = true }: Props) => { ) } -CartItem.Image = function CartItemImage({ item, isSni, isTkdn }: { item: CartItemProps, isSni: boolean, isTkdn: boolean }) { +CartItem.Image = function CartItemImage({ item }: { item: CartItemProps }) { const image = item?.image || item?.parent?.image return ( @@ -142,31 +116,6 @@ CartItem.Image = function CartItemImage({ item, isSni, isTkdn }: { item: CartIte className={style.image} > {image && <Image src={image} alt={item.name} width={128} height={128} />} - - <div className="relative top-2 right-4 flex"> - {/* <div className="gambarB mr-1 bg-red-100"> */} - {!isSni && ( - <ImageNext - src="/images/sni-logo.png" - alt="SNI Logo" - className="w-4 h-3 object-contain object-top sm:h-4" - width={50} - height={50} - /> - )} - {/* </div> */} - {/* <div className="gambarC bg-red-500"> */} - {!isTkdn && ( - <ImageNext - src="/images/TKDN.png" - alt="TKDN" - className="w-10 h-5 object-contain object-top ml-1 mr-1 sm:h-10" - width={50} - height={50} - /> - )} - {/* </div> */} - </div> {!image && <div className={style.noImage}>No Image</div>} </Link> )} @@ -204,4 +153,4 @@ CartItem.Skeleton = function CartItemSkeleton(props: SkeletonProps & { count: nu )) } -export default CartItem +export default CartItem
\ No newline at end of file diff --git a/src-migrate/modules/product-promo/components/Item.tsx b/src-migrate/modules/product-promo/components/Item.tsx index 4d1808c2..b396160f 100644 --- a/src-migrate/modules/product-promo/components/Item.tsx +++ b/src-migrate/modules/product-promo/components/Item.tsx @@ -1,89 +1,34 @@ -import style from '../styles/item.module.css'; -import ImageNext from 'next/image'; -import { useEffect, useState } from 'react'; -import { Tooltip } from '@chakra-ui/react'; +import style from '../styles/item.module.css' -import Image from '~/components/ui/image'; -import { IProductVariantPromo } from '~/types/promotion'; +import { Tooltip } from '@chakra-ui/react' -type Props = { - variant: IProductVariantPromo; - isFree?: boolean; -}; - -const ProductPromoItem = ({ variant, isFree = false }: Props) => { - const [isSni, setIsSni] = useState(false); - const [isTkdn, setTkdn] = useState(false); - - useEffect(() => { - // Lakukan pemanggilan API untuk memeriksa isSni dan isTkdn - const fetchData = async () => { - try { - const responseSni = await fetch('URL_API_SNI'); - const dataSni = await responseSni.json(); - setIsSni(dataSni && dataSni.sni); - - const responseTkdn = await fetch('URL_API_TKDN'); - const dataTkdn = await responseTkdn.json(); - setTkdn(dataTkdn && dataTkdn.tkdn); - } catch (error) { - console.error('Error fetching data:', error); - setIsSni(false); - setTkdn(false); - } - }; - - fetchData(); - - return () => {}; - }, []); +import Image from '~/components/ui/image' +import { IProductVariantPromo } from '~/types/promotion' +type Props = { + variant: IProductVariantPromo, + isFree?: boolean +} + +const ProductPromoItem = ({ + variant, + isFree = false +}: Props) => { return ( <div className={style.item}> <div className={style.image}> - <div className="relative"> - <Image - src={variant.image || '/images/noimage.jpeg'} - alt={variant.display_name} - width={120} - height={120} - quality={100} - /> - <div className="absolute top-0 right-0 flex mt-2"> - {!isSni && ( - <div className="w-2 h-4 sm:h-6 mr-1"> - <ImageNext - src="/images/sni-logo.png" - alt="SNI Logo" - className="object-contain object-top" - width={50} - height={50} - /> - </div> - )} - {!isTkdn && ( - <div className="w-4 h-5 sm:h-6 ml-1"> - <ImageNext - src="/images/TKDN.png" - alt="TKDN" - className="object-contain object-top" - width={50} - height={50} - /> - </div> - )} - </div> - </div> - + <Image src={variant.image || '/images/noimage.jpeg'} alt={variant.display_name} width={120} height={120} quality={100} /> <div className={style.quantity}> {variant.qty} pcs {isFree ? '(free)' : ''} </div> </div> - <Tooltip label={variant.display_name} placement="top" fontSize="sm"> - <div className={style.name}>{variant.name}</div> + <Tooltip label={variant.display_name} placement='top' fontSize='sm'> + <div className={style.name}> + {variant.name} + </div> </Tooltip> </div> - ); -}; + ) +} -export default ProductPromoItem; +export default ProductPromoItem
\ No newline at end of file |