erp-nutzfahrzeuge/frontend/components/sales/ContractPreview.tsx

'use client';

import { useState } from 'react';
import { Button } from '@/components/ui/Button';
import { getContractDownloadUrl, regenerateContract } from '@/lib/sales';

interface ContractPreviewProps {
  saleId: string;
  contractPdfPath?: string | null;
}

export function ContractPreview({ saleId, contractPdfPath }: ContractPreviewProps) {
  const [regenerating, setRegenerating] = useState(false);
  const [error, setError] = useState<string | null>(null);
  const [pdfPath, setPdfPath] = useState<string | null>(contractPdfPath || null);

  const handleRegenerate = async () => {
    setRegenerating(true);
    setError(null);
    try {
      const result = await regenerateContract(saleId);
      setPdfPath(result.contract_pdf_path);
    } catch (err: unknown) {
      const apiErr = err as { error?: { message?: string } };
      setError(apiErr?.error?.message || 'Failed to regenerate contract');
    } finally {
      setRegenerating(false);
    }
  };

  const downloadUrl = getContractDownloadUrl(saleId);

  return (
    <div className="space-y-4" data-testid="contract-preview">
      <div className="flex items-center justify-between">
        <h2 className="text-xl font-bold">Vertrags-PDF</h2>
        <div className="flex gap-2">
          <Button
            onClick={handleRegenerate}
            disabled={regenerating}
            data-testid="contract-regenerate-btn"
          >
            {regenerating ? 'Wird erstellt...' : 'Vertrag neu generieren'}
          </Button>
          {pdfPath && (
            <a href={downloadUrl} target="_blank" rel="noopener noreferrer" data-testid="contract-download-link">
              <Button>Herunterladen</Button>
            </a>
          )}
        </div>
      </div>

      {error && (
        <div className="bg-red-50 text-red-600 p-3 rounded" data-testid="contract-error">
          {error}
        </div>
      )}

      {pdfPath ? (
        <iframe
          src={downloadUrl}
          className="w-full h-[600px] border rounded"
          data-testid="contract-iframe"
          title="Vertrags-PDF"
        />
      ) : (
        <div className="bg-gray-50 p-8 text-center rounded" data-testid="contract-empty">
          <p className="text-gray-500">Es wurde noch kein Vertrag generiert.</p>
          <p className="text-sm text-gray-400 mt-2">
            Klicken Sie auf &quot;Vertrag neu generieren&quot;, um ein PDF zu erstellen.
          </p>
        </div>
      )}
    </div>
  );
}