[V0_FILE]sql:file="scripts/001_create_schema.sql" isMerged="true" -- Profiles table for user data CREATE TABLE IF NOT EXISTS public.profiles ( id UUID PRIMARY KEY REFERENCES auth.users(id) ON DELETE CASCADE, display_name TEXT, avatar_url TEXT, is_admin BOOLEAN DEFAULT FALSE, created_at TIMESTAMPTZ DEFAULT NOW(), updated_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.profiles ENABLE ROW LEVEL SECURITY; CREATE POLICY "profiles_select_own" ON public.profiles FOR SELECT USING (auth.uid() = id); CREATE POLICY "profiles_insert_own" ON public.profiles FOR INSERT WITH CHECK (auth.uid() = id); CREATE POLICY "profiles_update_own" ON public.profiles FOR UPDATE USING (auth.uid() = id); CREATE POLICY "profiles_public_read" ON public.profiles FOR SELECT USING (true); -- Auto-create profile on signup CREATE OR REPLACE FUNCTION public.handle_new_user() RETURNS TRIGGER LANGUAGE plpgsql SECURITY DEFINER SET search_path = public AS $$ BEGIN INSERT INTO public.profiles (id, display_name, avatar_url) VALUES ( new.id, COALESCE(new.raw_user_meta_data ->> 'full_name', new.raw_user_meta_data ->> 'name', NULL), COALESCE(new.raw_user_meta_data ->> 'avatar_url', new.raw_user_meta_data ->> 'picture', NULL) ) ON CONFLICT (id) DO UPDATE SET display_name = COALESCE(EXCLUDED.display_name, profiles.display_name), avatar_url = COALESCE(EXCLUDED.avatar_url, profiles.avatar_url); RETURN new; END; $$; DROP TRIGGER IF EXISTS on_auth_user_created ON auth.users; CREATE TRIGGER on_auth_user_created AFTER INSERT ON auth.users FOR EACH ROW EXECUTE FUNCTION public.handle_new_user(); -- Universities/Groups table CREATE TABLE IF NOT EXISTS public.universities ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), name TEXT NOT NULL UNIQUE, slug TEXT NOT NULL UNIQUE, logo_url TEXT, created_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.universities ENABLE ROW LEVEL SECURITY; CREATE POLICY "universities_public_read" ON public.universities FOR SELECT USING (true); CREATE POLICY "universities_admin_insert" ON public.universities FOR INSERT WITH CHECK ( EXISTS (SELECT 1 FROM profiles WHERE id = auth.uid() AND is_admin = true) ); -- Insert default universities INSERT INTO public.universities (name, slug) VALUES ('UADE', 'uade'), ('Universidad Torcuato Di Tella', 'ditella'), ('Universidad de San Andrés', 'udesa'), ('Universidad de Buenos Aires', 'uba') ON CONFLICT (slug) DO NOTHING; -- User memberships in universities CREATE TABLE IF NOT EXISTS public.user_universities ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, university_id UUID NOT NULL REFERENCES public.universities(id) ON DELETE CASCADE, joined_at TIMESTAMPTZ DEFAULT NOW(), UNIQUE(user_id, university_id) ); ALTER TABLE public.user_universities ENABLE ROW LEVEL SECURITY; CREATE POLICY "user_universities_select" ON public.user_universities FOR SELECT USING (true); CREATE POLICY "user_universities_insert_own" ON public.user_universities FOR INSERT WITH CHECK (auth.uid() = user_id); CREATE POLICY "user_universities_delete_own" ON public.user_universities FOR DELETE USING (auth.uid() = user_id); -- Album configuration (adaptable for future World Cups) CREATE TABLE IF NOT EXISTS public.album_config ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), name TEXT NOT NULL, year INTEGER NOT NULL, is_active BOOLEAN DEFAULT TRUE, total_stickers INTEGER NOT NULL, created_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.album_config ENABLE ROW LEVEL SECURITY; CREATE POLICY "album_config_public_read" ON public.album_config FOR SELECT USING (true); -- Insert World Cup 2026 config (based on 2022 structure) INSERT INTO public.album_config (name, year, is_active, total_stickers) VALUES ('FIFA World Cup 2026', 2026, true, 670) ON CONFLICT DO NOTHING; -- Teams table CREATE TABLE IF NOT EXISTS public.teams ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), album_id UUID REFERENCES public.album_config(id) ON DELETE CASCADE, name TEXT NOT NULL, code TEXT NOT NULL, group_name TEXT, flag_emoji TEXT, sticker_start INTEGER NOT NULL, sticker_end INTEGER NOT NULL, is_special BOOLEAN DEFAULT FALSE, category TEXT DEFAULT 'team', created_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.teams ENABLE ROW LEVEL SECURITY; CREATE POLICY "teams_public_read" ON public.teams FOR SELECT USING (true); -- Stickers table CREATE TABLE IF NOT EXISTS public.stickers ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), album_id UUID REFERENCES public.album_config(id) ON DELETE CASCADE, team_id UUID REFERENCES public.teams(id) ON DELETE CASCADE, number INTEGER NOT NULL, name TEXT, is_special BOOLEAN DEFAULT FALSE, special_type TEXT, created_at TIMESTAMPTZ DEFAULT NOW(), UNIQUE(album_id, number) ); ALTER TABLE public.stickers ENABLE ROW LEVEL SECURITY; CREATE POLICY "stickers_public_read" ON public.stickers FOR SELECT USING (true); -- User sticker collection CREATE TABLE IF NOT EXISTS public.user_stickers ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, sticker_id UUID NOT NULL REFERENCES public.stickers(id) ON DELETE CASCADE, quantity INTEGER DEFAULT 1, updated_at TIMESTAMPTZ DEFAULT NOW(), UNIQUE(user_id, sticker_id) ); ALTER TABLE public.user_stickers ENABLE ROW LEVEL SECURITY; CREATE POLICY "user_stickers_select_own" ON public.user_stickers FOR SELECT USING (auth.uid() = user_id); CREATE POLICY "user_stickers_insert_own" ON public.user_stickers FOR INSERT WITH CHECK (auth.uid() = user_id); CREATE POLICY "user_stickers_update_own" ON public.user_stickers FOR UPDATE USING (auth.uid() = user_id); CREATE POLICY "user_stickers_delete_own" ON public.user_stickers FOR DELETE USING (auth.uid() = user_id); CREATE POLICY "user_stickers_public_read" ON public.user_stickers FOR SELECT USING (true); -- Trade requests CREATE TABLE IF NOT EXISTS public.trade_requests ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), requester_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, receiver_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, university_id UUID REFERENCES public.universities(id) ON DELETE SET NULL, status TEXT DEFAULT 'pending' CHECK (status IN ('pending', 'accepted', 'rejected', 'completed', 'cancelled')), message TEXT, created_at TIMESTAMPTZ DEFAULT NOW(), updated_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.trade_requests ENABLE ROW LEVEL SECURITY; CREATE POLICY "trade_requests_select" ON public.trade_requests FOR SELECT USING ( auth.uid() = requester_id OR auth.uid() = receiver_id ); CREATE POLICY "trade_requests_insert" ON public.trade_requests FOR INSERT WITH CHECK (auth.uid() = requester_id); CREATE POLICY "trade_requests_update" ON public.trade_requests FOR UPDATE USING ( auth.uid() = requester_id OR auth.uid() = receiver_id ); -- Trade items (what stickers are being traded) CREATE TABLE IF NOT EXISTS public.trade_items ( id UUID PRIMARY KEY DEFAULT gen_random_uuid(), trade_id UUID NOT NULL REFERENCES public.trade_requests(id) ON DELETE CASCADE, sticker_id UUID NOT NULL REFERENCES public.stickers(id) ON DELETE CASCADE, from_user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, to_user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE, created_at TIMESTAMPTZ DEFAULT NOW() ); ALTER TABLE public.trade_items ENABLE ROW LEVEL SECURITY; CREATE POLICY "trade_items_select" ON public.trade_items FOR SELECT USING ( auth.uid() = from_user_id OR auth.uid() = to_user_id ); CREATE POLICY "trade_items_insert" ON public.trade_items FOR INSERT WITH CHECK (auth.uid() = from_user_id); [V0_FILE]sql:file="scripts/002_seed_teams.sql" isMerged="true" -- Seed teams and stickers for World Cup 2026 -- Based on 2022 structure, adaptable for 2026 when confirmed DO $$ DECLARE v_album_id UUID; v_team_id UUID; BEGIN -- Get active album SELECT id INTO v_album_id FROM public.album_config WHERE is_active = true LIMIT 1; -- Special sections INSERT INTO public.teams (album_id, name, code, sticker_start, sticker_end, is_special, category) VALUES (v_album_id, 'FIFA World Cup', 'FWC', 1, 29, true, 'special'), (v_album_id, 'Legends', 'LEG', 640, 670, true, 'legends') ON CONFLICT DO NOTHING; -- Group A teams (example structure - will be updated for 2026) INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Estados Unidos', 'USA', 'A', '🇺🇸', 30, 49, 'team'), (v_album_id, 'México', 'MEX', 'A', '🇲🇽', 50, 69, 'team'), (v_album_id, 'Canadá', 'CAN', 'A', '🇨🇦', 70, 89, 'team'), (v_album_id, 'Por Definir A4', 'TBD1', 'A', '🏳️', 90, 109, 'team') ON CONFLICT DO NOTHING; -- Group B INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Argentina', 'ARG', 'B', '🇦🇷', 110, 129, 'team'), (v_album_id, 'Brasil', 'BRA', 'B', '🇧🇷', 130, 149, 'team'), (v_album_id, 'Por Definir B3', 'TBD2', 'B', '🏳️', 150, 169, 'team'), (v_album_id, 'Por Definir B4', 'TBD3', 'B', '🏳️', 170, 189, 'team') ON CONFLICT DO NOTHING; -- Group C INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Francia', 'FRA', 'C', '🇫🇷', 190, 209, 'team'), (v_album_id, 'Inglaterra', 'ENG', 'C', '🏴󠁧󠁢󠁥󠁮󠁧󠁿', 210, 229, 'team'), (v_album_id, 'Por Definir C3', 'TBD4', 'C', '🏳️', 230, 249, 'team'), (v_album_id, 'Por Definir C4', 'TBD5', 'C', '🏳️', 250, 269, 'team') ON CONFLICT DO NOTHING; -- Group D INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'España', 'ESP', 'D', '🇪🇸', 270, 289, 'team'), (v_album_id, 'Alemania', 'GER', 'D', '🇩🇪', 290, 309, 'team'), (v_album_id, 'Por Definir D3', 'TBD6', 'D', '🏳️', 310, 329, 'team'), (v_album_id, 'Por Definir D4', 'TBD7', 'D', '🏳️', 330, 349, 'team') ON CONFLICT DO NOTHING; -- Group E INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Países Bajos', 'NED', 'E', '🇳🇱', 350, 369, 'team'), (v_album_id, 'Portugal', 'POR', 'E', '🇵🇹', 370, 389, 'team'), (v_album_id, 'Por Definir E3', 'TBD8', 'E', '🏳️', 390, 409, 'team'), (v_album_id, 'Por Definir E4', 'TBD9', 'E', '🏳️', 410, 429, 'team') ON CONFLICT DO NOTHING; -- Group F INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Bélgica', 'BEL', 'F', '🇧🇪', 430, 449, 'team'), (v_album_id, 'Italia', 'ITA', 'F', '🇮🇹', 450, 469, 'team'), (v_album_id, 'Por Definir F3', 'TBD10', 'F', '🏳️', 470, 489, 'team'), (v_album_id, 'Por Definir F4', 'TBD11', 'F', '🏳️', 490, 509, 'team') ON CONFLICT DO NOTHING; -- Group G INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Uruguay', 'URU', 'G', '🇺🇾', 510, 529, 'team'), (v_album_id, 'Colombia', 'COL', 'G', '🇨🇴', 530, 549, 'team'), (v_album_id, 'Por Definir G3', 'TBD12', 'G', '🏳️', 550, 569, 'team'), (v_album_id, 'Por Definir G4', 'TBD13', 'G', '🏳️', 570, 589, 'team') ON CONFLICT DO NOTHING; -- Group H INSERT INTO public.teams (album_id, name, code, group_name, flag_emoji, sticker_start, sticker_end, category) VALUES (v_album_id, 'Japón', 'JPN', 'H', '🇯🇵', 590, 609, 'team'), (v_album_id, 'Corea del Sur', 'KOR', 'H', '🇰🇷', 610, 629, 'team'), (v_album_id, 'Por Definir H3', 'TBD14', 'H', '🏳️', 630, 639, 'team') ON CONFLICT DO NOTHING; -- Generate stickers for each team FOR v_team_id IN SELECT id FROM public.teams WHERE album_id = v_album_id LOOP INSERT INTO public.stickers (album_id, team_id, number, is_special, special_type) SELECT v_album_id, v_team_id, generate_series(t.sticker_start, t.sticker_end), t.is_special, CASE WHEN t.category = 'special' THEN 'world_cup' WHEN t.category = 'legends' THEN 'legend' ELSE NULL END FROM public.teams t WHERE t.id = v_team_id ON CONFLICT (album_id, number) DO NOTHING; END LOOP; END $$; [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76", "@supabase/ssr": "0.8.0" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescript:file="middleware.ts" isMerged="true" import { updateSession } from '@/lib/supabase/proxy' import { type NextRequest } from 'next/server' export async function middleware(request: NextRequest) { return await updateSession(request) } export const config = { matcher: [ '/((?!_next/static|_next/image|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)', ], } [V0_FILE]typescript:file="lib/supabase/server.ts" isMerged="true" import { createServerClient } from '@supabase/ssr' import { cookies } from 'next/headers' export async function createClient() { const cookieStore = await cookies() return createServerClient( process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!, { cookies: { getAll() { return cookieStore.getAll() }, setAll(cookiesToSet) { try { cookiesToSet.forEach(({ name, value, options }) => cookieStore.set(name, value, options), ) } catch { // The "setAll" method was called from a Server Component. } }, }, }, ) } [V0_FILE]typescript:file="lib/supabase/proxy.ts" isMerged="true" import { createServerClient } from '@supabase/ssr' import { NextResponse, type NextRequest } from 'next/server' export async function updateSession(request: NextRequest) { let supabaseResponse = NextResponse.next({ request, }) const supabase = createServerClient( process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!, { cookies: { getAll() { return request.cookies.getAll() }, setAll(cookiesToSet) { cookiesToSet.forEach(({ name, value }) => request.cookies.set(name, value), ) supabaseResponse = NextResponse.next({ request, }) cookiesToSet.forEach(({ name, value, options }) => supabaseResponse.cookies.set(name, value, options), ) }, }, }, ) const { data: { user }, } = await supabase.auth.getUser() // Protected routes if ( request.nextUrl.pathname.startsWith('/album') || request.nextUrl.pathname.startsWith('/groups') || request.nextUrl.pathname.startsWith('/trades') ) { if (!user) { const url = request.nextUrl.clone() url.pathname = '/auth/login' return NextResponse.redirect(url) } } return supabaseResponse } [V0_FILE]css:file="app/globals.css" isMerged="true" @import 'tailwindcss'; @import 'tw-animate-css'; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(0.98 0.005 85); --foreground: oklch(0.15 0.02 260); --card: oklch(1 0 0); --card-foreground: oklch(0.15 0.02 260); --popover: oklch(1 0 0); --popover-foreground: oklch(0.15 0.02 260); --primary: oklch(0.55 0.2 145); --primary-foreground: oklch(1 0 0); --secondary: oklch(0.95 0.01 85); --secondary-foreground: oklch(0.15 0.02 260); --muted: oklch(0.93 0.01 85); --muted-foreground: oklch(0.45 0.02 260); --accent: oklch(0.65 0.18 25); --accent-foreground: oklch(1 0 0); --destructive: oklch(0.55 0.22 25); --destructive-foreground: oklch(1 0 0); --border: oklch(0.90 0.01 85); --input: oklch(0.92 0.01 85); --ring: oklch(0.55 0.2 145); --chart-1: oklch(0.55 0.2 145); --chart-2: oklch(0.65 0.18 25); --chart-3: oklch(0.55 0.15 250); --chart-4: oklch(0.70 0.15 85); --chart-5: oklch(0.50 0.12 200); --radius: 0.75rem; --sidebar: oklch(0.98 0.005 85); --sidebar-foreground: oklch(0.15 0.02 260); --sidebar-primary: oklch(0.55 0.2 145); --sidebar-primary-foreground: oklch(1 0 0); --sidebar-accent: oklch(0.93 0.01 85); --sidebar-accent-foreground: oklch(0.15 0.02 260); --sidebar-border: oklch(0.90 0.01 85); --sidebar-ring: oklch(0.55 0.2 145); --gold: oklch(0.80 0.15 85); --gold-foreground: oklch(0.25 0.05 85); } .dark { --background: oklch(0.13 0.02 260); --foreground: oklch(0.95 0.01 85); --card: oklch(0.17 0.02 260); --card-foreground: oklch(0.95 0.01 85); --popover: oklch(0.17 0.02 260); --popover-foreground: oklch(0.95 0.01 85); --primary: oklch(0.60 0.2 145); --primary-foreground: oklch(0.15 0.05 145); --secondary: oklch(0.22 0.02 260); --secondary-foreground: oklch(0.95 0.01 85); --muted: oklch(0.22 0.02 260); --muted-foreground: oklch(0.65 0.02 260); --accent: oklch(0.65 0.18 25); --accent-foreground: oklch(1 0 0); --destructive: oklch(0.55 0.22 25); --destructive-foreground: oklch(1 0 0); --border: oklch(0.25 0.02 260); --input: oklch(0.22 0.02 260); --ring: oklch(0.60 0.2 145); --chart-1: oklch(0.60 0.2 145); --chart-2: oklch(0.65 0.18 25); --chart-3: oklch(0.55 0.15 250); --chart-4: oklch(0.70 0.15 85); --chart-5: oklch(0.50 0.12 200); --sidebar: oklch(0.15 0.02 260); --sidebar-foreground: oklch(0.95 0.01 85); --sidebar-primary: oklch(0.60 0.2 145); --sidebar-primary-foreground: oklch(0.15 0.05 145); --sidebar-accent: oklch(0.22 0.02 260); --sidebar-accent-foreground: oklch(0.95 0.01 85); --sidebar-border: oklch(0.25 0.02 260); --sidebar-ring: oklch(0.60 0.2 145); --gold: oklch(0.75 0.15 85); --gold-foreground: oklch(0.20 0.05 85); } @theme inline { --font-sans: 'Inter', 'Inter Fallback'; --font-mono: 'Geist Mono', 'Geist Mono Fallback'; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); --color-gold: var(--gold); --color-gold-foreground: var(--gold-foreground); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } [V0_FILE]json:file="public/manifest.json" isMerged="true" { "name": "FiguWorld 2026", "short_name": "FiguWorld", "description": "Gestiona tu album del Mundial 2026", "start_url": "/", "display": "standalone", "background_color": "#f9fafb", "theme_color": "#16a34a", "icons": [ { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" } ] } [V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" import React from "react" import Link from "next/link" import { Button } from "@/components/ui/button" import { createClient } from "@/lib/supabase/server" import { redirect } from "next/navigation" import { Trophy, Users, ArrowRightLeft, Sparkles } from "lucide-react" export default async function HomePage() { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() if (user) { redirect("/album") } return (

{/* Hero Section */}

{/* Decorative elements */}

Mundial USA - Mexico - Canada 2026

Tu album del Mundial
en un solo lugar

Registra las figuritas que tenes, encuentra las que te faltan e intercambia con otros coleccionistas de tu universidad. Todo organizado y simple.

{/* Features */}

Todo lo que necesitas para completar tu album

} title="Gestiona tu album" description="Marca las figuritas que tenes, las que te faltan y las repetidas. Ve tu progreso en tiempo real." /> } title="Unite a tu universidad" description="Conecta con otros coleccionistas de UADE, Di Tella, UdeSA, UBA y mas. Intercambia de forma segura." /> } title="Intercambios inteligentes" description="Encontramos automaticamente quien tiene las que te faltan y necesita las que tenes repetidas." />

{/* Stats Preview */}

{/* CTA */}

Listo para completar tu album?

Unite a la comunidad de coleccionistas y encontra tus figuritas faltantes.

{/* Footer */}

) } function FeatureCard({ icon, title, description }: { icon: React.ReactNode, title: string, description: string }) { return (

{icon}

{title}

{description}

) } function StatCard({ number, label }: { number: string, label: string }) { return (

{number}

{label}

) } [V0_FILE]typescript:file="lib/types.ts" isMerged="true" export interface Profile { id: string display_name: string | null avatar_url: string | null is_admin: boolean created_at: string updated_at: string } export interface University { id: string name: string slug: string logo_url: string | null created_at: string } export interface UserUniversity { id: string user_id: string university_id: string joined_at: string university?: University } export interface AlbumConfig { id: string name: string year: number is_active: boolean total_stickers: number created_at: string } export interface Team { id: string album_id: string name: string code: string group_name: string | null flag_emoji: string | null sticker_start: number sticker_end: number is_special: boolean category: string created_at: string } export interface Sticker { id: string album_id: string team_id: string number: number name: string | null is_special: boolean special_type: string | null created_at: string team?: Team } export interface UserSticker { id: string user_id: string sticker_id: string quantity: number updated_at: string sticker?: Sticker } export interface TradeRequest { id: string requester_id: string receiver_id: string university_id: string | null group_id: string | null status: 'pending' | 'accepted' | 'rejected' | 'completed' | 'cancelled' message: string | null created_at: string updated_at: string requester?: Profile receiver?: Profile university?: University trade_items?: TradeItem[] } export interface TradeItem { id: string trade_id: string sticker_id: string from_user_id: string to_user_id: string created_at: string sticker?: Sticker } export interface CustomGroup { id: string name: string slug: string description: string | null password_hash: string | null created_by: string is_public: boolean created_at: string } export interface CustomGroupMember { id: string group_id: string user_id: string joined_at: string } export interface StickerWithStatus extends Sticker { status: 'missing' | 'have' | 'duplicate' quantity: number } export interface UserWithDuplicates { user_id: string profile: Profile duplicates: Sticker[] } [V0_FILE]typescriptreact:file="app/auth/error/page.tsx" isMerged="true" import Link from "next/link" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { AlertCircle, Trophy } from "lucide-react" export default function AuthErrorPage() { return (

FiguWorld

Error de autenticacion Hubo un problema al iniciar sesion. Por favor, intenta de nuevo.

) } [V0_FILE]typescript:file="app/auth/callback/route.ts" isMerged="true" import { createClient } from "@/lib/supabase/server" import { NextResponse } from "next/server" export async function GET(request: Request) { const { searchParams, origin } = new URL(request.url) const code = searchParams.get("code") const next = searchParams.get("next") ?? "/album" if (code) { const supabase = await createClient() const { error } = await supabase.auth.exchangeCodeForSession(code) if (!error) { return NextResponse.redirect(`${origin}${next}`) } } return NextResponse.redirect(`${origin}/auth/error`) } [V0_FILE]typescriptreact:file="components/app-navbar.tsx" isMerged="true" "use client" import Link from "next/link" import { usePathname } from "next/navigation" import { cn } from "@/lib/utils" import { Trophy, Book, Users, ArrowRightLeft, LogOut, User as UserIcon } from "lucide-react" import { Button } from "@/components/ui/button" import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu" import { createClient } from "@/lib/supabase/client" import { useRouter } from "next/navigation" import type { User } from "@supabase/supabase-js" import type { Profile } from "@/lib/types" const navItems = [ { href: "/album", label: "Album", icon: Book }, { href: "/groups", label: "Grupos", icon: Users }, { href: "/trades", label: "Intercambios", icon: ArrowRightLeft }, ] interface AppNavbarProps { user: User profile: Profile | null } export function AppNavbar({ user, profile }: AppNavbarProps) { const pathname = usePathname() const router = useRouter() const handleSignOut = async () => { const supabase = createClient() await supabase.auth.signOut() router.push("/") } const displayName = profile?.display_name || user.email?.split("@")[0] || "Usuario" const initials = displayName.slice(0, 2).toUpperCase() return ( <> {/* Desktop navbar */}

FiguWorld 2026

Mi perfil Cerrar sesion

{/* Mobile bottom navbar */}

{navItems.map((item) => { const isActive = pathname === item.href return ( {item.label} ) })} Mi perfil Cerrar sesion

) } [V0_FILE]typescriptreact:file="app/(app)/album/page.tsx" isMerged="true" import { createClient } from "@/lib/supabase/server" import { redirect } from "next/navigation" import { AlbumView } from "@/components/album/album-view" import { AlbumStats } from "@/components/album/album-stats" import type { Team, Sticker, UserSticker } from "@/lib/types" export default async function AlbumPage() { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() if (!user) redirect("/auth/login") // Get album config const { data: albumConfig } = await supabase .from("album_config") .select("*") .eq("is_active", true) .limit(1) .single() if (!albumConfig) { return (

No se encontro configuracion del album.

) } // Get teams const { data: teams } = await supabase .from("teams") .select("*") .eq("album_id", albumConfig.id) .order("sticker_start", { ascending: true }) // Get all stickers with their team info const { data: stickers } = await supabase .from("stickers") .select("*, team:teams(*)") .eq("album_id", albumConfig.id) .order("number", { ascending: true }) // Get user's stickers const { data: userStickers } = await supabase .from("user_stickers") .select("*") .eq("user_id", user.id) return (

Mi Album

{albumConfig.name} - {albumConfig.total_stickers} figuritas

) } [V0_FILE]typescriptreact:file="app/(app)/layout.tsx" isMerged="true" import React from "react" import { createClient } from "@/lib/supabase/server" import { redirect } from "next/navigation" import { AppNavbar } from "@/components/app-navbar" export default async function AppLayout({ children, }: { children: React.ReactNode }) { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() if (!user) { redirect("/auth/login") } // Get profile const { data: profile } = await supabase .from("profiles") .select("*") .eq("id", user.id) .single() return (

{children}

) } [V0_FILE]typescriptreact:file="components/album/album-stats.tsx" isMerged="true" "use client" import { Card } from "@/components/ui/card" import { Progress } from "@/components/ui/progress" import { CheckCircle2, XCircle, Copy } from "lucide-react" import type { UserSticker } from "@/lib/types" interface AlbumStatsProps { totalStickers: number userStickers: UserSticker[] } export function AlbumStats({ totalStickers, userStickers }: AlbumStatsProps) { const collected = userStickers.filter(us => us.quantity >= 1).length const duplicates = userStickers.filter(us => us.quantity > 1).reduce((acc, us) => acc + (us.quantity - 1), 0) const missing = totalStickers - collected const progress = Math.round((collected / totalStickers) * 100) return (

{collected}

Tengo

{missing}

Me faltan

{duplicates}

Repetidas

Progreso

{progress}%

{collected} / {totalStickers}

) } [V0_FILE]typescriptreact:file="components/album/team-section.tsx" isMerged="true" "use client" import { useState } from "react" import { ChevronDown, ChevronUp } from "lucide-react" import { StickerCard } from "./sticker-card" import type { Team, Sticker, UserSticker } from "@/lib/types" interface TeamSectionProps { team: Team stickers: Sticker[] userStickerMap: Map userId: string selectionMode?: boolean selectedIds?: Set onSelect?: (stickerId: string) => void onQuantityChange?: (stickerId: string, newQuantity: number) => void } export function TeamSection({ team, stickers, userStickerMap, userId, selectionMode = false, selectedIds = new Set(), onSelect, onQuantityChange, }: TeamSectionProps) { const [isExpanded, setIsExpanded] = useState(true) const collected = stickers.filter( (s) => (userStickerMap.get(s.id)?.quantity || 0) >= 1, ).length const total = stickers.length const progress = total > 0 ? Math.round((collected / total) * 100) : 0 return (

{isExpanded && (

{stickers.map((sticker) => { const userSticker = userStickerMap.get(sticker.id) return ( ) })}

)}

) } [V0_FILE]typescriptreact:file="components/album/sticker-card.tsx" isMerged="true" "use client" import { useState, useTransition } from "react" import { cn } from "@/lib/utils" import { createClient } from "@/lib/supabase/client" import { Minus, Plus, Sparkles } from "lucide-react" import type { Sticker } from "@/lib/types" interface StickerCardProps { sticker: Sticker quantity: number userId: string isSelected?: boolean onSelect?: (stickerId: string) => void selectionMode?: boolean onQuantityChange?: (stickerId: string, newQuantity: number) => void } export function StickerCard({ sticker, quantity: initialQuantity, userId, isSelected = false, onSelect, selectionMode = false, onQuantityChange, }: StickerCardProps) { const [quantity, setQuantity] = useState(initialQuantity) const [isPending, startTransition] = useTransition() const status = quantity === 0 ? "missing" : quantity === 1 ? "have" : "duplicate" const updateQuantity = async (newQuantity: number) => { if (newQuantity < 0) return const supabase = createClient() const prevQuantity = quantity setQuantity(newQuantity) startTransition(async () => { try { if (newQuantity === 0) { const { error } = await supabase .from("user_stickers") .delete() .eq("user_id", userId) .eq("sticker_id", sticker.id) if (error) throw error } else if (prevQuantity === 0) { const { error } = await supabase .from("user_stickers") .insert({ user_id: userId, sticker_id: sticker.id, quantity: newQuantity, }) if (error) throw error } else { const { error } = await supabase .from("user_stickers") .update({ quantity: newQuantity, updated_at: new Date().toISOString() }) .eq("user_id", userId) .eq("sticker_id", sticker.id) if (error) throw error } onQuantityChange?.(sticker.id, newQuantity) } catch { setQuantity(prevQuantity) } }) } const handleClick = () => { if (selectionMode && onSelect) { onSelect(sticker.id) } else { updateQuantity(quantity + 1) } } return (

{/* Selection checkbox */} {selectionMode && (

{isSelected && ( )}

)} {/* Sticker number */} {sticker.number} {/* Name (truncated) */} {sticker.name && ( {sticker.name} )} {/* Special indicator */} {sticker.is_special && ( )} {/* Quantity badge */} {status === "duplicate" && ( {quantity} )} {/* Quantity controls on hover (only in non-selection mode) */} {!selectionMode && quantity > 0 && (

{quantity}

)}

) } [V0_FILE]typescriptreact:file="components/album/album-view.tsx" isMerged="true" "use client" import { useState, useMemo, useCallback, useTransition } from "react" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Search, Filter, CheckSquare, X, Plus, Loader2, Copy } from "lucide-react" import { TeamSection } from "./team-section" import { QuickAddPanel } from "./quick-add-panel" import type { Team, Sticker, UserSticker } from "@/lib/types" import { createClient } from "@/lib/supabase/client" import { useRouter } from "next/navigation" import { DropdownMenu, DropdownMenuContent, DropdownMenuCheckboxItem, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu" interface AlbumViewProps { teams: Team[] stickers: Sticker[] userStickers: UserSticker[] userId: string } type FilterType = "all" | "have" | "missing" | "duplicates" export function AlbumView({ teams, stickers, userStickers, userId }: AlbumViewProps) { const [search, setSearch] = useState("") const [filter, setFilter] = useState("all") const [selectedCategory, setSelectedCategory] = useState("all") const [selectionMode, setSelectionMode] = useState(false) const [selectedIds, setSelectedIds] = useState>(new Set()) const [isPending, startTransition] = useTransition() const router = useRouter() const userStickerMap = useMemo(() => { const map = new Map() userStickers.forEach((us) => map.set(us.sticker_id, us)) return map }, [userStickers]) const categories = useMemo(() => { const cats = new Set() teams.forEach((t) => cats.add(t.category)) return ["all", ...Array.from(cats)] }, [teams]) const filteredTeams = useMemo(() => { if (selectedCategory === "all") return teams return teams.filter((t) => t.category === selectedCategory) }, [teams, selectedCategory]) const filteredStickers = useMemo(() => { return stickers.filter((sticker) => { if (search) { const searchLower = search.toLowerCase() const matchesNumber = sticker.number.toString().includes(search) const matchesName = sticker.name?.toLowerCase().includes(searchLower) const matchesTeam = sticker.team?.name.toLowerCase().includes(searchLower) if (!matchesNumber && !matchesName && !matchesTeam) return false } const userSticker = userStickerMap.get(sticker.id) const quantity = userSticker?.quantity || 0 if (filter === "have" && quantity < 1) return false if (filter === "missing" && quantity >= 1) return false if (filter === "duplicates" && quantity <= 1) return false return true }) }, [stickers, search, filter, userStickerMap]) const handleSelect = useCallback((stickerId: string) => { setSelectedIds((prev) => { const next = new Set(prev) if (next.has(stickerId)) { next.delete(stickerId) } else { next.add(stickerId) } return next }) }, []) const handleBulkAdd = async (action: "have" | "duplicate") => { if (selectedIds.size === 0) return startTransition(async () => { const supabase = createClient() const upsertData = Array.from(selectedIds).map((stickerId) => { const existing = userStickerMap.get(stickerId) let quantity = 1 if (action === "duplicate") { quantity = (existing?.quantity || 0) + 1 if (quantity < 2) quantity = 2 } return { user_id: userId, sticker_id: stickerId, quantity, } }) const { error } = await supabase .from("user_stickers") .upsert(upsertData, { onConflict: "user_id,sticker_id" }) if (!error) { setSelectedIds(new Set()) setSelectionMode(false) router.refresh() } }) } const handleBulkRemove = async () => { if (selectedIds.size === 0) return startTransition(async () => { const supabase = createClient() const { error } = await supabase .from("user_stickers") .delete() .eq("user_id", userId) .in("sticker_id", Array.from(selectedIds)) if (!error) { setSelectedIds(new Set()) setSelectionMode(false) router.refresh() } }) } const handleQuantityChange = useCallback((_stickerId: string, _newQuantity: number) => { // optimistic - refresh handled by sticker card }, []) const categoryLabels: Record = { all: "Todas las categorias", team: "Equipos", special: "Especiales", legends: "Leyendas", intro: "Introduccion", } return (

{/* Quick add panel */} {/* Search and filters */}

setSearch(e.target.value)} className="pl-10" />

{categories.map((cat) => ( setSelectedCategory(cat)} > {categoryLabels[cat] || cat} ))}

setFilter(v as FilterType)}> Todas Tengo Faltan Repetidas

{/* Bulk action bar */} {selectionMode && (

{selectedIds.size} seleccionada{selectedIds.size !== 1 ? "s" : ""} {selectedIds.size > 0 && ( )}

)} {/* Album sections */}

{filteredTeams.map((team) => { const teamStickers = filteredStickers.filter( (s) => s.team_id === team.id, ) if (teamStickers.length === 0) return null return ( ) })}

{filteredStickers.length === 0 && (

No se encontraron figuritas

)}

) } [V0_FILE]typescriptreact:file="app/(app)/groups/page.tsx" isMerged="true" import { createClient } from "@/lib/supabase/server" import { GroupsList } from "@/components/groups/groups-list" import { MyGroups } from "@/components/groups/my-groups" import { CreateGroupDialog } from "@/components/groups/create-group-dialog" import type { University, UserUniversity, CustomGroup, CustomGroupMember } from "@/lib/types" export default async function GroupsPage() { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() // Get all universities const { data: universities } = await supabase .from("universities") .select("*") .order("name", { ascending: true }) // Get user's universities const { data: userUniversities } = await supabase .from("user_universities") .select("*, university:universities(*)") .eq("user_id", user?.id) // Get all custom groups with member count const { data: customGroups } = await supabase .from("custom_groups") .select("*, members:custom_group_members(count)") .order("created_at", { ascending: false }) // Get user's custom group memberships const { data: userGroupMemberships } = await supabase .from("custom_group_members") .select("*") .eq("user_id", user?.id) const joinedUniIds = userUniversities?.map(uu => uu.university_id) || [] const joinedGroupIds = userGroupMemberships?.map(m => m.group_id) || [] return (

Grupos

Unite a tu universidad o crea grupos custom para intercambiar figuritas

{/* My groups section */} {((userUniversities && userUniversities.length > 0) || (userGroupMemberships && userGroupMemberships.length > 0)) && ( joinedGroupIds.includes(g.id)) || []} userId={user?.id || ""} /> )} {/* Available universities */} !joinedGroupIds.includes(g.id)) || []} userId={user?.id || ""} />

) } [V0_FILE]typescriptreact:file="components/groups/my-groups.tsx" isMerged="true" "use client" import { useState, useTransition } from "react" import { Card } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { createClient } from "@/lib/supabase/client" import { Users, LogOut, ArrowRight, GraduationCap, Lock, Globe, Loader2 } from "lucide-react" import { useRouter } from "next/navigation" import Link from "next/link" import type { University, UserUniversity, CustomGroup } from "@/lib/types" interface MyGroupsProps { userUniversities: (UserUniversity & { university: University })[] customGroups: (CustomGroup & { members: { count: number }[] })[] userId: string } export function MyGroups({ userUniversities, customGroups, userId }: MyGroupsProps) { const router = useRouter() const [leaving, setLeaving] = useState(null) const [isPending, startTransition] = useTransition() const handleLeaveUni = async (userUniversityId: string) => { setLeaving(userUniversityId) const supabase = createClient() startTransition(async () => { try { const { error } = await supabase .from("user_universities") .delete() .eq("id", userUniversityId) .eq("user_id", userId) if (error) throw error router.refresh() } catch { // silently fail } finally { setLeaving(null) } }) } const handleLeaveGroup = async (groupId: string) => { setLeaving(groupId) const supabase = createClient() startTransition(async () => { try { const { error } = await supabase .from("custom_group_members") .delete() .eq("group_id", groupId) .eq("user_id", userId) if (error) throw error router.refresh() } catch { // silently fail } finally { setLeaving(null) } }) } if (userUniversities.length === 0 && customGroups.length === 0) return null return (

Mis grupos

{/* University groups */} {userUniversities.map((uu) => { const isLeaving = leaving === uu.id return (

{uu.university.name}

Universidad

) })} {/* Custom groups */} {customGroups.map((group) => { const isLeaving = leaving === group.id const memberCount = group.members?.[0]?.count || 0 return (

{group.password_hash ? ( ) : ( )}

{group.name}

{memberCount} miembro{memberCount !== 1 ? "s" : ""} - Grupo custom

) })}

) } [V0_FILE]typescriptreact:file="app/(app)/groups/[slug]/page.tsx" isMerged="true" import { createClient } from "@/lib/supabase/server" import { notFound } from "next/navigation" import { GroupMembers } from "@/components/groups/group-members" import { FindTrades } from "@/components/groups/find-trades" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Button } from "@/components/ui/button" import { ArrowLeft, Users } from "lucide-react" import Link from "next/link" export default async function GroupDetailPage({ params, }: { params: Promise<{ slug: string }> }) { const { slug } = await params const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() // Get university const { data: university } = await supabase .from("universities") .select("*") .eq("slug", slug) .single() if (!university) { notFound() } // Check if user is member const { data: membership } = await supabase .from("user_universities") .select("*") .eq("user_id", user?.id) .eq("university_id", university.id) .single() if (!membership) { notFound() } // Get all members with their stickers const { data: members } = await supabase .from("user_universities") .select(` *, profile:profiles(*) `) .eq("university_id", university.id) // Get current user's missing stickers const { data: albumConfig } = await supabase .from("album_config") .select("*") .eq("is_active", true) .single() const { data: allStickers } = await supabase .from("stickers") .select("*") .eq("album_id", albumConfig?.id) const { data: userStickers } = await supabase .from("user_stickers") .select("*, sticker:stickers(*)") .eq("user_id", user?.id) const userStickerIds = new Set(userStickers?.filter(us => us.quantity >= 1).map(us => us.sticker_id) || []) const missingStickers = allStickers?.filter(s => !userStickerIds.has(s.id)) || [] const duplicateStickers = userStickers?.filter(us => us.quantity > 1) || [] return (

{university.name}

{members?.length || 0} miembros

Buscar intercambios Miembros

) } [V0_FILE]typescriptreact:file="components/groups/groups-list.tsx" isMerged="true" "use client" import { useState, useTransition, useMemo } from "react" import { Card } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { createClient } from "@/lib/supabase/client" import { Users, Check, Plus, Search, Lock, GraduationCap, Loader2, Globe } from "lucide-react" import { useRouter } from "next/navigation" import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from "@/components/ui/dialog" import { Label } from "@/components/ui/label" import type { University, CustomGroup } from "@/lib/types" interface GroupsListProps { universities: University[] joinedUniIds: string[] customGroups: (CustomGroup & { members: { count: number }[] })[] userId: string } export function GroupsList({ universities, joinedUniIds, customGroups, userId }: GroupsListProps) { const router = useRouter() const [search, setSearch] = useState("") const [joining, setJoining] = useState(null) const [isPending, startTransition] = useTransition() const [passwordDialog, setPasswordDialog] = useState(null) const [passwordAttempt, setPasswordAttempt] = useState("") const [passwordError, setPasswordError] = useState(null) const availableUnis = useMemo( () => universities.filter((u) => !joinedUniIds.includes(u.id)), [universities, joinedUniIds], ) const filtered = useMemo(() => { const searchLower = search.toLowerCase() const filteredUnis = availableUnis.filter((u) => u.name.toLowerCase().includes(searchLower) || u.slug.toLowerCase().includes(searchLower), ) const filteredGroups = customGroups.filter((g) => g.name.toLowerCase().includes(searchLower) || g.description?.toLowerCase().includes(searchLower), ) return { unis: filteredUnis, groups: filteredGroups } }, [availableUnis, customGroups, search]) const handleJoinUni = async (universityId: string) => { setJoining(universityId) const supabase = createClient() startTransition(async () => { try { const { error } = await supabase .from("user_universities") .insert({ user_id: userId, university_id: universityId }) if (error) throw error router.refresh() } catch { // silently fail } finally { setJoining(null) } }) } const handleJoinGroup = async (group: CustomGroup) => { if (group.password_hash) { setPasswordDialog(group) setPasswordAttempt("") setPasswordError(null) return } await joinGroup(group.id) } const joinGroup = async (groupId: string) => { setJoining(groupId) const supabase = createClient() startTransition(async () => { try { const { error } = await supabase .from("custom_group_members") .insert({ group_id: groupId, user_id: userId }) if (error) throw error setPasswordDialog(null) router.refresh() } catch { // silently fail } finally { setJoining(null) } }) } const handlePasswordSubmit = async (e: React.FormEvent) => { e.preventDefault() if (!passwordDialog) return setPasswordError(null) setJoining(passwordDialog.id) const supabase = createClient() startTransition(async () => { try { const { data: isValid } = await supabase.rpc("verify_group_password", { group_slug: passwordDialog.slug, attempt: passwordAttempt, }) if (!isValid) { setPasswordError("Contrasena incorrecta") setJoining(null) return } await joinGroup(passwordDialog.id) } catch { setPasswordError("Error al verificar la contrasena") setJoining(null) } }) } const hasContent = filtered.unis.length > 0 || filtered.groups.length > 0 return (

{/* Search bar */}

setSearch(e.target.value)} className="pl-10" />

{/* Universities */} {filtered.unis.length > 0 && (

Universidades

{filtered.unis.map((university) => { const isJoining = joining === university.id return (

{university.name}

@{university.slug}

) })}

)} {/* Custom groups */} {filtered.groups.length > 0 && (

Grupos personalizados

{filtered.groups.map((group) => { const isJoining = joining === group.id const memberCount = group.members?.[0]?.count || 0 return (

{group.password_hash ? ( ) : ( )}

{group.name}

{memberCount} miembro{memberCount !== 1 ? "s" : ""} {group.password_hash ? " - Privado" : " - Publico"}

{group.description && (

{group.description}

)} ) })}

)} {!hasContent && (

{search ? "No se encontraron resultados" : "No hay grupos disponibles"}

{search ? "Intenta con otra busqueda" : "Crea un nuevo grupo para empezar a intercambiar"}

)} {/* Password dialog */}

) } [V0_FILE]typescriptreact:file="app/(app)/trades/page.tsx" isMerged="true" import { createClient } from "@/lib/supabase/server" import { TradesList } from "@/components/trades/trades-list" import type { TradeRequest, Profile, University } from "@/lib/types" export default async function TradesPage() { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() // Get trades where user is involved const { data: trades } = await supabase .from("trade_requests") .select(` *, requester:profiles!trade_requests_requester_id_fkey(*), receiver:profiles!trade_requests_receiver_id_fkey(*), university:universities(*) `) .or(`requester_id.eq.${user?.id},receiver_id.eq.${user?.id}`) .order("created_at", { ascending: false }) return (

Intercambios

Gestiona tus propuestas de intercambio

) } [V0_FILE]typescriptreact:file="components/groups/group-members.tsx" isMerged="true" "use client" import { Card } from "@/components/ui/card" import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" import type { Profile } from "@/lib/types" interface GroupMembersProps { members: { profile: Profile }[] currentUserId: string } export function GroupMembers({ members, currentUserId }: GroupMembersProps) { return (

{members.map((member) => { const isCurrentUser = member.profile.id === currentUserId const initials = (member.profile.display_name || "U").slice(0, 2).toUpperCase() return ( {initials}

{member.profile.display_name || "Usuario"} {isCurrentUser && ( (Vos) )}

) })}

) } [V0_FILE]typescriptreact:file="app/(app)/profile/page.tsx" isMerged="true" import { createClient } from "@/lib/supabase/server" import { ProfileForm } from "@/components/profile/profile-form" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" export default async function ProfilePage() { const supabase = await createClient() const { data: { user } } = await supabase.auth.getUser() const { data: profile } = await supabase .from("profiles") .select("*") .eq("id", user?.id) .single() // Get user stats const { data: userStickers } = await supabase .from("user_stickers") .select("quantity") .eq("user_id", user?.id) const { data: userGroups } = await supabase .from("user_universities") .select("id") .eq("user_id", user?.id) const { data: trades } = await supabase .from("trade_requests") .select("id") .or(`requester_id.eq.${user?.id},receiver_id.eq.${user?.id}`) const collected = userStickers?.filter(us => us.quantity >= 1).length || 0 const duplicates = userStickers?.reduce((acc, us) => acc + Math.max(0, us.quantity - 1), 0) || 0 const initials = (profile?.display_name || user?.email?.slice(0, 2) || "U").slice(0, 2).toUpperCase() return (

Mi Perfil

Administra tu cuenta y ve tus estadisticas

{/* Profile header */}

{initials}

{profile?.display_name || "Usuario"}

{user?.email}

{/* Stats */}

{collected}

Figuritas

{duplicates}

Repetidas

{userGroups?.length || 0}

Grupos

{/* Edit profile */} Editar perfil Actualiza tu informacion personal

) } [V0_FILE]typescriptreact:file="app/layout.tsx" isMerged="true" import React from "react" import type { Metadata, Viewport } from 'next' import { Inter, Geist_Mono } from 'next/font/google' import { Analytics } from '@vercel/analytics/next' import { Toaster } from '@/components/ui/toaster' import './globals.css' const _inter = Inter({ subsets: ["latin"] }); const _geistMono = Geist_Mono({ subsets: ["latin"] }); export const metadata: Metadata = { title: 'FiguWorld 2026 - Album de Figuritas del Mundial', description: 'Gestiona tu album del Mundial 2026. Registra tus figuritas, intercambia con tu universidad y completa tu coleccion.', generator: 'v0.app', manifest: '/manifest.json', icons: { icon: [ { url: '/icon-light-32x32.png', media: '(prefers-color-scheme: light)', }, { url: '/icon-dark-32x32.png', media: '(prefers-color-scheme: dark)', }, { url: '/icon.svg', type: 'image/svg+xml', }, ], apple: '/apple-icon.png', }, } export const viewport: Viewport = { themeColor: '#16a34a', width: 'device-width', initialScale: 1, maximumScale: 1, userScalable: false, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescript:file="lib/supabase/client.ts" isMerged="true" import { createBrowserClient } from '@supabase/ssr' import type { SupabaseClient } from '@supabase/supabase-js' let client: SupabaseClient | null = null export function createClient() { if (client) return client client = createBrowserClient( process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!, ) return client } [V0_FILE]typescriptreact:file="app/auth/login/page.tsx" isMerged="true" "use client" import { createClient } from "@/lib/supabase/client" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Trophy } from "lucide-react" import Link from "next/link" import { useState } from "react" export default function LoginPage() { const [isLoading, setIsLoading] = useState(false) const [error, setError] = useState(null) const handleGoogleLogin = async () => { setIsLoading(true) setError(null) const supabase = createClient() try { const redirectUrl = `${window.location.origin}/auth/callback` console.log("[v0] OAuth redirect URL:", redirectUrl) const { data, error } = await supabase.auth.signInWithOAuth({ provider: "google", options: { redirectTo: redirectUrl, queryParams: { access_type: 'offline', prompt: 'consent', } }, }) console.log("[v0] OAuth response:", { data, error }) if (error) throw error } catch (err) { console.error("[v0] OAuth error:", err) setError(err instanceof Error ? err.message : "Error al iniciar sesion") setIsLoading(false) } } return (

{/* Background decoration */}

FiguWorld 2026

Bienvenido Inicia sesion para gestionar tu album del Mundial 2026 {error && (

{error}

)}

Al continuar, aceptas los terminos de uso y la politica de privacidad.

Volver al inicio

) } [V0_FILE]typescriptreact:file="components/album/quick-add-panel.tsx" isMerged="true" "use client" import { useState, useTransition, useRef } from "react" import { createClient } from "@/lib/supabase/client" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Badge } from "@/components/ui/badge" import { Card } from "@/components/ui/card" import { X, Plus, Zap, Loader2 } from "lucide-react" import { useRouter } from "next/navigation" import type { Sticker } from "@/lib/types" interface QuickAddPanelProps { stickers: Sticker[] userId: string userStickerMap: Map } export function QuickAddPanel({ stickers, userId, userStickerMap }: QuickAddPanelProps) { const [isOpen, setIsOpen] = useState(false) const [inputValue, setInputValue] = useState("") const [selectedNumbers, setSelectedNumbers] = useState([]) const [suggestions, setSuggestions] = useState([]) const [isPending, startTransition] = useTransition() const inputRef = useRef(null) const router = useRouter() const stickerByNumber = new Map(stickers.map((s) => [s.number, s])) const handleInputChange = (value: string) => { setInputValue(value) if (!value.trim()) { setSuggestions([]) return } const searchLower = value.toLowerCase() const isNumeric = /^\d+$/.test(value.trim()) if (isNumeric) { const num = parseInt(value.trim(), 10) const matches = stickers .filter((s) => s.number.toString().startsWith(value.trim())) .slice(0, 8) setSuggestions(matches) // If exact match, don't show suggestions if (stickerByNumber.has(num) && value.trim() === num.toString()) { setSuggestions([]) } } else { // Search by name const matches = stickers .filter( (s) => s.name?.toLowerCase().includes(searchLower) || s.team?.name.toLowerCase().includes(searchLower), ) .slice(0, 8) setSuggestions(matches) } } const addNumber = (num: number) => { if (!selectedNumbers.includes(num) && stickerByNumber.has(num)) { setSelectedNumbers((prev) => [...prev, num]) } setInputValue("") setSuggestions([]) inputRef.current?.focus() } const removeNumber = (num: number) => { setSelectedNumbers((prev) => prev.filter((n) => n !== num)) } const handleKeyDown = (e: React.KeyboardEvent) => { if (e.key === "Enter" && inputValue.trim()) { e.preventDefault() const num = parseInt(inputValue.trim(), 10) if (!isNaN(num) && stickerByNumber.has(num)) { addNumber(num) } } else if (e.key === "," || e.key === " ") { e.preventDefault() const num = parseInt(inputValue.trim(), 10) if (!isNaN(num) && stickerByNumber.has(num)) { addNumber(num) } } else if ( e.key === "Backspace" && inputValue === "" && selectedNumbers.length > 0 ) { removeNumber(selectedNumbers[selectedNumbers.length - 1]) } } const handleSaveAll = async () => { if (selectedNumbers.length === 0) return startTransition(async () => { const supabase = createClient() // Build upsert data const upsertData = selectedNumbers.map((num) => { const sticker = stickerByNumber.get(num)! const existing = userStickerMap.get(sticker.id) return { user_id: userId, sticker_id: sticker.id, quantity: (existing?.quantity || 0) + 1, } }) const { error } = await supabase .from("user_stickers") .upsert(upsertData, { onConflict: "user_id,sticker_id" }) if (!error) { setSelectedNumbers([]) setIsOpen(false) router.refresh() } }) } if (!isOpen) { return ( ) } return (

Agregar figuritas

Escribi numeros separados por coma/espacio o busca por nombre del jugador.

{/* Selected stickers */} {selectedNumbers.length > 0 && (

{selectedNumbers.map((num) => { const sticker = stickerByNumber.get(num) return ( {num} {sticker?.name && ( {sticker.name} )} ) })}

)} {/* Input with suggestions */}

handleInputChange(e.target.value)} onKeyDown={handleKeyDown} placeholder="Ej: 119, 140, 39 o 'Messi'" className="text-sm" autoFocus /> {/* Autocomplete suggestions */} {suggestions.length > 0 && (

{suggestions.map((s) => { const isAlreadySelected = selectedNumbers.includes(s.number) return ( ) })}

)}

{/* Save button */}

{selectedNumbers.length} figurita{selectedNumbers.length !== 1 ? "s" : ""} seleccionada{selectedNumbers.length !== 1 ? "s" : ""}

) } [V0_FILE]typescriptreact:file="components/groups/create-group-dialog.tsx" isMerged="true" "use client" import { useState, useTransition } from "react" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { Textarea } from "@/components/ui/textarea" import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog" import { Plus, Lock, Loader2 } from "lucide-react" import { createClient } from "@/lib/supabase/client" import { useRouter } from "next/navigation" interface CreateGroupDialogProps { userId: string } function slugify(text: string): string { return text .toLowerCase() .normalize("NFD") .replace(/[\u0300-\u036f]/g, "") .replace(/[^a-z0-9]+/g, "-") .replace(/(^-|-$)+/g, "") } export function CreateGroupDialog({ userId }: CreateGroupDialogProps) { const [open, setOpen] = useState(false) const [name, setName] = useState("") const [description, setDescription] = useState("") const [password, setPassword] = useState("") const [error, setError] = useState(null) const [isPending, startTransition] = useTransition() const router = useRouter() const handleSubmit = (e: React.FormEvent) => { e.preventDefault() if (!name.trim()) return setError(null) startTransition(async () => { const supabase = createClient() const slug = slugify(name) // Check if slug exists const { data: existing } = await supabase .from("custom_groups") .select("id") .eq("slug", slug) .maybeSingle() if (existing) { setError("Ya existe un grupo con ese nombre. Elegi otro.") return } // Create group - use RPC to hash password server-side let passwordHash: string | null = null if (password.trim()) { const { data: hashResult } = await supabase.rpc("hash_password", { plain_password: password.trim(), }) passwordHash = hashResult } // If RPC doesn't exist, we'll insert without hashing // and handle it differently const { data: group, error: insertError } = await supabase .from("custom_groups") .insert({ name: name.trim(), slug, description: description.trim() || null, password_hash: passwordHash, created_by: userId, is_public: !password.trim(), }) .select() .single() if (insertError) { setError("Error al crear el grupo. Intenta con otro nombre.") return } // Auto-join as member await supabase.from("custom_group_members").insert({ group_id: group.id, user_id: userId, }) setName("") setDescription("") setPassword("") setOpen(false) router.refresh() }) } return (

Todo lo que necesitas para completar tu album

Listo para completar tu album?

{title}

Mi Album

{team.name}

Grupos

Mis grupos

{uu.university.name}

{group.name}

{university.name}

Universidades

{university.name}

Grupos personalizados

{group.name}

{search ? "No se encontraron resultados" : "No hay grupos disponibles"}

Intercambios

Mi Perfil

{profile?.display_name || "Usuario"}

Agregar figuritas