Rem unused props & variants

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,70 +26,12 @@ 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>
-            {product?.images && (
-              <Image
-                quality="85"
-                src={product.images[0]?.url || placeholderImg}
-                alt={product.name || 'Product Image'}
-                height={320}
-                width={320}
-                layout="fixed"
-                {...imgProps}
-              />
-            )}
-          </>
-        )}
-
-        {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 && (
@@ -107,7 +42,6 @@ const ProductCard: FC<Props> = ({
                 quality="85"
                 layout="fill"
                 objectFit="contain"
-                    {...imgProps}
               />
             )}
           </div>
@@ -126,8 +60,6 @@ const ProductCard: FC<Props> = ({
           Author (missing data)
         </div>
         <div>{price}</div>
-          </>
-        )}
       </a>
     </Link>
   )