'use client';

import { useState } from 'react';
import { AlertTriangle } from 'lucide-react';
import { Dialog, DialogHeader, DialogBody, DialogFooter } from './dialog';

type AlertDialogProps = {
  open: boolean;
  onClose: () => void;
  onConfirm: () => void | Promise<void>;
  title: string;
  description: string;
  confirmLabel?: string;
  cancelLabel?: string;
  variant?: 'danger' | 'warning';
};

export function AlertDialog({
  open,
  onClose,
  onConfirm,
  title,
  description,
  confirmLabel = 'Удалить',
  cancelLabel = 'Отмена',
  variant = 'danger',
}: AlertDialogProps) {
  const [loading, setLoading] = useState(false);

  const handleConfirm = async () => {
    setLoading(true);
    try {
      await onConfirm();
      onClose();
    } catch {
      // Error handled by caller
    } finally {
      setLoading(false);
    }
  };

  const btnColor =
    variant === 'danger'
      ? 'bg-error text-white hover:bg-error/90'
      : 'bg-warning text-white hover:bg-warning/90';

  return (
    <Dialog open={open} onClose={onClose} className="max-w-md">
      <DialogHeader title={title} onClose={onClose} />
      <DialogBody>
        <div className="flex gap-4">
          <div className="shrink-0 bg-error/10 text-error p-2.5 rounded-full h-fit">
            <AlertTriangle className="h-5 w-5" />
          </div>
          <p className="text-sm text-muted leading-relaxed">{description}</p>
        </div>
      </DialogBody>
      <DialogFooter>
        <button
          onClick={onClose}
          disabled={loading}
          className="px-4 py-2 rounded-xl border border-border text-sm font-medium text-text hover:bg-background transition-colors"
        >
          {cancelLabel}
        </button>
        <button
          onClick={() => void handleConfirm()}
          disabled={loading}
          className={`px-4 py-2 rounded-xl text-sm font-medium transition-colors disabled:opacity-50 ${btnColor}`}
        >
          {loading ? 'Подождите...' : confirmLabel}
        </button>
      </DialogFooter>
    </Dialog>
  );
}
