|
|
@@ -25,12 +25,6 @@ const navigationItems = [
|
|
|
description: "Browse and manage your files",
|
|
|
icon: Folder,
|
|
|
},
|
|
|
- {
|
|
|
- title: "Upload",
|
|
|
- href: "/upload",
|
|
|
- description: "Upload new files to the platform",
|
|
|
- icon: Upload,
|
|
|
- },
|
|
|
{
|
|
|
title: "API Docs",
|
|
|
href: "/api-docs",
|
|
|
@@ -62,7 +56,7 @@ export default function Header() {
|
|
|
<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 justify-between">
|
|
|
<div className="flex items-center gap-6">
|
|
|
- <Link href="/" className="flex items-center space-x-2" legacyBehavior>
|
|
|
+ <Link href="/" className="flex items-center space-x-2" >
|
|
|
<Image
|
|
|
src="/vtorio.svg"
|
|
|
alt="vtor.io"
|
|
|
@@ -70,32 +64,20 @@ export default function Header() {
|
|
|
height={32}
|
|
|
className="h-8 w-auto"
|
|
|
/>
|
|
|
- <span className="font-bold text-xl hidden sm:inline">vtor.io</span>
|
|
|
</Link>
|
|
|
-
|
|
|
+
|
|
|
<NavigationMenu className="hidden md:flex">
|
|
|
<NavigationMenuList>
|
|
|
- <NavigationMenuItem>
|
|
|
- <Link href="/" legacyBehavior passHref>
|
|
|
- <NavigationMenuLink className={cn(
|
|
|
- "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50"
|
|
|
- )}>
|
|
|
- <Home className="mr-2 h-4 w-4" />
|
|
|
- Home
|
|
|
- </NavigationMenuLink>
|
|
|
- </Link>
|
|
|
- </NavigationMenuItem>
|
|
|
-
|
|
|
{navigationItems.map((item) => (
|
|
|
<NavigationMenuItem key={item.title}>
|
|
|
- <Link href={item.href} legacyBehavior passHref>
|
|
|
- <NavigationMenuLink className={cn(
|
|
|
+ <NavigationMenuLink
|
|
|
+ href={item.href}
|
|
|
+ className={cn(
|
|
|
"group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50"
|
|
|
)}>
|
|
|
- <item.icon className="mr-2 h-4 w-4" />
|
|
|
- {item.title}
|
|
|
- </NavigationMenuLink>
|
|
|
- </Link>
|
|
|
+ <item.icon className="mr-2 h-4 w-4" />
|
|
|
+ {item.title}
|
|
|
+ </NavigationMenuLink>
|
|
|
</NavigationMenuItem>
|
|
|
))}
|
|
|
</NavigationMenuList>
|
|
|
@@ -127,8 +109,7 @@ export default function Header() {
|
|
|
<NavigationMenuLink asChild>
|
|
|
<Link
|
|
|
href={item.href}
|
|
|
- className="block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground"
|
|
|
- legacyBehavior>
|
|
|
+ className="block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground">
|
|
|
<div className="flex items-center gap-2">
|
|
|
<item.icon className="h-4 w-4" />
|
|
|
<div className="text-sm font-medium leading-none">{item.title}</div>
|
|
|
@@ -156,15 +137,6 @@ export default function Header() {
|
|
|
</NavigationMenuItem>
|
|
|
</NavigationMenuList>
|
|
|
</NavigationMenu>
|
|
|
-
|
|
|
- <div className="hidden md:flex items-center gap-2">
|
|
|
- <LogoutLink>
|
|
|
- <Button variant="ghost" size="sm">
|
|
|
- <LogOut className="h-4 w-4 mr-2" />
|
|
|
- Logout
|
|
|
- </Button>
|
|
|
- </LogoutLink>
|
|
|
- </div>
|
|
|
</>
|
|
|
) : (
|
|
|
<div className="hidden md:flex items-center gap-2">
|
|
|
@@ -179,7 +151,7 @@ export default function Header() {
|
|
|
</RegisterLink>
|
|
|
</div>
|
|
|
)}
|
|
|
-
|
|
|
+
|
|
|
{/* Mobile Menu */}
|
|
|
<Sheet>
|
|
|
<SheetTrigger asChild className="md:hidden">
|
|
|
@@ -190,22 +162,21 @@ export default function Header() {
|
|
|
</SheetTrigger>
|
|
|
<SheetContent side="right" className="w-[300px]">
|
|
|
<div className="flex flex-col space-y-4 mt-8">
|
|
|
- <Link href="/" className="flex items-center space-x-2" legacyBehavior>
|
|
|
+ <Link href="/" className="flex items-center space-x-2" >
|
|
|
<Home className="h-4 w-4" />
|
|
|
<span>Home</span>
|
|
|
</Link>
|
|
|
-
|
|
|
+
|
|
|
{navigationItems.map((item) => (
|
|
|
<Link
|
|
|
key={item.title}
|
|
|
href={item.href}
|
|
|
- className="flex items-center space-x-2"
|
|
|
- legacyBehavior>
|
|
|
+ className="flex items-center space-x-2" >
|
|
|
<item.icon className="h-4 w-4" />
|
|
|
<span>{item.title}</span>
|
|
|
</Link>
|
|
|
))}
|
|
|
-
|
|
|
+
|
|
|
{isAuthenticated ? (
|
|
|
<>
|
|
|
<div className="border-t pt-4">
|
|
|
@@ -219,18 +190,17 @@ export default function Header() {
|
|
|
/>
|
|
|
<span className="font-medium">{user?.given_name || user?.email}</span>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
{userMenuItems.map((item) => (
|
|
|
<Link
|
|
|
key={item.title}
|
|
|
href={item.href}
|
|
|
- className="flex items-center space-x-2 py-2"
|
|
|
- legacyBehavior>
|
|
|
+ className="flex items-center space-x-2 py-2" >
|
|
|
<item.icon className="h-4 w-4" />
|
|
|
<span>{item.title}</span>
|
|
|
</Link>
|
|
|
))}
|
|
|
-
|
|
|
+
|
|
|
<LogoutLink className="flex items-center space-x-2 py-2 text-red-600">
|
|
|
<LogOut className="h-4 w-4" />
|
|
|
<span>Logout</span>
|