import { Modal } from './Modal'
import { cn } from '@/lib/utils'

interface ConfirmDialogProps {
  isOpen: boolean
  onClose: () => void
  onConfirm: () => void
  title: string
  message: string
  confirmLabel?: string
  confirmVariant?: 'destructive' | 'default'
  isLoading?: boolean
}

export function ConfirmDialog({
  isOpen,
  onClose,
  onConfirm,
  title,
  message,
  confirmLabel = 'Delete',
  confirmVariant = 'destructive',
  isLoading = false,
}: ConfirmDialogProps) {
  return (
    <Modal
      isOpen={isOpen}
      onClose={onClose}
      title={title}
      size="sm"
      footer={
        <div className="flex justify-end gap-3">
          <button
            onClick={onClose}
            disabled={isLoading}
            className={cn(
              'rounded-xl border border-border px-4 py-2 text-sm font-medium',
              'text-muted-foreground hover:bg-accent hover:text-foreground',
              'disabled:opacity-50 disabled:cursor-not-allowed'
            )}
          >
            Cancel
          </button>
          <button
            onClick={onConfirm}
            disabled={isLoading}
            className={cn(
              'rounded-xl px-4 py-2 text-sm font-medium',
              'disabled:opacity-50 disabled:cursor-not-allowed',
              confirmVariant === 'destructive'
                ? 'bg-red-400/10 text-red-400 hover:bg-red-400/20 border border-red-400/20'
                : 'bg-primary text-white hover:brightness-110'
            )}
          >
            {isLoading ? 'Processing...' : confirmLabel}
          </button>
        </div>
      }
    >
      <p className="text-sm text-muted-foreground">{message}</p>
    </Modal>
  )
}

export default ConfirmDialog