diff options
| -rw-r--r-- | src/lib/product/components/Product/ProductDesktopVariant.jsx | 15 | ||||
| -rw-r--r-- | src/lib/product/components/Product/ProductMobileVariant.jsx | 9 |
2 files changed, 17 insertions, 7 deletions
diff --git a/src/lib/product/components/Product/ProductDesktopVariant.jsx b/src/lib/product/components/Product/ProductDesktopVariant.jsx index a6871fa2..1584dc92 100644 --- a/src/lib/product/components/Product/ProductDesktopVariant.jsx +++ b/src/lib/product/components/Product/ProductDesktopVariant.jsx @@ -314,6 +314,11 @@ const ProductDesktopVariant = ({ fetchData(); }, [product]); + const getImageVariant = (img) => { + if (!img || img.trim() === '') return '/images/noimage.jpeg'; + return `${img}?variant=True`; + }; + return ( <DesktopView> <div className='relative'> @@ -332,8 +337,8 @@ const ProductDesktopVariant = ({ <div className='w-full flex flex-wrap'> <div className='w-5/12'> <Image - src={product.image + '?variant=True'} - alt={product.name} + src={getImageVariant(product?.image)} + alt={product?.name} className='w-full h-[350px]' /> </div> @@ -345,9 +350,9 @@ const ProductDesktopVariant = ({ size={18} className='text-red-600 shrink-0 mx-2' /> - <div className='text-red-600 font-normal text-h-lg p-2'> - Maaf untuk saat ini Produk yang anda cari tidak tersedia - </div> + <div className='text-red-600 font-normal text-h-lg p-2'> + Maaf untuk saat ini Produk yang anda cari tidak tersedia + </div> </div> )} <h1 className='text-title-md leading-10 font-medium'> diff --git a/src/lib/product/components/Product/ProductMobileVariant.jsx b/src/lib/product/components/Product/ProductMobileVariant.jsx index 0f4953df..9d375deb 100644 --- a/src/lib/product/components/Product/ProductMobileVariant.jsx +++ b/src/lib/product/components/Product/ProductMobileVariant.jsx @@ -181,6 +181,11 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => { return Math.floor(Math.random() * 100) + 1; }); + const getImageVariant = (img) => { + if (!img || img.trim() === '') return '/images/noimage.jpeg'; + return `${img}?variant=True`; + }; + return ( <MobileView> <div className='relative'> @@ -338,7 +343,7 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => { </div> <Image - src={product.image + '?variant=True'} + src={getImageVariant(product?.image)} alt={product.name} className='h-72 object-contain object-center w-full border-b border-gray_r-4' /> @@ -532,7 +537,7 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => { <div className='flex mt-4'> <div className='w-[15%]'> <Image - src={product.image + '?variant=True'} + src={getImageVariant(product?.image)} alt={product.name} className='h-20 object-contain object-center w-full border border-gray_r-4' /> |