- Add live GitHub stats and commits to dashboard with sticky two-column layout and GitHub card link - Auto-expand sidebar when navigating to files/projects while collapsed - Add GitHub link to landing page - Restyle storage indicator with sidebar tokens - Fix nav-user readability with sidebar-foreground tokens - Update favicon to colored compass logo
92 lines
2.7 KiB
TypeScript
Executable File
92 lines
2.7 KiB
TypeScript
Executable File
"use client"
|
|
|
|
import {
|
|
IconArrowLeft,
|
|
IconFiles,
|
|
IconUsers,
|
|
IconClock,
|
|
IconStar,
|
|
IconTrash,
|
|
} from "@tabler/icons-react"
|
|
import Link from "next/link"
|
|
import { usePathname, useSearchParams } from "next/navigation"
|
|
|
|
import { mockStorageUsage } from "@/lib/files-data"
|
|
import { StorageIndicator } from "@/components/files/storage-indicator"
|
|
import {
|
|
SidebarGroup,
|
|
SidebarGroupContent,
|
|
SidebarMenu,
|
|
SidebarMenuButton,
|
|
SidebarMenuItem,
|
|
} from "@/components/ui/sidebar"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
type FileView = "my-files" | "shared" | "recent" | "starred" | "trash"
|
|
|
|
const fileNavItems: { title: string; view: FileView; icon: typeof IconFiles }[] = [
|
|
{ title: "My Files", view: "my-files", icon: IconFiles },
|
|
{ title: "Shared with me", view: "shared", icon: IconUsers },
|
|
{ title: "Recent", view: "recent", icon: IconClock },
|
|
{ title: "Starred", view: "starred", icon: IconStar },
|
|
{ title: "Trash", view: "trash", icon: IconTrash },
|
|
]
|
|
|
|
export function NavFiles() {
|
|
const pathname = usePathname()
|
|
const searchParams = useSearchParams()
|
|
const activeView = searchParams.get("view") ?? "my-files"
|
|
|
|
return (
|
|
<>
|
|
<SidebarGroup>
|
|
<SidebarGroupContent>
|
|
<SidebarMenu>
|
|
<SidebarMenuItem>
|
|
<SidebarMenuButton asChild tooltip="Back to Dashboard">
|
|
<Link href="/dashboard">
|
|
<IconArrowLeft />
|
|
<span>Back</span>
|
|
</Link>
|
|
</SidebarMenuButton>
|
|
</SidebarMenuItem>
|
|
</SidebarMenu>
|
|
</SidebarGroupContent>
|
|
</SidebarGroup>
|
|
<SidebarGroup>
|
|
<SidebarGroupContent>
|
|
<SidebarMenu>
|
|
{fileNavItems.map((item) => (
|
|
<SidebarMenuItem key={item.view}>
|
|
<SidebarMenuButton
|
|
asChild
|
|
tooltip={item.title}
|
|
className={cn(
|
|
activeView === item.view &&
|
|
pathname?.startsWith("/dashboard/files") &&
|
|
"bg-sidebar-foreground/10 font-medium"
|
|
)}
|
|
>
|
|
<Link
|
|
href={
|
|
item.view === "my-files"
|
|
? "/dashboard/files"
|
|
: `/dashboard/files?view=${item.view}`
|
|
}
|
|
>
|
|
<item.icon />
|
|
<span>{item.title}</span>
|
|
</Link>
|
|
</SidebarMenuButton>
|
|
</SidebarMenuItem>
|
|
))}
|
|
</SidebarMenu>
|
|
</SidebarGroupContent>
|
|
</SidebarGroup>
|
|
<div className="mt-auto px-3 pb-3">
|
|
<StorageIndicator usage={mockStorageUsage} />
|
|
</div>
|
|
</>
|
|
)
|
|
}
|