import { Breadcrumbs } from '@/components/breadcrumbs';
import { SidebarTrigger } from '@/components/ui/sidebar';
import type { BreadcrumbItem as BreadcrumbItemType } from '@/types';

export function AppSidebarHeader({
    breadcrumbs = [],
}: {
    breadcrumbs?: BreadcrumbItemType[];
}) {
    return (
        <header className="flex h-14 shrink-0 items-center gap-3 border-b border-border bg-card px-4 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12">
            <SidebarTrigger
                id="admin-sidebar-toggle"
                aria-label="Buka atau tutup navigasi"
                className="-ml-1 rounded-md p-1.5 text-muted-foreground hover:bg-accent hover:text-foreground"
            />
            <div className="h-5 w-px bg-border" />
            <Breadcrumbs breadcrumbs={breadcrumbs} />
        </header>
    );
}