import { Trash2, X } from 'lucide-react'
import { useLanguage } from '../i18n/LanguageContext'

export default function BulkSelectBar({ selectedCount, onDelete, onClear }) {
  const { t } = useLanguage()
  if (selectedCount === 0) return null

  return (
    <div className="flex items-center justify-between px-4 py-2.5 bg-red-50 border border-red-200 rounded-lg animate-fade-in">
      <span className="text-sm font-medium text-red-800">
        {selectedCount} {t('common.selected')}
      </span>
      <div className="flex items-center gap-2">
        <button
          onClick={onClear}
          className="text-xs text-text-tertiary hover:text-text-primary transition-colors"
        >
          {t('common.clearSelection')}
        </button>
        <button
          onClick={onDelete}
          className="flex items-center gap-1.5 px-3 py-1.5 bg-red-600 text-white rounded-lg text-xs font-medium hover:bg-red-700 transition-colors"
        >
          <Trash2 className="w-3.5 h-3.5" />
          {t('common.deleteSelected')}
        </button>
      </div>
    </div>
  )
}
