File size: 2,702 Bytes
d8e039b 1c47f1e 6c45e39 d8e039b 6c45e39 d8e039b 6c45e39 d8e039b 6c45e39 1c47f1e 47f57e6 6c45e39 1c47f1e 47f57e6 6c45e39 d8e039b 6a50e97 d8e039b 6a50e97 d8e039b 6a50e97 d8e039b 6a50e97 47f57e6 d8e039b 9592d69 d8e039b 9592d69 d8e039b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 |
import { Link, useLocation } from 'react-router-dom'
import { cn } from '@/lib/utils'
import {
Home,
BookOpen,
MessageSquare,
Settings,
Brain,
Bot,
Users
} from 'lucide-react'
const navigation = [
{
name: 'Home',
href: '/',
icon: Home,
description: 'Overview and getting started'
},
{
name: 'Chat Playground',
href: '/playground',
icon: MessageSquare,
description: 'AI chatbot with conversation history'
},
{
name: 'Model Catalog',
href: '/models',
icon: BookOpen,
description: 'Browse and manage AI models'
},
{
name: 'My Assistants',
href: '/assistants',
icon: Bot,
description: 'Manage your custom AI assistants'
},
{
name: 'Community',
href: '/community',
icon: Users,
description: 'Discover and share assistant templates'
},
{
name: 'Settings',
href: '/settings',
icon: Settings,
description: 'Application settings'
}
]
export function Sidebar() {
const location = useLocation()
return (
<div className="flex h-full flex-col bg-background border-r">
{/* Header */}
<div className="p-6 border-b">
<div className="flex items-center gap-2">
<div className="w-8 h-8 bg-primary rounded-lg flex items-center justify-center">
<Brain className="h-5 w-5 text-primary-foreground" />
</div>
<div>
<h1 className="font-semibold text-lg">Edge LLM</h1>
<p className="text-xs text-muted-foreground">Local AI Platform</p>
</div>
</div>
</div>
{/* Navigation */}
<div className="flex-1 px-3 py-4 space-y-8">
<div>
<h2 className="mb-2 px-3 text-xs font-semibold text-muted-foreground uppercase tracking-wide">
Get started
</h2>
<nav className="space-y-1">
{navigation.map((item) => {
const isActive = location.pathname === item.href
return (
<Link
key={item.name}
to={item.href}
className={cn(
'flex items-center gap-3 rounded-lg px-3 py-2 text-sm transition-all hover:bg-accent',
isActive
? 'bg-accent text-accent-foreground font-medium'
: 'text-muted-foreground hover:text-foreground'
)}
>
<item.icon className="h-4 w-4" />
<div className="flex-1">
{item.name}
</div>
</Link>
)
})}
</nav>
</div>
</div>
</div>
)
}
|