/**
 * AppHeader - Global application header for Agentbyte PlayGround
 * Features: Entity selection, global settings, theme toggle
*/

import { Button } from "@/components/ui/button";
import { EntitySelector } from "@/components/shared/entity-selector";
import { ModeToggle } from "@/components/mode-toggle";
import { BrainCircuit, Settings } from "lucide-react";
import type { Entity } from "@/types";

interface AppHeaderProps {
  entities: Entity[];
  selectedEntity?: Entity;
  onSelect: (entity: Entity) => void;
  isLoading?: boolean;
  onDeleteEntity?: (entity: Entity) => void;
}

export function AppHeader({
  entities,
  selectedEntity,
  onSelect,
  isLoading = false,
  onDeleteEntity,
}: AppHeaderProps) {
  return (
    <header className="flex h-14 items-center gap-4 border-b px-4">
      <div className="flex items-center gap-2 font-semibold tracking-tight">
        <div className="flex h-8 w-8 items-center justify-center rounded-md bg-primary/10 text-primary">
          <BrainCircuit className="h-4 w-4" />
        </div>
        <div className="leading-none">
          <span>Agentbyte PlayGround</span>
        </div>
      </div>
      <EntitySelector
        entities={entities}
        selectedEntity={selectedEntity}
        onSelect={onSelect}
        isLoading={isLoading}
        onDeleteEntity={onDeleteEntity}
      />

      <div className="flex items-center gap-2 ml-auto">
        <ModeToggle />
        <Button variant="ghost" size="sm">
          <Settings className="h-4 w-4" />
        </Button>
      </div>
    </header>
  );
}
