From 25129c699cde2038e52d3bddd9ce03138df4fa02 Mon Sep 17 00:00:00 2001
From: Leah Wagner <leah@leahwagner.ca>
Date: Fri, 13 Nov 2020 16:54:44 -0800
Subject: [PATCH] Avoid repeating placeholder image reference and move to a
 variable

---
 components/product/ProductCard/ProductCard.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx
index 21d56bb73..dea43aec0 100644
--- a/components/product/ProductCard/ProductCard.tsx
+++ b/components/product/ProductCard/ProductCard.tsx
@@ -31,6 +31,7 @@ const ProductCard: FC<Props> = ({
   imgLayout = 'responsive',
 }) => {
   const src = p.images.edges?.[0]?.node?.urlOriginal!
+  const placeholderImg = '/product-img-placeholder.svg';
   const { price } = usePrice({
     amount: p.prices?.price?.value,
     baseAmount: p.prices?.retailPrice?.value,
@@ -57,7 +58,7 @@ const ProductCard: FC<Props> = ({
               layout={imgLayout}
               loading={imgLoading}
               priority={imgPriority}
-              src={p.images.edges?.[0]?.node.urlOriginal! || '/product-img-placeholder.svg'}
+              src={p.images.edges?.[0]?.node.urlOriginal! || placeholderImg}
               alt={p.images.edges?.[0]?.node.altText || 'Product Image'}
             />
           </div>
@@ -80,7 +81,7 @@ const ProductCard: FC<Props> = ({
             <div className={s.imageContainer}>
               <Image
                 quality="85"
-                src={src || '/product-img-placeholder.svg'}
+                src={src || placeholderImg}
                 alt={p.name}
                 className={s.image}
                 width={imgWidth}