Site için geliştirmeler yapıldı.

components/dashboard/header.tsx

@@ -0,0 +1,34 @@
+"use client"
+
+import { Menu } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet"
+import { Sidebar } from "@/components/dashboard/sidebar"
+import { UserNav } from "@/components/dashboard/user-nav"
+
+export function DashboardHeader() {
+    return (
+        <header className="sticky top-0 z-30 flex h-14 items-center gap-4 border-b bg-background px-4 sm:static sm:h-auto sm:border-0 sm:bg-transparent sm:px-6">
+            <Sheet>
+                <SheetTrigger asChild>
+                    <Button size="icon" variant="outline" className="sm:hidden">
+                        <Menu className="h-5 w-5" />
+                        <span className="sr-only">Menüyü Aç</span>
+                    </Button>
+                </SheetTrigger>
+                <SheetContent side="left" className="w-[240px] sm:max-w-xs">
+                    <nav className="grid gap-6 text-lg font-medium">
+                        <div className="flex items-center gap-2 text-lg font-semibold md:text-base">
+                            ParaKasa Panel
+                        </div>
+                        <Sidebar />
+                    </nav>
+                </SheetContent>
+            </Sheet>
+            <div className="w-full flex-1">
+                {/* Breadcrumb or Search could go here */}
+            </div>
+            <UserNav />
+        </header>
+    )
+}

components/dashboard/sidebar.tsx

@@ -0,0 +1,67 @@
+"use client"
+
+import Link from "next/link"
+import { usePathname } from "next/navigation"
+import { cn } from "@/lib/utils"
+import { LayoutDashboard, Package, ShoppingCart, Users, Settings } from "lucide-react"
+
+const sidebarItems = [
+    {
+        title: "Panel",
+        href: "/dashboard",
+        icon: LayoutDashboard,
+    },
+    {
+        title: "Ürünler",
+        href: "/dashboard/products",
+        icon: Package,
+    },
+    {
+        title: "Siparişler",
+        href: "/dashboard/orders",
+        icon: ShoppingCart,
+    },
+    {
+        title: "Kullanıcılar",
+        href: "/dashboard/users",
+        icon: Users,
+    },
+    {
+        title: "Ayarlar",
+        href: "/dashboard/settings",
+        icon: Settings,
+    },
+]
+
+interface SidebarProps extends React.HTMLAttributes<HTMLDivElement> { }
+
+export function Sidebar({ className }: SidebarProps) {
+    const pathname = usePathname()
+
+    return (
+        <div className={cn("pb-12", className)}>
+            <div className="space-y-4 py-4">
+                <div className="px-3 py-2">
+                    <h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">
+                        Yönetim
+                    </h2>
+                    <div className="space-y-1">
+                        {sidebarItems.map((item) => (
+                            <Link
+                                key={item.href}
+                                href={item.href}
+                                className={cn(
+                                    "flex items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors",
+                                    pathname === item.href ? "bg-slate-100 dark:bg-slate-800 text-primary" : "text-slate-500 dark:text-slate-400"
+                                )}
+                            >
+                                <item.icon className="mr-2 h-4 w-4" />
+                                {item.title}
+                            </Link>
+                        ))}
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}

components/dashboard/user-nav.tsx

@@ -0,0 +1,66 @@
+"use client"
+
+import {
+    Avatar,
+    AvatarFallback,
+    AvatarImage,
+} from "@/components/ui/avatar"
+import { Button } from "@/components/ui/button"
+import {
+    DropdownMenu,
+    DropdownMenuContent,
+    DropdownMenuGroup,
+    DropdownMenuItem,
+    DropdownMenuLabel,
+    DropdownMenuSeparator,
+    DropdownMenuShortcut,
+    DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu"
+import { supabase } from "@/lib/supabase"
+import { useRouter } from "next/navigation"
+
+export function UserNav() {
+    const router = useRouter()
+
+    const handleSignOut = async () => {
+        await supabase.auth.signOut()
+        router.push("/login")
+        router.refresh()
+    }
+
+    return (
+        <DropdownMenu>
+            <DropdownMenuTrigger asChild>
+                <Button variant="ghost" className="relative h-8 w-8 rounded-full">
+                    <Avatar className="h-8 w-8">
+                        <AvatarImage src="/avatars/01.png" alt="@parakasa" />
+                        <AvatarFallback>PK</AvatarFallback>
+                    </Avatar>
+                </Button>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent className="w-56" align="end" forceMount>
+                <DropdownMenuLabel className="font-normal">
+                    <div className="flex flex-col space-y-1">
+                        <p className="text-sm font-medium leading-none">Admin</p>
+                        <p className="text-xs leading-none text-muted-foreground">
+                            admin@parakasa.com
+                        </p>
+                    </div>
+                </DropdownMenuLabel>
+                <DropdownMenuSeparator />
+                <DropdownMenuGroup>
+                    <DropdownMenuItem>
+                        Profil
+                    </DropdownMenuItem>
+                    <DropdownMenuItem>
+                        Ayarlar
+                    </DropdownMenuItem>
+                </DropdownMenuGroup>
+                <DropdownMenuSeparator />
+                <DropdownMenuItem onClick={handleSignOut}>
+                    Çıkış Yap
+                </DropdownMenuItem>
+            </DropdownMenuContent>
+        </DropdownMenu>
+    )
+}

components/layout/navbar.tsx

@@ -1,10 +1,14 @@
 import Link from "next/link"
-import { Search, Menu, Phone } from "lucide-react"
+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()
 
-export function Navbar() {
     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">
@@ -79,6 +83,21 @@ export function Navbar() {
                         <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>

components/ui/input.tsx

@@ -2,20 +2,23 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Input({ className, type, ...props }: React.ComponentProps<"input">) {
-  return (
-    <input
-      type={type}
-      data-slot="input"
-      className={cn(
-        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-        "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-        className
-      )}
-      {...props}
-    />
-  )
-}
+const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
+  ({ className, type, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={cn(
+          "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
+          "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    )
+  }
+)
+Input.displayName = "Input"
 
 export { Input }

components/ui/textarea.tsx

@@ -2,17 +2,20 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
-  return (
-    <textarea
-      data-slot="textarea"
-      className={cn(
-        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-        className
-      )}
-      {...props}
-    />
-  )
-}
+const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<"textarea">>(
+  ({ className, ...props }, ref) => {
+    return (
+      <textarea
+        className={cn(
+          "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    )
+  }
+)
+Textarea.displayName = "Textarea"
 
 export { Textarea }