From be53fcef1679fe903c3b3b408e6c6a0cc9103fe3 Mon Sep 17 00:00:00 2001
From: Jonatan Schultz <jonatan@jschultz.se>
Date: Thu, 26 Aug 2021 17:12:37 +0200
Subject: [PATCH] Rem unused props & variants

---
 .../product/ProductCard/ProductCard.tsx       | 116 ++++--------------
 1 file changed, 24 insertions(+), 92 deletions(-)

diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx
index 5b4e46d0f..ff760bfe5 100644
--- a/components/product/ProductCard/ProductCard.tsx
+++ b/components/product/ProductCard/ProductCard.tsx
@@ -3,27 +3,20 @@ import cn from 'classnames'
 import Link from 'next/link'
 import type { Product } from '@commerce/types/product'
 import s from './ProductCard.module.css'
-import Image, { ImageProps } from 'next/image'
-import WishlistButton from '@components/wishlist/WishlistButton'
+import Image from 'next/image'
 import usePrice from '@framework/product/use-price'
-import ProductTag from '../ProductTag'
 
 interface Props {
   className?: string
   product: Product
   noNameTag?: boolean
-  imgProps?: Omit<ImageProps, 'src' | 'layout' | 'placeholder' | 'blurDataURL'>
-  variant?: 'default' | 'slim' | 'simple'
 }
 
 const placeholderImg = '/product-img-placeholder.svg'
 
 const ProductCard: FC<Props> = ({
   product,
-  imgProps,
   className,
-  noNameTag = false,
-  variant = 'default',
 }) => {
   const { price } = usePrice({
     amount: product.price.value,
@@ -33,101 +26,40 @@ const ProductCard: FC<Props> = ({
 
   const rootClassName = cn(
     s.root,
-    { [s.slim]: variant === 'slim', [s.simple]: variant === 'simple' },
     className
   )
 
   return (
     <Link href={`/products/${product.slug}`}>
       <a className={rootClassName}>
-        {variant === 'slim' && (
-          <>
-            <div className={s.header}>
-              <span>{product.name}</span>
-            </div>
+        <div className={s.imageContainer}>
+          <div className={s.imageContainerInner}>
             {product?.images && (
               <Image
-                quality="85"
-                src={product.images[0]?.url || placeholderImg}
                 alt={product.name || 'Product Image'}
-                height={320}
-                width={320}
-                layout="fixed"
-                {...imgProps}
+                className={s.productImage}
+                src={product.images[0]?.url || placeholderImg}
+                quality="85"
+                layout="fill"
+                objectFit="contain"
               />
             )}
-          </>
-        )}
-
-        {variant === 'simple' && (
-          <>
-            {process.env.COMMERCE_WISHLIST_ENABLED && (
-              <WishlistButton
-                className={s.wishlistButton}
-                productId={product.id}
-                variant={product.variants[0]}
-              />
-            )}
-            {!noNameTag && (
-              <div className={s.header}>
-                <h3 className={s.name}>
-                  <span>{product.name}</span>
-                </h3>
-                <div className={s.price}>
-                  {`${price} ${product.price?.currencyCode}`}
-                </div>
-              </div>
-            )}
-            <div className={s.imageContainer}>
-              {product?.images && (
-                <Image
-                  alt={product.name || 'Product Image'}
-                  className={s.productImage}
-                  src={product.images[0]?.url || placeholderImg}
-                  height={540}
-                  width={540}
-                  quality="85"
-                  layout="responsive"
-                  {...imgProps}
-                />
-              )}
-            </div>
-          </>
-        )}
-
-        {variant === 'default' && (
-          <>
-            <div className={s.imageContainer}>
-              <div className={s.imageContainerInner}>
-                {product?.images && (
-                  <Image
-                    alt={product.name || 'Product Image'}
-                    className={s.productImage}
-                    src={product.images[0]?.url || placeholderImg}
-                    quality="85"
-                    layout="fill"
-                    objectFit="contain"
-                    {...imgProps}
-                  />
-                )}
-              </div>
-              <div className={s.typeIcon}>
-                <Image
-                  src="/icon-audiobook.svg"
-                  width={22}
-                  height={23}
-                />
-              </div>
-            </div>
-            <div className="font-bold line-clamp-3">
-              {product.name}
-            </div>
-            <div className="italic">
-              Author (missing data)
-            </div>
-            <div>{price}</div>
-          </>
-        )}
+          </div>
+          <div className={s.typeIcon}>
+            <Image
+              src="/icon-audiobook.svg"
+              width={22}
+              height={23}
+            />
+          </div>
+        </div>
+        <div className="font-bold line-clamp-3">
+          {product.name}
+        </div>
+        <div className="italic">
+          Author (missing data)
+        </div>
+        <div>{price}</div>
       </a>
     </Link>
   )