unchained/mission-control
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update templates and improve UI styling across components

Browse Source
This commit is contained in:
Abhimanyu Saharan
2026-02-04 13:03:18 +05:30
parent b24e3e1dcd
commit f6105fa0d2
32 changed files with 399 additions and 321 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
frontend/src/components/organisms/DashboardSidebar.tsx
View File

@@ -2,6 +2,7 @@
import Link from "next/link";
import { usePathname } from "next/navigation";
import { Bot, LayoutGrid } from "lucide-react";
import { cn } from "@/lib/utils";
@@ -9,34 +10,44 @@ export function DashboardSidebar() {
const pathname = usePathname();
return (
<aside className="flex h-full flex-col gap-6 rounded-xl border-2 border-gray-200 bg-white p-6 shadow-lush">
<div className="space-y-2">
<p className="text-xs font-semibold uppercase tracking-[0.3em] text-gray-500">
Work
<aside className="flex h-full flex-col gap-6 rounded-2xl surface-panel p-5">
<div className="space-y-3">
<p className="text-xs font-semibold uppercase tracking-[0.32em] text-quiet">
Navigation
</p>
<nav className="space-y-1 text-sm">
<Link
href="/agents"
className={cn(
"block rounded-lg border border-transparent px-3 py-2 font-medium text-gray-700 hover:border-gray-200 hover:bg-gray-50",
pathname.startsWith("/agents") &&
"border-gray-200 bg-gray-50 text-gray-900"
)}
>
Agents
</Link>
<nav className="space-y-2 text-sm">
<Link
href="/boards"
className={cn(
"block rounded-lg border border-transparent px-3 py-2 font-medium text-gray-700 hover:border-gray-200 hover:bg-gray-50",
"flex items-center gap-3 rounded-xl border border-transparent px-3 py-2 font-semibold text-muted transition hover:border-[color:var(--border)] hover:bg-[color:var(--surface-muted)]",
pathname.startsWith("/boards") &&
"border-gray-200 bg-gray-50 text-gray-900"
"border-[color:var(--accent-soft)] bg-[color:var(--accent-soft)] text-[color:var(--accent-strong)]"
)}
>
<LayoutGrid className="h-4 w-4" />
Boards
</Link>
<Link
href="/agents"
className={cn(
"flex items-center gap-3 rounded-xl border border-transparent px-3 py-2 font-semibold text-muted transition hover:border-[color:var(--border)] hover:bg-[color:var(--surface-muted)]",
pathname.startsWith("/agents") &&
"border-[color:var(--accent-soft)] bg-[color:var(--accent-soft)] text-[color:var(--accent-strong)]"
)}
>
<Bot className="h-4 w-4" />
Agents
</Link>
</nav>
</div>
<div className="rounded-2xl border border-[color:var(--border)] bg-[color:var(--surface-muted)] p-4 text-xs text-quiet">
<p className="font-semibold uppercase tracking-[0.2em] text-strong">
Ops health
</p>
<p className="mt-2">
Live boards and agents appear here once data streams in.
</p>
</div>
</aside>
);
}