From 5548f5000f3cc265b619c150c065484092df1566 Mon Sep 17 00:00:00 2001
From: Adriano Belisario <adrianobf@gmail.com>
Date: Sun, 3 May 2026 21:13:45 +0000
Subject: [PATCH] feat(ui): show price in public view and admin item card; fix
 quantity badge in claims list
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Public wishlist page now displays item price (formatted as BRL) below the
  item name when a price is set
- Admin ItemCard shows price and quantity badge so items can be scanned at a
  glance without opening the edit form
- Claims list no longer shows "· 1 un." for single-unit items (the unit count
  is only displayed when item.quantity > 1)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/[slug]/page.tsx           |  9 ++++++++-
 components/admin/ItemCard.tsx | 11 +++++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/app/[slug]/page.tsx b/app/[slug]/page.tsx
index 71a0f45..2b0f195 100644
--- a/app/[slug]/page.tsx
+++ b/app/[slug]/page.tsx
@@ -221,6 +221,11 @@ function PublicWishlistContent() {
                         <h3 className="text-2xl font-bold text-gray-900 dark:text-white mb-1">
                           {item.name}
                         </h3>
+                        {item.price != null && (
+                          <p className="text-lg font-semibold text-indigo-600 dark:text-indigo-400 mb-1">
+                            {new Intl.NumberFormat('pt-BR', { style: 'currency', currency: item.currency || 'BRL' }).format(item.price)}
+                          </p>
+                        )}
                         {showQuantitySummary && (
                           <p className="text-sm text-gray-500 dark:text-gray-400 mb-3">
                             {item.claimedQuantity} de {item.quantity} reservados
@@ -242,7 +247,9 @@ function PublicWishlistContent() {
                                 <li key={c.id} className="flex items-center justify-between gap-2">
                                   <div>
                                     <span className="font-medium">{isMine ? 'Você' : 'Reservado'}</span>
-                                    <span className="text-gray-500"> · {c.quantity} un.</span>
+                                    {item.quantity > 1 && (
+                                      <span className="text-gray-500"> · {c.quantity} un.</span>
+                                    )}
                                     {c.note && isMine && (
                                       <span className="block text-xs italic text-gray-500">
                                         &quot;{c.note}&quot;
diff --git a/components/admin/ItemCard.tsx b/components/admin/ItemCard.tsx
index 5475730..bd87b1c 100644
--- a/components/admin/ItemCard.tsx
+++ b/components/admin/ItemCard.tsx
@@ -64,6 +64,17 @@ export default function ItemCard({
             <h5 className="text-base font-semibold text-gray-900 dark:text-white">
               {item.name}
             </h5>
+            {item.price != null && (
+              <p className="text-sm text-indigo-600 dark:text-indigo-400 mt-0.5">
+                {new Intl.NumberFormat('pt-BR', { style: 'currency', currency: item.currency || 'BRL' }).format(item.price)}
+                {item.quantity > 1 && ` · Qtd: ${item.quantity}`}
+              </p>
+            )}
+            {item.price == null && item.quantity > 1 && (
+              <p className="text-sm text-gray-500 dark:text-gray-400 mt-0.5">
+                Qtd: {item.quantity}
+              </p>
+            )}
             {item.description && (
               <p className="text-base text-gray-600 dark:text-gray-400 mt-1">
                 {item.description}