Files
office_translator/office-translator-landing-page/components/admin-sidebar.tsx
Sepehr Ramezani 26bd096a06 feat: production deployment - full update with providers, admin, glossaries, pricing, tests
Major changes across backend, frontend, infrastructure:
- Provider system with model selection (Google, DeepL, OpenAI, Ollama, Google Cloud)
- Admin panel: user management, pricing, settings
- Glossary system with CSV import/export
- Subscription and tier quota management
- Security hardening (rate limiting, API key auth, path traversal fixes)
- Docker compose for dev, prod, and IONOS deployment
- Alembic migrations for new tables
- Frontend: dashboard, pricing page, landing page, i18n (en/fr)
- Test suite and verification scripts

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-04-25 15:01:47 +02:00

94 lines
2.8 KiB
TypeScript

"use client"
import Link from "next/link"
import { usePathname } from "next/navigation"
import {
LayoutDashboard,
Users,
Activity,
Settings,
Languages,
ChevronLeft,
Shield,
} from "lucide-react"
import { cn } from "@/lib/utils"
import { Badge } from "@/components/ui/badge"
import { Separator } from "@/components/ui/separator"
import { Button } from "@/components/ui/button"
const navItems = [
{ label: "System Overview", href: "/admin", icon: LayoutDashboard },
{ label: "User Management", href: "/admin", icon: Users },
{ label: "Provider Status", href: "/admin", icon: Activity },
{ label: "Settings", href: "/admin/settings", icon: Settings },
]
export function AdminSidebar() {
const pathname = usePathname()
return (
<aside className="hidden w-56 shrink-0 border-r border-border bg-card lg:flex lg:flex-col">
{/* Brand */}
<div className="flex h-12 items-center gap-2 px-4">
<div className="flex size-6 items-center justify-center rounded-md bg-foreground">
<Languages className="size-3 text-background" />
</div>
<span className="text-xs font-semibold tracking-tight text-foreground">
Office Translator
</span>
<Badge
variant="outline"
className="ml-auto px-1.5 py-0 text-[10px] font-medium text-muted-foreground"
>
Admin
</Badge>
</div>
<Separator />
{/* Navigation */}
<nav className="flex flex-1 flex-col gap-0.5 px-2 py-3">
{navItems.map((item) => {
const isActive = pathname === item.href
return (
<Link
key={item.label}
href={item.href}
className={cn(
"flex items-center gap-2.5 rounded-md px-2.5 py-1.5 text-xs font-medium transition-colors",
isActive
? "bg-secondary text-foreground"
: "text-muted-foreground hover:bg-secondary/60 hover:text-foreground"
)}
>
<item.icon className="size-3.5 shrink-0" />
{item.label}
</Link>
)
})}
</nav>
<Separator />
{/* Footer */}
<div className="flex flex-col gap-1 px-2 py-2">
<div className="flex items-center gap-2 px-2.5 py-1">
<Shield className="size-3 text-muted-foreground" />
<span className="text-[10px] text-muted-foreground">Superadmin access</span>
</div>
<Button
variant="ghost"
size="sm"
className="h-7 justify-start gap-2 text-xs text-muted-foreground"
asChild
>
<Link href="/dashboard">
<ChevronLeft className="size-3" />
User Dashboard
</Link>
</Button>
</div>
</aside>
)
}