From c959cc8829448eda22ac40817ae689dee33f7199 Mon Sep 17 00:00:00 2001
From: belisards <adrianobf@gmail.com>
Date: Sun, 3 May 2026 16:53:48 -0300
Subject: [PATCH] feat(ui): hide spoiler banner, anonymize claims, optional
 guest name, list wishlists on home, drop esgotados toggle

---
 app/[slug]/page.tsx           | 30 +++++++--------------------
 app/admin/guests/page.tsx     |  3 +--
 app/api/admin/guests/route.ts |  5 +----
 app/page.tsx                  | 39 ++++++++++++++++++++++++++++-------
 components/header.tsx         | 28 -------------------------
 scripts/guest.ts              |  3 +--
 6 files changed, 43 insertions(+), 65 deletions(-)

diff --git a/app/[slug]/page.tsx b/app/[slug]/page.tsx
index f2d82cb..afefdbc 100644
--- a/app/[slug]/page.tsx
+++ b/app/[slug]/page.tsx
@@ -19,7 +19,6 @@ function PublicWishlistContent() {
   const params = useParams();
   const [wishlist, setWishlist] = useState<Wishlist | null>(null);
   const [items, setItems] = useState<Item[]>([]);
-  const [showClaimed, setShowClaimed] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState('');
 
@@ -121,12 +120,10 @@ function PublicWishlistContent() {
     }
   };
 
-  const filteredItems = showClaimed
-    ? items
-    : items.filter((item) => {
-        const my = myClaimFor(item);
-        return item.remainingQuantity > 0 || my || item.id === justClaimedItemId;
-      });
+  const filteredItems = items.filter((item) => {
+    const my = myClaimFor(item);
+    return item.remainingQuantity > 0 || my || item.id === justClaimedItemId;
+  });
 
   const formatPrice = (price: number | null, currency: string) => {
     if (!price) return null;
@@ -208,18 +205,7 @@ function PublicWishlistContent() {
           )}
 
           {/* Controls */}
-          <div className="mb-6 flex items-center justify-between">
-            <div className="flex items-center space-x-4">
-              <label className="flex items-center">
-                <input
-                  type="checkbox"
-                  checked={showClaimed}
-                  onChange={(e) => setShowClaimed(e.target.checked)}
-                  className="h-4 w-4 text-blue-600 border-gray-300 rounded"
-                />
-                <span className="ml-2 text-sm text-gray-700 dark:text-gray-300">Mostrar itens esgotados</span>
-              </label>
-            </div>
+          <div className="mb-6 flex items-center justify-end">
             <div className="text-sm text-gray-600 dark:text-gray-400">
               {filteredItems.length} de {items.length} itens
             </div>
@@ -229,7 +215,7 @@ function PublicWishlistContent() {
           {filteredItems.length === 0 ? (
             <div className="text-center py-12 bg-white dark:bg-gray-800 rounded-lg shadow">
               <p className="text-gray-500 dark:text-gray-400">
-                {showClaimed ? 'Nenhum item nesta lista ainda' : 'Todos os itens já foram reservados!'}
+                Todos os itens já foram reservados!
               </p>
             </div>
           ) : (
@@ -282,9 +268,9 @@ function PublicWishlistContent() {
                               return (
                                 <li key={c.id} className="flex items-center justify-between gap-2">
                                   <div>
-                                    <span className="font-medium">{c.guest.name}</span>
+                                    <span className="font-medium">{isMine ? 'Você' : 'Reservado'}</span>
                                     <span className="text-gray-500"> · {c.quantity} un.</span>
-                                    {c.note && (
+                                    {c.note && isMine && (
                                       <span className="block text-xs italic text-gray-500">
                                         &quot;{c.note}&quot;
                                       </span>
diff --git a/app/admin/guests/page.tsx b/app/admin/guests/page.tsx
index 63963e9..daa13c0 100644
--- a/app/admin/guests/page.tsx
+++ b/app/admin/guests/page.tsx
@@ -29,7 +29,6 @@ function GuestsManager() {
   const onCreate = async (e: React.FormEvent) => {
     e.preventDefault();
     setErr('');
-    if (!name.trim()) return;
     setBusy(true);
     try {
       await guestsApi.create(name.trim());
@@ -67,7 +66,7 @@ function GuestsManager() {
         <input
           value={name}
           onChange={(e) => setName(e.target.value)}
-          placeholder="Nome do convidado"
+          placeholder="Nome do convidado (opcional)"
           className="flex-1 border rounded px-3 py-2"
         />
         <button disabled={busy} className="bg-indigo-600 text-white rounded px-4 py-2 disabled:opacity-50">
diff --git a/app/api/admin/guests/route.ts b/app/api/admin/guests/route.ts
index 5f1f3a9..f8b8680 100644
--- a/app/api/admin/guests/route.ts
+++ b/app/api/admin/guests/route.ts
@@ -16,10 +16,7 @@ export async function POST(request: NextRequest) {
     return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
   }
   const body = await request.json().catch(() => ({}));
-  const name = (body?.name ?? '').toString().trim();
-  if (!name) {
-    return NextResponse.json({ error: 'name is required' }, { status: 400 });
-  }
+  const name = (body?.name ?? '').toString().trim() || 'Convidado';
   const [row] = await db.insert(guests).values({ name }).returning();
   return NextResponse.json({ success: true, guest: row }, { status: 201 });
 }
diff --git a/app/page.tsx b/app/page.tsx
index ad5e007..79577eb 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,14 +1,15 @@
 'use client';
 
 import { useEffect, useState } from 'react';
+import Link from 'next/link';
 import { useRouter, useSearchParams } from 'next/navigation';
-import { authApi } from '@/lib/api';
+import { authApi, wishlistsApi, type Wishlist } from '@/lib/api';
 
 export default function HomePage() {
   const router = useRouter();
   const params = useSearchParams();
   const [state, setState] = useState<'checking' | 'guest' | 'none'>('checking');
-  const [guestName, setGuestName] = useState<string>('');
+  const [wishlists, setWishlists] = useState<Wishlist[]>([]);
 
   useEffect(() => {
     let cancelled = false;
@@ -31,7 +32,13 @@ export default function HomePage() {
           return;
         }
         if (who.role === 'guest') {
-          setGuestName(who.guest.name);
+          const lists = await wishlistsApi.getAllPublic();
+          if (cancelled) return;
+          if (lists.length === 1) {
+            router.replace(`/${lists[0].slug}`);
+            return;
+          }
+          setWishlists(lists);
           setState('guest');
           return;
         }
@@ -49,10 +56,28 @@ export default function HomePage() {
 
   if (state === 'guest') {
     return (
-      <div className="min-h-screen flex items-center justify-center text-center px-6">
-        <div>
-          <h1 className="text-3xl font-bold mb-2">Olá, {guestName}!</h1>
-          <p className="text-gray-500">Visite o link da lista que você recebeu.</p>
+      <div className="min-h-screen flex items-center justify-center px-6">
+        <div className="w-full max-w-2xl text-center">
+          <h1 className="text-3xl font-bold mb-6">Bem-vindo</h1>
+          {wishlists.length === 0 ? (
+            <p className="text-gray-500">Nenhuma lista disponível ainda.</p>
+          ) : (
+            <ul className="space-y-3 text-left">
+              {wishlists.map((w) => (
+                <li key={w.id}>
+                  <Link
+                    href={`/${w.slug}`}
+                    className="block rounded-lg border border-gray-200 dark:border-gray-700 p-4 hover:border-indigo-400 hover:bg-indigo-50/30 dark:hover:bg-indigo-900/10 transition"
+                  >
+                    <div className="font-semibold text-lg">{w.name}</div>
+                    {w.description && (
+                      <div className="text-sm text-gray-500 mt-1">{w.description}</div>
+                    )}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+          )}
         </div>
       </div>
     );
diff --git a/components/header.tsx b/components/header.tsx
index e9fee50..def2b3d 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -1,8 +1,5 @@
 'use client';
 
-import { useEffect, useState } from 'react';
-import { authApi } from '@/lib/api';
-
 interface HeaderProps {
   title: string;
   subtitle?: string;
@@ -12,33 +9,8 @@ interface HeaderProps {
 }
 
 export default function Header({ title, subtitle, imageUrl, actions, maxWidth = 'max-w-7xl' }: HeaderProps) {
-  const [isAdmin, setIsAdmin] = useState(false);
-
-  useEffect(() => {
-    let cancelled = false;
-    (async () => {
-      try {
-        const who = await authApi.whoami();
-        if (!cancelled) setIsAdmin(who.role === 'admin');
-      } catch {
-        if (!cancelled) setIsAdmin(false);
-      }
-    })();
-    return () => { cancelled = true; };
-  }, []);
-
   return (
     <>
-      {isAdmin && (
-        <div className="sticky top-0 z-50 bg-amber-50 dark:bg-amber-900/40 border-b border-amber-200/70 dark:border-amber-800/60 backdrop-blur">
-          <div className={`${maxWidth} mx-auto py-3 px-4 sm:px-6 lg:px-8`}>
-            <p className="text-center text-sm text-amber-900 dark:text-amber-100">
-              ⚠️ Atenção: visualizar listas públicas pode estragar surpresas
-            </p>
-          </div>
-        </div>
-      )}
-
       <div className="relative overflow-hidden">
         {/* Distant atmospheric haze */}
         <div
diff --git a/scripts/guest.ts b/scripts/guest.ts
index 25f1a5d..d4a965d 100644
--- a/scripts/guest.ts
+++ b/scripts/guest.ts
@@ -15,8 +15,7 @@ async function main() {
   const cmd = process.argv[2];
 
   if (cmd === 'create') {
-    const name = arg('name');
-    if (!name) { console.error('--name is required'); process.exit(1); }
+    const name = (arg('name') ?? '').trim() || 'Convidado';
     const [row] = await db.insert(guests).values({ name }).returning();
     const base = process.env.PUBLIC_BASE_URL ?? 'http://localhost:3000';
     console.log(JSON.stringify({ id: row.id, name: row.name, link: `${base}/?usr=${row.id}` }, null, 2));