diff --git a/src/components/homepage/FeaturedParks.tsx b/src/components/homepage/FeaturedParks.tsx new file mode 100644 index 00000000..75dae7c0 --- /dev/null +++ b/src/components/homepage/FeaturedParks.tsx @@ -0,0 +1,184 @@ +import { useState, useEffect } from 'react'; +import { Star, TrendingUp, Award } from 'lucide-react'; +import { Card, CardContent } from '@/components/ui/card'; +import { Badge } from '@/components/ui/badge'; +import { Button } from '@/components/ui/button'; +import { Park } from '@/types/database'; +import { supabase } from '@/integrations/supabase/client'; + +export function FeaturedParks() { + const [topRatedParks, setTopRatedParks] = useState([]); + const [mostRidesParks, setMostRidesParks] = useState([]); + const [loading, setLoading] = useState(true); + + useEffect(() => { + fetchFeaturedParks(); + }, []); + + const fetchFeaturedParks = async () => { + try { + // Fetch top rated parks + const { data: topRated } = await supabase + .from('parks') + .select(` + *, + location:locations(*), + operator:companies!parks_operator_id_fkey(*) + `) + .order('average_rating', { ascending: false }) + .limit(3); + + // Fetch parks with most rides + const { data: mostRides } = await supabase + .from('parks') + .select(` + *, + location:locations(*), + operator:companies!parks_operator_id_fkey(*) + `) + .order('ride_count', { ascending: false }) + .limit(3); + + setTopRatedParks(topRated || []); + setMostRidesParks(mostRides || []); + } catch (error) { + console.error('Error fetching featured parks:', error); + } finally { + setLoading(false); + } + }; + + const FeaturedParkCard = ({ park, icon: Icon, label }: { park: Park; icon: any; label: string }) => ( + +
+ {/* Gradient Background */} +
+
+ {park.park_type === 'theme_park' ? '🏰' : + park.park_type === 'amusement_park' ? '🎢' : + park.park_type === 'water_park' ? '🏊' : '🎪'} +
+
+ + {/* Featured Badge */} + + + {label} + + + {/* Rating Badge */} + + + {park.average_rating.toFixed(1)} + +
+ + +
+

+ {park.name} +

+ + {park.location && ( +

+ {park.location.city}, {park.location.country} +

+ )} + +
+
+ {park.ride_count} rides + {park.coaster_count} 🎢 +
+
+ {park.review_count} reviews +
+
+
+ +
+ + ); + + if (loading) { + return ( +
+
+
+
+
+ {[...Array(6)].map((_, i) => ( +
+ ))} +
+
+
+
+ ); + } + + return ( +
+
+
+

+ Featured + Destinations +

+

+ Discover the highest-rated parks and thrill capitals around the world +

+
+ + {/* Top Rated Parks */} +
+
+
+ +
+

Top Rated Parks

+
+ +
+ {topRatedParks.map((park) => ( + + ))} +
+
+ + {/* Most Rides */} +
+
+
+ +
+

Thrill Capitals

+
+ +
+ {mostRidesParks.map((park) => ( + + ))} +
+
+ + {/* Call to Action */} +
+ +
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/homepage/HeroSearch.tsx b/src/components/homepage/HeroSearch.tsx new file mode 100644 index 00000000..9d467753 --- /dev/null +++ b/src/components/homepage/HeroSearch.tsx @@ -0,0 +1,151 @@ +import { useState } from 'react'; +import { Search, MapPin, Calendar, Filter } from 'lucide-react'; +import { Input } from '@/components/ui/input'; +import { Button } from '@/components/ui/button'; +import { Badge } from '@/components/ui/badge'; +import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; + +export function HeroSearch() { + const [searchTerm, setSearchTerm] = useState(''); + const [selectedType, setSelectedType] = useState('all'); + const [selectedCountry, setSelectedCountry] = useState('all'); + + const popularSearches = [ + 'Cedar Point', 'Disney World', 'Europa-Park', 'Six Flags Magic Mountain', + 'Alton Towers', 'Roller Coasters', 'Theme Parks', 'Water Parks' + ]; + + const parkTypes = [ + { value: 'all', label: 'All Parks' }, + { value: 'theme_park', label: 'Theme Parks' }, + { value: 'amusement_park', label: 'Amusement Parks' }, + { value: 'water_park', label: 'Water Parks' } + ]; + + const countries = [ + { value: 'all', label: 'All Countries' }, + { value: 'United States', label: 'United States' }, + { value: 'Germany', label: 'Germany' }, + { value: 'United Kingdom', label: 'United Kingdom' }, + { value: 'Netherlands', label: 'Netherlands' } + ]; + + const handleSearch = () => { + console.log('Searching for:', searchTerm, selectedType, selectedCountry); + // TODO: Implement actual search functionality + }; + + return ( +
+ {/* Main Search Card */} +
+
+ {/* Search Input Row */} +
+ {/* Main Search */} +
+ + setSearchTerm(e.target.value)} + className="pl-12 pr-4 h-12 text-lg bg-muted/50 border-border/50 focus:border-primary/50 rounded-xl" + onKeyDown={(e) => e.key === 'Enter' && handleSearch()} + /> +
+ + {/* Park Type Filter */} + + + {/* Country Filter */} + + + {/* Search Button */} + +
+ + {/* Quick Action Buttons */} +
+ + + +
+
+
+ + {/* Popular Searches */} +
+

Popular searches:

+
+ {popularSearches.map((search, index) => ( + setSearchTerm(search)} + > + {search} + + ))} +
+
+ + {/* Stats Row */} +
+
+
12+
+
Parks Listed
+
+
+
500+
+
Rides Tracked
+
+
+
10+
+
Countries
+
+
+
50K+
+
Reviews
+
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/homepage/QuickActions.tsx b/src/components/homepage/QuickActions.tsx new file mode 100644 index 00000000..f97b271c --- /dev/null +++ b/src/components/homepage/QuickActions.tsx @@ -0,0 +1,114 @@ +import { MapPin, Search, Star, TrendingUp, Globe, Users } from 'lucide-react'; +import { Button } from '@/components/ui/button'; +import { Card, CardContent } from '@/components/ui/card'; +import { Badge } from '@/components/ui/badge'; + +export function QuickActions() { + const actions = [ + { + icon: MapPin, + title: 'Find Parks Near Me', + description: 'Discover theme parks in your area', + badge: 'Popular', + color: 'from-primary/20 to-primary/10', + borderColor: 'border-primary/20' + }, + { + icon: Search, + title: 'Advanced Search', + description: 'Filter by rides, location, and ratings', + badge: 'New', + color: 'from-secondary/20 to-secondary/10', + borderColor: 'border-secondary/20' + }, + { + icon: Star, + title: 'Top Rated Parks', + description: 'Browse the highest-rated destinations', + badge: 'Trending', + color: 'from-accent/20 to-accent/10', + borderColor: 'border-accent/20' + }, + { + icon: TrendingUp, + title: 'Coaster Rankings', + description: 'See the world\'s best roller coasters', + badge: 'Hot', + color: 'from-primary/20 to-secondary/10', + borderColor: 'border-primary/20' + }, + { + icon: Globe, + title: 'Browse by Country', + description: 'Explore parks around the world', + badge: null, + color: 'from-secondary/20 to-accent/10', + borderColor: 'border-secondary/20' + }, + { + icon: Users, + title: 'Join Community', + description: 'Connect with fellow enthusiasts', + badge: 'Free', + color: 'from-accent/20 to-primary/10', + borderColor: 'border-accent/20' + } + ]; + + return ( +
+
+
+

+ Quick + Actions +

+

+ Jump right into exploring with these popular features +

+
+ +
+ {actions.map((action, index) => ( + + +
+
+ +
+ {action.badge && ( + + {action.badge} + + )} +
+ +
+

+ {action.title} +

+

+ {action.description} +

+
+ + + + + ))} +
+
+
+ ); +} \ No newline at end of file diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index dfea5382..f99ded6a 100644 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -1,95 +1,99 @@ import { Header } from '@/components/layout/Header'; import { ParkGrid } from '@/components/parks/ParkGrid'; +import { FeaturedParks } from '@/components/homepage/FeaturedParks'; +import { QuickActions } from '@/components/homepage/QuickActions'; +import { HeroSearch } from '@/components/homepage/HeroSearch'; import { Button } from '@/components/ui/button'; import { Badge } from '@/components/ui/badge'; -import { Zap, MapPin, Star, TrendingUp, Users } from 'lucide-react'; +import { Zap, MapPin, Star, TrendingUp, Users, Globe, Award } from 'lucide-react'; const Index = () => { return (
- {/* Hero Section */} -
+ {/* Enhanced Hero Section */} +
+ {/* Animated Background */}
-
-
-
- - 🚀 Beta Version - - - Community Driven - -
- -

- The Ultimate -
- - Theme Park Database - -

- -

- Discover amazing theme parks, track your ride credits, share reviews, and connect with fellow thrill seekers worldwide. -

- -
- - -
+
+ {/* Floating Elements */} +
+
+
+
+
+
+
+
+
+
+
- {/* Floating Elements */} -
-
-
-
-
-
-
-
-
-
+
+
+
+ + + Beta Version + + + + Community Driven + + + + Worldwide + +
+ +

+ Discover +
+ + Epic Thrills + +

+ +

+ The ultimate theme park database. Discover amazing parks, track your ride credits, + share reviews, and connect with fellow thrill seekers worldwide. +

+ + {/* Enhanced Search Component */} +
+ +
- {/* Stats Section */} -
-
-
-
-
2,500+
-
Theme Parks
-
-
-
15,000+
-
Rides Tracked
-
-
-
50,000+
-
User Reviews
-
-
-
180+
-
Countries
+ {/* Quick CTA Buttons */} +
+ +
+ {/* Quick Actions */} + + + {/* Featured Parks */} + + {/* Features Section */} -
-
+
+

- Everything You Need for Your + Everything for Your Thrill Journey

@@ -98,59 +102,102 @@ const Index = () => {

-
-
- +
+
+
-

Discover Parks

-

- Explore thousands of theme parks worldwide with detailed information, photos, and reviews. +

Discover Parks

+

+ Explore thousands of theme parks worldwide with detailed information, photos, and authentic reviews from fellow enthusiasts.

+
-
-
- +
+
+
-

Track Credits

-

- Keep track of every ride you've experienced and build your personal coaster portfolio. +

Track Credits

+

+ Keep track of every ride you've experienced and build your personal coaster portfolio with detailed statistics.

+
-
-
- +
+
+
-

Join Community

-

- Share reviews, create top lists, and connect with fellow theme park enthusiasts. +

Join Community

+

+ Share reviews, create top lists, and connect with thousands of passionate theme park enthusiasts.

+
- {/* Parks Section */} -
+ {/* All Parks Section */} +
+
+
+

+ Browse All + Parks +

+

+ Discover every park in our comprehensive database +

+
+
- {/* CTA Section */} -
+ {/* Final CTA Section */} +
-
-

- Ready to Start Your - Thrill Adventure? +
+
+ + + Free Forever + + + + No Ads + +
+ +

+ Ready for Your Next +
+ + Thrill Adventure? +

-

- Join thousands of theme park enthusiasts and start tracking your rides today! + +

+ Join thousands of theme park enthusiasts and start tracking your rides today! + Completely free, no ads, just pure passion for thrills.

- + +
+ + +

diff --git a/supabase/migrations/20250920002316_6db5c5b5-48bc-41d5-970a-968b0bf0f066.sql b/supabase/migrations/20250920002316_6db5c5b5-48bc-41d5-970a-968b0bf0f066.sql new file mode 100644 index 00000000..bb8fd8f3 --- /dev/null +++ b/supabase/migrations/20250920002316_6db5c5b5-48bc-41d5-970a-968b0bf0f066.sql @@ -0,0 +1,52 @@ +-- Insert sample data for ThrillWiki (without reviews for now) + +-- Insert sample locations +INSERT INTO public.locations (id, name, country, state_province, city, postal_code, latitude, longitude, timezone) VALUES +('550e8400-e29b-41d4-a716-446655440001', 'Orlando, Florida', 'United States', 'Florida', 'Orlando', '32819', 28.3852, -81.5639, 'America/New_York'), +('550e8400-e29b-41d4-a716-446655440002', 'Anaheim, California', 'United States', 'California', 'Anaheim', '92802', 33.8121, -117.9190, 'America/Los_Angeles'), +('550e8400-e29b-41d4-a716-446655440003', 'Sandusky, Ohio', 'United States', 'Ohio', 'Sandusky', '44870', 41.4814, -82.6830, 'America/New_York'), +('550e8400-e29b-41d4-a716-446655440004', 'Busch Gardens Tampa', 'United States', 'Florida', 'Tampa', '33612', 28.0373, -82.4194, 'America/New_York'), +('550e8400-e29b-41d4-a716-446655440005', 'Valencia, California', 'United States', 'California', 'Valencia', '91355', 34.4208, -118.5973, 'America/Los_Angeles'), +('550e8400-e29b-41d4-a716-446655440006', 'Doswell, Virginia', 'United States', 'Virginia', 'Doswell', '23047', 37.7606, -77.4472, 'America/New_York'), +('550e8400-e29b-41d4-a716-446655440007', 'Williamsburg, Virginia', 'United States', 'Virginia', 'Williamsburg', '23185', 37.2707, -76.7075, 'America/New_York'), +('550e8400-e29b-41d4-a716-446655440008', 'Alton, England', 'United Kingdom', 'Staffordshire', 'Alton', 'ST10 4DB', 52.9875, -1.8889, 'Europe/London'), +('550e8400-e29b-41d4-a716-446655440009', 'Rust, Germany', 'Germany', 'Baden-Württemberg', 'Rust', '77977', 48.2665, 7.7221, 'Europe/Berlin'), +('550e8400-e29b-41d4-a716-446655440010', 'Kaatsheuvel, Netherlands', 'Netherlands', 'North Brabant', 'Kaatsheuvel', '5171 KW', 51.6500, 5.0431, 'Europe/Amsterdam'); + +-- Insert sample companies +INSERT INTO public.companies (id, name, slug, description, company_type, website_url, founded_year, headquarters_location, logo_url) VALUES +('660e8400-e29b-41d4-a716-446655440001', 'The Walt Disney Company', 'disney', 'American multinational mass media and entertainment conglomerate', 'operator', 'https://www.disney.com', 1923, 'Burbank, California', null), +('660e8400-e29b-41d4-a716-446655440002', 'Cedar Fair Entertainment Company', 'cedar-fair', 'American amusement park operator', 'operator', 'https://www.cedarfair.com', 1983, 'Sandusky, Ohio', null), +('660e8400-e29b-41d4-a716-446655440003', 'SeaWorld Parks & Entertainment', 'seaworld', 'American theme park and entertainment company', 'operator', 'https://seaworldparks.com', 1959, 'Orlando, Florida', null), +('660e8400-e29b-41d4-a716-446655440004', 'Six Flags Entertainment Corporation', 'six-flags', 'American amusement park corporation', 'operator', 'https://www.sixflags.com', 1961, 'Arlington, Texas', null), +('660e8400-e29b-41d4-a716-446655440005', 'Bolliger & Mabillard', 'bolliger-mabillard', 'Swiss roller coaster manufacturer', 'manufacturer', 'https://www.bolliger-mabillard.com', 1988, 'Monthey, Switzerland', null), +('660e8400-e29b-41d4-a716-446655440006', 'Intamin Amusement Rides', 'intamin', 'Swiss amusement ride manufacturer', 'manufacturer', 'https://www.intamin.com', 1967, 'Schaan, Liechtenstein', null), +('660e8400-e29b-41d4-a716-446655440007', 'Merlin Entertainments', 'merlin', 'British entertainment company', 'operator', 'https://www.merlinentertainments.biz', 1999, 'Poole, England', null), +('660e8400-e29b-41d4-a716-446655440008', 'Europa-Park GmbH & Co', 'europa-park', 'German theme park operator', 'operator', 'https://www.europapark.de', 1975, 'Rust, Germany', null), +('660e8400-e29b-41d4-a716-446655440009', 'Efteling', 'efteling', 'Dutch theme park operator', 'operator', 'https://www.efteling.com', 1952, 'Kaatsheuvel, Netherlands', null); + +-- Insert sample parks +INSERT INTO public.parks (id, name, slug, description, status, park_type, opening_date, website_url, phone, email, location_id, operator_id, property_owner_id, banner_image_url, card_image_url, average_rating, review_count, ride_count, coaster_count) VALUES +('770e8400-e29b-41d4-a716-446655440001', 'Magic Kingdom', 'magic-kingdom', 'The most magical place on Earth! Experience classic Disney attractions, meet beloved characters, and create unforgettable memories in this iconic theme park.', 'operating', 'theme_park', '1971-10-01', 'https://disneyworld.disney.go.com/parks/magic-kingdom/', '(407) 939-5277', null, '550e8400-e29b-41d4-a716-446655440001', '660e8400-e29b-41d4-a716-446655440001', '660e8400-e29b-41d4-a716-446655440001', null, null, 4.6, 15432, 23, 3), + +('770e8400-e29b-41d4-a716-446655440002', 'Cedar Point', 'cedar-point', 'Known as "America''s Roller Coast," Cedar Point features world-class roller coasters and thrilling rides on the shores of Lake Erie.', 'operating', 'amusement_park', '1870-01-01', 'https://www.cedarpoint.com/', '(419) 627-2350', null, '550e8400-e29b-41d4-a716-446655440003', '660e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440002', null, null, 4.8, 8976, 68, 17), + +('770e8400-e29b-41d4-a716-446655440003', 'Disneyland Park', 'disneyland', 'The original Disney theme park where it all began. Experience the magic that started Walt Disney''s dream in Anaheim, California.', 'operating', 'theme_park', '1955-07-17', 'https://disneyland.disney.go.com/parks/disneyland/', '(714) 781-4636', null, '550e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440001', '660e8400-e29b-41d4-a716-446655440001', null, null, 4.5, 12847, 35, 5), + +('770e8400-e29b-41d4-a716-446655440004', 'Busch Gardens Tampa Bay', 'busch-gardens-tampa', 'African-themed adventure park combining thrilling rides with one of North America''s largest zoos featuring over 300 species.', 'operating', 'theme_park', '1975-03-31', 'https://buschgardens.com/tampa/', '(813) 884-4386', null, '550e8400-e29b-41d4-a716-446655440004', '660e8400-e29b-41d4-a716-446655440003', '660e8400-e29b-41d4-a716-446655440003', null, null, 4.4, 6234, 42, 9), + +('770e8400-e29b-41d4-a716-446655440005', 'Six Flags Magic Mountain', 'six-flags-magic-mountain', 'The Thrill Capital of the World! Home to more roller coasters than any other theme park, with 19 world-class coasters.', 'operating', 'amusement_park', '1971-05-29', 'https://www.sixflags.com/magicmountain', '(661) 255-4100', null, '550e8400-e29b-41d4-a716-446655440005', '660e8400-e29b-41d4-a716-446655440004', '660e8400-e29b-41d4-a716-446655440004', null, null, 4.3, 9876, 45, 19), + +('770e8400-e29b-41d4-a716-446655440006', 'Kings Dominion', 'kings-dominion', 'Virginia''s premier amusement park featuring 60+ rides including 13 roller coasters and the iconic Eiffel Tower replica.', 'operating', 'amusement_park', '1975-05-03', 'https://www.kingsdominion.com/', '(804) 876-5000', null, '550e8400-e29b-41d4-a716-446655440006', '660e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440002', null, null, 4.2, 5432, 60, 13), + +('770e8400-e29b-41d4-a716-446655440007', 'Busch Gardens Williamsburg', 'busch-gardens-williamsburg', 'European-themed park known as "The Most Beautiful Theme Park in the World" with world-class roller coasters and shows.', 'operating', 'theme_park', '1975-05-25', 'https://buschgardens.com/williamsburg/', '(757) 229-4386', null, '550e8400-e29b-41d4-a716-446655440007', '660e8400-e29b-41d4-a716-446655440003', '660e8400-e29b-41d4-a716-446655440003', null, null, 4.7, 7123, 32, 8), + +('770e8400-e29b-41d4-a716-446655440008', 'Alton Towers', 'alton-towers', 'Britain''s greatest escape! Home to world-class roller coasters including The Smiler, Nemesis, and Oblivion in stunning historic grounds.', 'operating', 'theme_park', '1980-04-04', 'https://www.altontowers.com/', '+44 1538 704000', null, '550e8400-e29b-41d4-a716-446655440008', '660e8400-e29b-41d4-a716-446655440007', '660e8400-e29b-41d4-a716-446655440007', null, null, 4.4, 8765, 28, 7), + +('770e8400-e29b-41d4-a716-446655440009', 'Europa-Park', 'europa-park', 'Germany''s largest theme park with 18 themed areas representing different European countries and over 100 attractions.', 'operating', 'theme_park', '1975-07-12', 'https://www.europapark.de/en', '+49 7822 770', null, '550e8400-e29b-41d4-a716-446655440009', '660e8400-e29b-41d4-a716-446655440008', '660e8400-e29b-41d4-a716-446655440008', null, null, 4.8, 11234, 100, 13), + +('770e8400-e29b-41d4-a716-446655440010', 'Efteling', 'efteling', 'One of the world''s oldest theme parks, famous for its fairy tale forest, magical attractions, and enchanting atmosphere for all ages.', 'operating', 'theme_park', '1952-05-31', 'https://www.efteling.com/en', '+31 416 537 777', null, '550e8400-e29b-41d4-a716-446655440010', '660e8400-e29b-41d4-a716-446655440009', '660e8400-e29b-41d4-a716-446655440009', null, null, 4.6, 9876, 45, 6), + +('770e8400-e29b-41d4-a716-446655440011', 'Knott''s Berry Farm', 'knotts-berry-farm', 'America''s First Theme Park! Experience the Old West with thrilling rides, delicious food, and rich history dating back to 1920.', 'operating', 'theme_park', '1920-01-01', 'https://www.knotts.com/', '(714) 220-5200', null, '550e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440002', null, null, 4.1, 6543, 40, 8), + +('770e8400-e29b-41d4-a716-446655440012', 'Carowinds', 'carowinds', 'The Thrill Capital of the Southeast! Featuring 13 roller coasters including Fury 325, one of the world''s tallest and fastest giga coasters.', 'operating', 'amusement_park', '1973-03-31', 'https://www.carowinds.com/', '(704) 588-2600', null, '550e8400-e29b-41d4-a716-446655440006', '660e8400-e29b-41d4-a716-446655440002', '660e8400-e29b-41d4-a716-446655440002', null, null, 4.3, 7890, 50, 13); \ No newline at end of file