import Modal, { ModalActions } from '@/components/ui/Modal'
import { CheckIcon } from '@/components/ui/icons'

interface NoChangesModalProps {
  destination: string
  folderName: string
  onCancel: () => void
  onModify: () => void
}

export default function NoChangesModal({
  destination,
  folderName,
  onCancel,
  onModify,
}: NoChangesModalProps) {
  return (
    <Modal ariaLabelledBy="no-changes-title">
      <div className="flex items-center gap-3">
        <div className="w-10 h-10 rounded-full bg-gray-700/50 flex items-center justify-center shrink-0">
          <CheckIcon className="w-5 h-5 text-gray-400" />
        </div>
        <div>
          <h3 id="no-changes-title" className="text-sm font-semibold text-gray-100">
            Aucun changement detecte
          </h3>
          <p className="text-xs text-gray-400 mt-0.5">
            Le dossier <span className="font-mono text-gray-300">{destination}/{folderName}</span> est identique au contenu distant. Rien a envoyer.
          </p>
        </div>
      </div>

      <ModalActions
        cancelLabel="Annuler"
        confirmLabel="Modifier"
        onCancel={onCancel}
        onConfirm={onModify}
      />
    </Modal>
  )
}