Phase 1C: Frontend unified contact UI

frontend/src/components/shared/CsvImportDialog.tsx

@@ -2,7 +2,7 @@ import React, { useState, useRef, useCallback } from 'react';
 import { Modal } from '@/components/ui/Modal';
 import { Button } from '@/components/ui/Button';
 import { useToast } from '@/components/ui/Toast';
-import { useCompanyImport } from '@/api/hooks';
+import { apiClient } from '@/api/client';
 import { useTranslation } from 'react-i18next';
 
 export interface CsvImportDialogProps {
@@ -35,7 +35,7 @@ function parseCSV(text: string): { headers: string[]; rows: ParsedRow[] } {
 export function CsvImportDialog({ open, onClose, onSuccess }: CsvImportDialogProps) {
   const { t } = useTranslation();
   const toast = useToast();
-  const importMutation = useCompanyImport();
+  const [importing, setImporting] = useState(false);
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [selectedFile, setSelectedFile] = useState<File | null>(null);
   const [previewData, setPreviewData] = useState<{ headers: string[]; rows: ParsedRow[] } | null>(null);
@@ -61,8 +61,13 @@ export function CsvImportDialog({ open, onClose, onSuccess }: CsvImportDialogPro
 
   const handleImport = async () => {
     if (!selectedFile) return;
+    setImporting(true);
     try {
-      await importMutation.mutateAsync(selectedFile);
+      const formData = new FormData();
+      formData.append('file', selectedFile);
+      await apiClient.post('/contacts/import', formData, {
+        headers: { 'Content-Type': 'multipart/form-data' },
+      });
       toast.success('Import erfolgreich abgeschlossen.');
       setSelectedFile(null);
       setPreviewData(null);
@@ -71,6 +76,8 @@ export function CsvImportDialog({ open, onClose, onSuccess }: CsvImportDialogPro
       onClose();
     } catch (err: any) {
       toast.error(err.message || 'Import fehlgeschlagen.');
+    } finally {
+      setImporting(false);
     }
   };
 
@@ -134,8 +141,8 @@ export function CsvImportDialog({ open, onClose, onSuccess }: CsvImportDialogPro
           <Button variant="secondary" onClick={handleClose}>{t('common.cancel')}</Button>
           <Button
             onClick={handleImport}
-            disabled={!selectedFile || importMutation.isPending}
-            isLoading={importMutation.isPending}
+            disabled={!selectedFile || importing}
+            isLoading={importing}
             data-testid="csv-import-button"
           >
             {t('common.save')}