"use client" import * as React from "react" import Link from "next/link" import { cn } from "@/lib/utils" import { Button } from "@/components/ui/button" import { Sheet, SheetContent, SheetHeader, SheetTitle, } from "@/components/ui/sheet" export interface NavItem { title: string href: string disabled?: boolean } export interface MobileNavProps { /** Navigation links rendered as a vertical list inside the sheet. */ links: NavItem[] /** Whether the sheet is open. */ open: boolean /** Callback fired when open state changes. */ onOpenChange: (open: boolean) => void /** Whether the user is signed in — controls auth section at the bottom. */ isSignedIn?: boolean className?: string } /** * Sheet-based slide-out navigation for mobile viewports. * Auth-aware: shows Dashboard link when signed in, Sign In / Get Started when signed out. * * @example * */ export function MobileNav({ links, open, onOpenChange, isSignedIn = false, className, }: MobileNavProps) { return ( Navigation

{links.map((link) => ( { if (link.disabled) { e.preventDefault() return } onOpenChange(false) }} className={cn( "rounded-md px-3 py-3 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground", link.disabled && "pointer-events-none opacity-50" )} > {link.title} ))} {/* Auth section */}

{isSignedIn ? ( onOpenChange(false)} className="rounded-md px-3 py-3 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground" > Dashboard ) : (

)}

) }