Files
blackroad-os-web/app/(app)/layout.tsx
2026-02-22 18:07:39 -06:00

69 lines
2.1 KiB
TypeScript

import Link from "next/link";
const NAV = [
{ href: "/agents", label: "Agents", icon: "◈" },
{ href: "/tasks", label: "Tasks", icon: "◉" },
{ href: "/memory", label: "Memory", icon: "◫" },
{ href: "/chat", label: "Chat", icon: "◎" },
];
export default function AppLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<div className="flex min-h-screen bg-black">
{/* Sidebar */}
<aside className="w-56 shrink-0 border-r border-slate-800 flex flex-col">
{/* Logo */}
<div className="p-5 border-b border-slate-800">
<div className="font-bold text-white text-lg tracking-tight">
BlackRoad
<span
className="ml-1"
style={{
background:
"linear-gradient(135deg, #F5A623 0%, #FF1D6C 38.2%, #9C27B0 61.8%, #2979FF 100%)",
WebkitBackgroundClip: "text",
WebkitTextFillColor: "transparent",
}}
>
OS
</span>
</div>
<div className="text-xs text-slate-500 mt-0.5">30K Agents Online</div>
</div>
{/* Nav */}
<nav className="flex-1 p-3 space-y-1">
{NAV.map(({ href, label, icon }) => (
<Link
key={href}
href={href}
className="flex items-center gap-3 px-3 py-2 rounded-lg text-slate-400 hover:text-white hover:bg-slate-800 transition-colors text-sm font-medium"
>
<span className="text-base">{icon}</span>
{label}
</Link>
))}
</nav>
{/* Footer */}
<div className="p-4 border-t border-slate-800">
<div className="text-xs text-slate-600">
Gateway{" "}
<span className="text-green-500"></span>
</div>
<div className="text-xs text-slate-600 mt-0.5">
v1.0.0 · blackroad.ai
</div>
</div>
</aside>
{/* Main */}
<main className="flex-1 overflow-auto">{children}</main>
</div>
);
}