import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Search, RefreshCw, Plus } from 'lucide-react';

interface MailToolbarProps {
  onCompose?: () => void;
  onRefresh?: () => void;
  onSearch?: (query: string) => void;
}

export const MailToolbar = ({ onCompose, onRefresh, onSearch }: MailToolbarProps) => {
  return (
    <div className="flex items-center justify-between p-4 border-b">
      <div className="flex items-center space-x-2">
        <Button variant="ghost" size="icon" onClick={onRefresh}>
          <RefreshCw className="h-4 w-4" />
        </Button>
        <Button variant="ghost" size="icon" onClick={onCompose}>
          <Plus className="h-4 w-4" />
        </Button>
      </div>
      <div className="flex-1 max-w-md mx-4">
        <div className="relative">
          <Search className="absolute left-2 top-2.5 h-4 w-4 text-gray-500" />
          <Input
            placeholder="Search emails..."
            className="pl-8"
            onChange={(e) => onSearch?.(e.target.value)}
          />
        </div>
      </div>
    </div>
  );
};