import { UserCircleIcon, LogOutIcon } from "lucide-react";
import { Button } from "@/components/ui/button";

export function Header({ title }: { title: string }) {
  return (
    <header className="h-16 border-b bg-background flex items-center justify-between px-6 sticky top-0 z-10 w-full">
      <div className="flex items-center gap-4">
        <h2 className="text-xl font-medium">{title}</h2>
      </div>
      
      <div className="flex items-center gap-4">
        {/* این بخش برای اکشن باتن‌های هدر هر صفحه بصورت داینامیک استفاده خواهد شد */}
        <div id="header-actions" className="flex items-center gap-2"></div>
        
        <div className="h-6 w-px bg-border mx-2"></div>
        
        <div className="flex items-center gap-3">
          <span className="text-sm">مدیر سیستم</span>
          <Button variant="ghost" size="icon">
            <UserCircleIcon className="w-5 h-5" />
          </Button>
        </div>
      </div>
    </header>
  );
}