From d010a3aff163ed6400eadf670f00bc75cc5bce48 Mon Sep 17 00:00:00 2001
From: Marco <marco.kunitz@googlemail.com>
Date: Sat, 1 Aug 2026 11:50:31 +0000
Subject: [PATCH] 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>
---
 app/cart/components/RelatedProducts.tsx | 14 +++++++++++++-
 app/cart/page.tsx                       |  7 ++++---
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/app/cart/components/RelatedProducts.tsx b/app/cart/components/RelatedProducts.tsx
index 39d72cb..a817aaf 100644
--- a/app/cart/components/RelatedProducts.tsx
+++ b/app/cart/components/RelatedProducts.tsx
@@ -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">
diff --git a/app/cart/page.tsx b/app/cart/page.tsx
index 1cecbd3..565b0bc 100644
--- a/app/cart/page.tsx
+++ b/app/cart/page.tsx
@@ -4,7 +4,7 @@ import { CartContent } from "./components/CartContent";
 import { RelatedProducts } from "./components/RelatedProducts";
 import { TrustRow } from "../components/TrustRow";
 import { Footer } from "../components/Footer";
-import { getCartTrustBadges, getShippingMethods, getShippingSettings, getDefaultTaxRatePercent, getKleinunternehmer } from "../lib/payload";
+import { getCartTrustBadges, getShippingMethods, getShippingSettings, getDefaultTaxRatePercent, getKleinunternehmer, getWishlistEnabled } from "../lib/payload";
 import { hasActiveDiscountCode } from "../lib/discountServer";
 
 // robots: noindex — transactional page (mirrors a specific shopper's cart
@@ -20,13 +20,14 @@ export const metadata: Metadata = {
 };
 
 export default async function CartPage() {
-  const [trustBadges, shippingMethods, shipping, defaultTaxRate, kleinunternehmer, showDiscountField] = await Promise.all([
+  const [trustBadges, shippingMethods, shipping, defaultTaxRate, kleinunternehmer, showDiscountField, wishlistEnabled] = await Promise.all([
     getCartTrustBadges(),
     getShippingMethods(),
     getShippingSettings(),
     getDefaultTaxRatePercent(),
     getKleinunternehmer(),
     hasActiveDiscountCode(),
+    getWishlistEnabled(),
   ]);
 
   // The cart doesn't ask which shipping method the shopper wants yet
@@ -60,7 +61,7 @@ export default async function CartPage() {
             showDiscountField={showDiscountField}
           />
         </Suspense>
-        <RelatedProducts defaultTaxRate={defaultTaxRate} kleinunternehmer={kleinunternehmer} />
+        <RelatedProducts defaultTaxRate={defaultTaxRate} kleinunternehmer={kleinunternehmer} wishlistEnabled={wishlistEnabled} />
         <TrustRow />
       </main>
       <Footer />