0d436911cd
Major AgentConfigForm rework with improved adapter configuration fields and layout. Refine sidebar, breadcrumbs, and card/tab components for visual consistency. Clean up page layouts across Activity, Agents, Approvals, Costs, Dashboard, Goals, Inbox, Issues, Org, and Projects pages. Minor heartbeat-run CLI fix. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
import { ChevronRight, type LucideIcon } from "lucide-react";
|
|
import { useState, type ReactNode } from "react";
|
|
import { cn } from "../lib/utils";
|
|
import {
|
|
Collapsible,
|
|
CollapsibleContent,
|
|
CollapsibleTrigger,
|
|
} from "@/components/ui/collapsible";
|
|
|
|
interface SidebarSectionProps {
|
|
label: string;
|
|
icon?: LucideIcon;
|
|
children: ReactNode;
|
|
defaultOpen?: boolean;
|
|
}
|
|
|
|
export function SidebarSection({
|
|
label,
|
|
children,
|
|
defaultOpen = true,
|
|
}: SidebarSectionProps) {
|
|
const [open, setOpen] = useState(defaultOpen);
|
|
|
|
return (
|
|
<Collapsible open={open} onOpenChange={setOpen}>
|
|
<CollapsibleTrigger className="flex items-center justify-between w-full px-3 py-1.5 text-[10px] font-medium uppercase tracking-widest font-mono text-muted-foreground/60 hover:text-muted-foreground transition-colors">
|
|
{label}
|
|
<ChevronRight
|
|
className={cn(
|
|
"h-3 w-3 transition-transform",
|
|
open && "rotate-90"
|
|
)}
|
|
/>
|
|
</CollapsibleTrigger>
|
|
<CollapsibleContent>
|
|
<div className="flex flex-col gap-0.5 mt-0.5">{children}</div>
|
|
</CollapsibleContent>
|
|
</Collapsible>
|
|
);
|
|
}
|