import React from 'react';
import { X } from 'lucide-react';
import { Button } from '@/components/ui/button';

interface ComposeEmailHeaderProps {
  type: 'new' | 'reply' | 'reply-all' | 'forward';
  onClose: () => void;
}

export default function ComposeEmailHeader({
  type,
  onClose
}: ComposeEmailHeaderProps) {
  // Set the header title based on the compose type
  const getTitle = () => {
    switch (type) {
      case 'reply':
        return 'Reply';
      case 'reply-all':
        return 'Reply All';
      case 'forward':
        return 'Forward';
      default:
        return 'New Message';
    }
  };

  return (
    <div className="flex items-center justify-between p-4 border-b border-gray-200">
      <h2 className="text-lg font-semibold text-gray-900">{getTitle()}</h2>
      <Button
        variant="ghost"
        size="icon"
        onClick={onClose}
        className="h-8 w-8"
      >
        <X className="h-4 w-4" />
      </Button>
    </div>
  );
}