diff --git a/site/components/wishlist/WishlistButton/WishlistButton.tsx b/site/components/wishlist/WishlistButton/WishlistButton.tsx
index 419d271a5..f4e0fb31f 100644
--- a/site/components/wishlist/WishlistButton/WishlistButton.tsx
+++ b/site/components/wishlist/WishlistButton/WishlistButton.tsx
@@ -31,8 +31,8 @@ const WishlistButton: FC<Props> = ({
   const itemInWishlist = data?.items?.find(
     // @ts-ignore Wishlist is not always enabled
     (item) =>
-      item.product_id === productId &&
-      item.variant_id === variant.id
+      item.product_id === Number(productId) &&
+      item.variant_id === Number(variant.id)
   )
 
   const handleWishlistChange = async (e: any) => {
diff --git a/site/components/wishlist/WishlistCard/WishlistCard.tsx b/site/components/wishlist/WishlistCard/WishlistCard.tsx
index 7deb05e16..6af6c914e 100644
--- a/site/components/wishlist/WishlistCard/WishlistCard.tsx
+++ b/site/components/wishlist/WishlistCard/WishlistCard.tsx
@@ -13,13 +13,11 @@ import useAddItem from '@framework/cart/use-add-item'
 import useRemoveItem from '@framework/wishlist/use-remove-item'
 import type { Wishlist } from '@commerce/types/wishlist'
 
-interface Props {
-  item: Wishlist
-}
-
 const placeholderImg = '/product-img-placeholder.svg'
 
-const WishlistCard: FC<Props> = ({ item }) => {
+const WishlistCard: React.FC<{
+  item: Wishlist
+}> = ({ item }) => {
   const product: Product = item.product
   const { price } = usePrice({
     amount: product.price?.value,