Fix missing images (vercel#264)

Co-authored-by: B <[email protected]>
dhcho · Jun 1, 2021 · 0792eab · 0792eab
1 parent 277471c
commit 0792eab
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx
@@ -34,7 +34,7 @@ const ProductCard: FC<Props> = ({
           {product?.images && (
             <Image
               quality="85"
-              src={product.images[0].url || placeholderImg}
+              src={product.images[0]?.url || placeholderImg}
               alt={product.name || 'Product Image'}
               height={320}
               width={320}
@@ -70,7 +70,7 @@ const ProductCard: FC<Props> = ({
               <Image
                 alt={product.name || 'Product Image'}
                 className={s.productImage}
-                src={product.images[0].url || placeholderImg}
+                src={product.images[0]?.url || placeholderImg}
                 height={540}
                 width={540}
                 quality="85"

diff --git a/components/wishlist/WishlistCard/WishlistCard.tsx b/components/wishlist/WishlistCard/WishlistCard.tsx
@@ -16,6 +16,8 @@ interface Props {
   product: Product
 }
 
+const placeholderImg = '/product-img-placeholder.svg'
+
 const WishlistCard: FC<Props> = ({ product }) => {
   const { price } = usePrice({
     amount: product.prices?.price?.value,
@@ -58,10 +60,10 @@ const WishlistCard: FC<Props> = ({ product }) => {
     <div className={cn(s.root, { 'opacity-75 pointer-events-none': removing })}>
       <div className={`col-span-3 ${s.productBg}`}>
         <Image
-          src={product.images[0].url}
+          src={product.images[0]?.url || placeholderImg}
           width={400}
           height={400}
-          alt={product.images[0].alt || 'Product Image'}
+          alt={product.images[0]?.alt || 'Product Image'}
         />
       </div>