import Modal from './Modal';
import { viewUrl, fileUrl } from '../../utils/fileUrl';
import { ExternalLink, Download } from 'lucide-react';

interface PdfViewerModalProps {
  isOpen: boolean;
  onClose: () => void;
  title: string;
  /** Relativer Upload-Pfad des Dokuments (documentPath). */
  path: string | null | undefined;
}

/**
 * Zeigt ein hochgeladenes PDF (Bankkarte/Ausweis) inline in einem Modal.
 *
 * Die Datei wird über `viewUrl(path)` geladen → `/api/files/download` mit
 * `disposition=inline` und Token als Query-Param (iframe/GET, kein
 * Authorization-Header möglich). Der Backend-Controller macht weiterhin den
 * Per-File-Ownership-Check – hier wird kein neuer Zugriffspfad geöffnet.
 */
export default function PdfViewerModal({ isOpen, onClose, title, path }: PdfViewerModalProps) {
  if (!isOpen) return null;

  return (
    <Modal isOpen={isOpen} onClose={onClose} title={title} size="xl">
      {path ? (
        <div className="space-y-3">
          <div className="flex justify-end gap-4 text-sm">
            <a
              href={viewUrl(path)}
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-1 text-blue-600 hover:text-blue-800"
            >
              <ExternalLink className="w-4 h-4" /> In neuem Tab öffnen
            </a>
            <a
              href={fileUrl(path)}
              className="inline-flex items-center gap-1 text-blue-600 hover:text-blue-800"
            >
              <Download className="w-4 h-4" /> Herunterladen
            </a>
          </div>
          <iframe
            src={viewUrl(path)}
            title={title}
            className="w-full h-[75vh] border border-gray-200 rounded bg-gray-50"
          />
        </div>
      ) : (
        <p className="text-sm text-gray-500">Kein Dokument hinterlegt.</p>
      )}
    </Modal>
  );
}
