Files
parakasa/components/layout/navbar.tsx

107 lines
5.2 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import Link from "next/link"
import { Search, Menu, Phone, LogIn, User } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet"
import { Input } from "@/components/ui/input"
import { createClient } from "@/lib/supabase-server"
export async function Navbar() {
const supabase = createClient()
const { data: { user } } = await supabase.auth.getUser()
return (
<header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
<div className="container flex h-16 items-center">
<div className="mr-8 hidden md:flex">
<Link href="/" className="mr-6 flex items-center space-x-2">
<span className="text-xl font-bold tracking-tighter bg-clip-text text-transparent bg-gradient-to-r from-slate-900 to-slate-500 dark:from-slate-100 dark:to-slate-400">
PARAKASA
</span>
</Link>
<nav className="flex items-center space-x-6 text-sm font-medium">
<Link
href="/products"
className="transition-colors hover:text-foreground/80 text-foreground/60"
>
Ürünler
</Link>
<Link
href="/corporate"
className="transition-colors hover:text-foreground/80 text-foreground/60"
>
Kurumsal
</Link>
<Link
href="/contact"
className="transition-colors hover:text-foreground/80 text-foreground/60"
>
İletişim
</Link>
</nav>
</div>
{/* Mobile Menu */}
<Sheet>
<SheetTrigger asChild>
<Button
variant="ghost"
className="mr-2 px-0 text-base hover:bg-transparent focus-visible:bg-transparent focus-visible:ring-0 focus-visible:ring-offset-0 md:hidden"
>
<Menu className="h-5 w-5" />
<span className="sr-only">Toggle Menu</span>
</Button>
</SheetTrigger>
<SheetContent side="left" className="pr-0">
<Link href="/" className="flex items-center">
<span className="font-bold">PARAKASA</span>
</Link>
<div className="flex flex-col gap-4 mt-8">
<Link href="/products">Ürünler</Link>
<Link href="/corporate">Kurumsal</Link>
<Link href="/contact">İletişim</Link>
</div>
</SheetContent>
</Sheet>
<div className="flex flex-1 items-center justify-between space-x-2 md:justify-end">
<div className="w-full flex-1 md:w-auto md:flex-none">
<div className="relative">
<Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
<Input
placeholder="Ürün ara..."
className="pl-8 h-9 md:w-[300px] lg:w-[300px]"
/>
</div>
</div>
<nav className="flex items-center space-x-2">
<Button size="sm" variant="ghost" className="h-9 w-9 px-0" asChild>
<Link href="/contact">
<Phone className="h-4 w-4" />
<span className="sr-only">İletişim</span>
</Link>
</Button>
<Button size="sm" className="hidden md:flex">
Teklif Al
</Button>
{user ? (
<Button size="sm" variant="ghost" className="h-9 w-9 px-0" asChild>
<Link href="/dashboard">
<User className="h-4 w-4" />
<span className="sr-only">Hesabım</span>
</Link>
</Button>
) : (
<Button size="sm" variant="ghost" className="h-9 w-9 px-0" asChild>
<Link href="/login">
<LogIn className="h-4 w-4" />
<span className="sr-only">Giriş Yap</span>
</Link>
</Button>
)}
</nav>
</div>
</div>
</header>
)
}