Add wishlist button to cart page's related-products cards

RelatedProducts.tsx was the only product-card grid missing the
WishlistButton (ProductGrid.tsx/ProductSpotlight.tsx already had it).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Marco
2026-08-01 11:50:31 +00:00
parent 1ec442cc05
commit d010a3aff1
2 changed files with 17 additions and 4 deletions
+13 -1
View File
@@ -7,6 +7,7 @@ import { formatPrice, discountPercent } from "../../lib/format";
import { effectiveTaxRate } from "../../lib/cartTotals";
import { Reveal } from "../../components/Reveal";
import { AddToCartInlineButton, FEEDBACK_MS } from "../../components/AddToCartInlineButton";
import { WishlistButton } from "../../components/WishlistButton";
import { useCart } from "../../lib/cart";
const DISPLAY_COUNT = 3;
@@ -30,7 +31,15 @@ function pickAvailable(allIds: string[], excludeIds: string[], keep: string[], c
return [...keep, ...pickRandom(allIds, [...excludeIds, ...keep], missing)];
}
export function RelatedProducts({ defaultTaxRate, kleinunternehmer }: { defaultTaxRate: number; kleinunternehmer: boolean }) {
export function RelatedProducts({
defaultTaxRate,
kleinunternehmer,
wishlistEnabled,
}: {
defaultTaxRate: number;
kleinunternehmer: boolean;
wishlistEnabled: boolean;
}) {
const cart = useCart();
const products = useProducts();
// Cart/checkout resolve any product regardless of `active` (see
@@ -175,6 +184,9 @@ export function RelatedProducts({ defaultTaxRate, kleinunternehmer }: { defaultT
</span>
)
)}
{wishlistEnabled && (
<WishlistButton productId={product.numericId} className="absolute top-3 right-3" revealOnHover />
)}
</div>
<div className="flex flex-col gap-4 items-start px-5 pb-5 pt-2 w-full flex-1">
<div className="flex flex-col gap-1 items-start w-full">