diff --git a/app/final/page.tsx b/app/final/page.tsx index 82fa9a4..9b207bb 100644 --- a/app/final/page.tsx +++ b/app/final/page.tsx @@ -1,6 +1,6 @@ "use client"; -import { useEffect, useState, Suspense } from 'react'; +import { useEffect, useState } from 'react'; import { useSearchParams } from 'next/navigation'; import Image from 'next/image'; @@ -14,7 +14,7 @@ interface MovieWithPoster { rank: number; } -function FinalPageContent() { +export default function FinalPage() { const [topMovies, setTopMovies] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); @@ -311,15 +311,3 @@ function FinalPageContent() { ); } -export default function FinalPage() { - return ( - -
Loading results...
- - }> - - - ); -} - diff --git a/app/home/page.tsx b/app/home/page.tsx index d0eedc5..6422e29 100644 --- a/app/home/page.tsx +++ b/app/home/page.tsx @@ -25,13 +25,13 @@ export default function HomePage() {
{/* Left Section - Text and CTA */} -
+
{/* Two-line Headline */}

Flago your
- Movies + movies

@@ -39,9 +39,9 @@ export default function HomePage() {

Pick the perfect movie in seconds.
- Set your preferences and let our AI handle the rest - solo or with friends. + Set your preferences with your friends and let our AI handle the rest.
- With friends? Use Create a Party.Watching alone? Tap Get Started. (top-right). + Use Create a Party to get started.

{/* Call-to-Action Button */} diff --git a/app/layout.tsx b/app/layout.tsx index 236f446..06256de 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -4,6 +4,7 @@ import { ThemeProvider } from "next-themes"; import "./globals.css"; import FlagoNavbar from "@/components/flago-navbar"; import ConditionalNavbar from "@/components/conditional-navbar"; +import Footer from "@/components/footer"; const defaultUrl = process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` @@ -115,9 +116,12 @@ export default function RootLayout({ enableSystem disableTransitionOnChange > -
+
- {children} +
+ {children} +
+
diff --git a/app/page.tsx b/app/page.tsx index 9bbae24..b49401e 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -21,17 +21,17 @@ export default function HomePage() { return (
{/* Main Content Area */} -
+
{/* Left Section - Text and CTA */} -
+
{/* Two-line Headline */}

Flago your
- Movies + movies

@@ -39,9 +39,9 @@ export default function HomePage() {

Pick the perfect movie in seconds.
- Set your preferences and let our AI handle the rest - solo or with friends. + Set your preferences with your friends and let our AI handle the rest.
- With friends? Use Create a Party.Watching alone? Tap Get Started. (top-right). + Use Create a Party to get started.

{/* Call-to-Action Button */} diff --git a/components/conditional-navbar.tsx b/components/conditional-navbar.tsx index 29511d0..22a21d9 100644 --- a/components/conditional-navbar.tsx +++ b/components/conditional-navbar.tsx @@ -8,7 +8,7 @@ export default function ConditionalNavbar() { // Only show navbar on home page (exact match with "/") // Hide it on all other pages including party routes - if (pathname === '/') { + if (pathname === '/home' || pathname === '/about' || pathname === '/contact_us' || pathname === '/') { return ; } diff --git a/components/flago-navbar.tsx b/components/flago-navbar.tsx index e3e6fdd..51515af 100644 --- a/components/flago-navbar.tsx +++ b/components/flago-navbar.tsx @@ -131,7 +131,7 @@ export default function FlagoNavbar() { {/* Right Section - Get Started Button */}
{/* Text and icon */} - Get Started + Create a Party ([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); + const [confettiData, setConfettiData] = useState(null); useEffect(() => { fetchResults(); }, [partySlug]); + // Load confetti animation + useEffect(() => { + fetch('/confetti.json') + .then((res) => res.json()) + .then((data) => setConfettiData(data)) + .catch((err) => console.error('Error loading confetti animation:', err)); + }, []); + const fetchResults = async () => { try { setLoading(true); @@ -119,10 +130,23 @@ export function PartyResults({ partySlug }: PartyResultsProps) { } return ( - - - We think you should watch... - +
+ {/* Confetti Animation Overlay */} + {confettiData && !loading && !error && rankings.length > 0 && ( +
+ +
+ )} + + + + We think you should watch... +
{rankings.map((movie, index) => { @@ -215,8 +239,42 @@ export function PartyResults({ partySlug }: PartyResultsProps) { ); })}
+ + {/* Back to Home Button */} +
+ + Back to Home + + + + +
+
); } diff --git a/components/party/party-tinder-cards.tsx b/components/party/party-tinder-cards.tsx index ac9ebbc..27097ff 100644 --- a/components/party/party-tinder-cards.tsx +++ b/components/party/party-tinder-cards.tsx @@ -5,7 +5,6 @@ import { TinderCards } from '@/components/tinder-cards'; import { moviesToCardData } from '@/lib/elo_rating/movieToCardData'; import { subscribeToParty, unsubscribeFromParty } from '@/lib/party/realtime'; import type { RealtimeChannel } from '@supabase/supabase-js'; -import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; interface PartyTinderCardsProps { partySlug: string; @@ -241,60 +240,108 @@ export function PartyTinderCards({ partySlug, onComplete }: PartyTinderCardsProp if (loading) { return ( - - -

Loading movies...

- - +
+
+
+

Loading movies...

+
+
); } if (error) { return ( - - -

{error}

- - +
+
+
⚠️
+

{error}

+
+
); } if (movies.length === 0) { return ( - - -

No movies available. The host needs to generate movies first.

- - +
+
+
🎬
+

+ No movies available. The host needs to generate movies first. +

+
+
); } const remainingCount = movies.length - swipedMovies.size; + const progressPercentage = ((movies.length - remainingCount) / movies.length) * 100; return ( -
- - - - Swipe through movies ({remainingCount} remaining) - - - +
+ {/* Enhanced Header Card */} +
+
+
+

+ Swipe through movies +

+
+
+
+
+
+ {remainingCount} left +
+
+
+
+
+ + {Math.round(progressPercentage)}% complete + +
+
+
+ {/* Swipe Instructions */} + {remainingCount > 0 && remainingCount === movies.length && ( +
+
+
👆
+
+

Swipe right to like, left to pass

+

Or use the buttons below

+
+
+
+ )} + + {/* Tinder Cards */} {remainingCount > 0 ? ( - +
+ +
) : ( - - -

All done! 🎉

-

+

+
+
🎉
+

All done!

+

Waiting for other members to finish swiping...

- - +
+
+
+
+
+
+
)}
);