import React from 'react'

import { Button } from '@/components/ui/button'
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from '@/components/ui/dialog'

import type { CancelConfirmDialogProps } from '../types'

// Компонент диалога подтверждения отмены
export const CancelConfirmDialog = React.memo(function CancelConfirmDialog({
  isOpen,
  onClose,
  onConfirm,
  supplyId,
}: CancelConfirmDialogProps) {
  return (
    <Dialog open={isOpen} onOpenChange={onClose}>
      <DialogContent className="bg-gray-900/95 backdrop-blur border-white/20">
        <DialogHeader>
          <DialogTitle className="text-white">Отменить поставку</DialogTitle>
          <DialogDescription className="text-white/70">
            Вы точно хотите отменить поставку #{supplyId?.slice(-4).toUpperCase()}? Это действие нельзя будет отменить.
          </DialogDescription>
        </DialogHeader>
        <DialogFooter>
          <Button
            variant="outline"
            onClick={onClose}
            className="bg-white/10 border-white/20 text-white hover:bg-white/20"
          >
            Отмена
          </Button>
          <Button onClick={onConfirm} className="bg-red-600 hover:bg-red-700 text-white">
            Да, отменить поставку
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  )
})