mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-20 09:11:12 -05:00
Organize navigation links
This commit is contained in:
@@ -1,9 +1,10 @@
|
|||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
import { Search, Menu, Zap, MapPin, Star } from 'lucide-react';
|
import { Search, Menu, Zap, MapPin, Star, ChevronDown, Building, Users, Crown, Palette } from 'lucide-react';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { Input } from '@/components/ui/input';
|
import { Input } from '@/components/ui/input';
|
||||||
import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet';
|
import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet';
|
||||||
import { Badge } from '@/components/ui/badge';
|
import { Badge } from '@/components/ui/badge';
|
||||||
|
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
|
||||||
import { Link, useNavigate } from 'react-router-dom';
|
import { Link, useNavigate } from 'react-router-dom';
|
||||||
import { SearchDropdown } from '@/components/search/SearchDropdown';
|
import { SearchDropdown } from '@/components/search/SearchDropdown';
|
||||||
import { AuthButtons } from '@/components/auth/AuthButtons';
|
import { AuthButtons } from '@/components/auth/AuthButtons';
|
||||||
@@ -29,20 +30,43 @@ export function Header() {
|
|||||||
|
|
||||||
{/* Desktop Navigation */}
|
{/* Desktop Navigation */}
|
||||||
<nav className="hidden md:flex items-center gap-6 ml-8">
|
<nav className="hidden md:flex items-center gap-6 ml-8">
|
||||||
<Button variant="ghost" className="text-sm font-medium hover:text-primary" onClick={() => navigate('/parks')}>
|
<DropdownMenu>
|
||||||
<MapPin className="w-4 h-4 mr-2" />
|
<DropdownMenuTrigger asChild>
|
||||||
Parks
|
<Button variant="ghost" className="text-sm font-medium hover:text-primary">
|
||||||
</Button>
|
<Search className="w-4 h-4 mr-2" />
|
||||||
<Button variant="ghost" className="text-sm font-medium hover:text-primary" onClick={() => navigate('/rides')}>
|
Explore
|
||||||
🎢 Rides
|
<ChevronDown className="w-4 h-4 ml-1" />
|
||||||
</Button>
|
</Button>
|
||||||
|
</DropdownMenuTrigger>
|
||||||
|
<DropdownMenuContent align="start" className="w-48 bg-background border border-border shadow-lg">
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/parks')}>
|
||||||
|
<MapPin className="w-4 h-4 mr-2" />
|
||||||
|
Parks
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/rides')}>
|
||||||
|
🎢 <span className="ml-2">Rides</span>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/manufacturers')}>
|
||||||
|
🏭 <span className="ml-2">Manufacturers</span>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/operators')}>
|
||||||
|
<Building className="w-4 h-4 mr-2" />
|
||||||
|
Operators
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/owners')}>
|
||||||
|
<Crown className="w-4 h-4 mr-2" />
|
||||||
|
Owners
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuItem onClick={() => navigate('/designers')}>
|
||||||
|
<Palette className="w-4 h-4 mr-2" />
|
||||||
|
Designers
|
||||||
|
</DropdownMenuItem>
|
||||||
|
</DropdownMenuContent>
|
||||||
|
</DropdownMenu>
|
||||||
<Button variant="ghost" className="text-sm font-medium hover:text-primary">
|
<Button variant="ghost" className="text-sm font-medium hover:text-primary">
|
||||||
<Star className="w-4 h-4 mr-2" />
|
<Star className="w-4 h-4 mr-2" />
|
||||||
Reviews
|
Reviews
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" className="text-sm font-medium hover:text-primary" onClick={() => navigate('/manufacturers')}>
|
|
||||||
🏭 Manufacturers
|
|
||||||
</Button>
|
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -65,6 +89,7 @@ export function Header() {
|
|||||||
</SheetTrigger>
|
</SheetTrigger>
|
||||||
<SheetContent side="right" className="w-[300px] sm:w-[400px]">
|
<SheetContent side="right" className="w-[300px] sm:w-[400px]">
|
||||||
<div className="flex flex-col gap-4 mt-8">
|
<div className="flex flex-col gap-4 mt-8">
|
||||||
|
<div className="text-sm font-semibold text-muted-foreground mb-2">Explore</div>
|
||||||
<Button variant="ghost" className="justify-start" onClick={() => navigate('/parks')}>
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/parks')}>
|
||||||
<MapPin className="w-4 h-4 mr-2" />
|
<MapPin className="w-4 h-4 mr-2" />
|
||||||
Parks
|
Parks
|
||||||
@@ -72,13 +97,27 @@ export function Header() {
|
|||||||
<Button variant="ghost" className="justify-start" onClick={() => navigate('/rides')}>
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/rides')}>
|
||||||
🎢 Rides
|
🎢 Rides
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" className="justify-start">
|
|
||||||
<Star className="w-4 h-4 mr-2" />
|
|
||||||
Reviews
|
|
||||||
</Button>
|
|
||||||
<Button variant="ghost" className="justify-start" onClick={() => navigate('/manufacturers')}>
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/manufacturers')}>
|
||||||
🏭 Manufacturers
|
🏭 Manufacturers
|
||||||
</Button>
|
</Button>
|
||||||
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/operators')}>
|
||||||
|
<Building className="w-4 h-4 mr-2" />
|
||||||
|
Operators
|
||||||
|
</Button>
|
||||||
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/owners')}>
|
||||||
|
<Crown className="w-4 h-4 mr-2" />
|
||||||
|
Owners
|
||||||
|
</Button>
|
||||||
|
<Button variant="ghost" className="justify-start" onClick={() => navigate('/designers')}>
|
||||||
|
<Palette className="w-4 h-4 mr-2" />
|
||||||
|
Designers
|
||||||
|
</Button>
|
||||||
|
<div className="border-t pt-4 mt-4">
|
||||||
|
<Button variant="ghost" className="justify-start">
|
||||||
|
<Star className="w-4 h-4 mr-2" />
|
||||||
|
Reviews
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
<div className="border-t pt-4 mt-4">
|
<div className="border-t pt-4 mt-4">
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<ThemeToggle />
|
<ThemeToggle />
|
||||||
|
|||||||
Reference in New Issue
Block a user