fixed refetching after deleting file

src/components/Dateien/DateienTable.tsx

@@ -3,7 +3,6 @@ import { useLanguage } from '../../contexts/LanguageContext';
 import { Popup, EditForm } from '../Popup';
 import styles from './DateienTable.module.css';
 import { useDateienLogic } from './dateienLogic.tsx';
-import { useFileOperations, type UserFile } from '../../hooks/useFiles';
 import type { DateienTableProps } from './dateienInterfaces';
 
 export function DateienTable({ className = '' }: DateienTableProps) {
@@ -21,57 +20,10 @@ export function DateienTable({ className = '' }: DateienTableProps) {
     editFileFields,
     handleSaveFile,
     handleCancelEdit,
-    refetch
+    refetch,
+    handleDelete,
+    handleDeleteMultiple
   } = useDateienLogic();
-  
-  // Use file operations for delete functionality
-  const { handleFileDelete } = useFileOperations();
-
-  // Handle single file deletion
-  const handleDeleteSingle = async (file: UserFile) => {
-    const fileName = file.file_name || file.id;
-    if (window.confirm(t('files.delete.confirm', 'Are you sure you want to delete "{name}"?').replace('{name}', fileName))) {
-      const success = await handleFileDelete(file.id, () => {
-        // Optimistic update - this will be called immediately
-        refetch();
-      });
-      
-      if (!success) {
-        console.error('Delete failed for file:', file.id);
-        // Refetch to restore the file in case of failure
-        refetch();
-      }
-    }
-  };
-
-  // Handle multiple file deletion
-  const handleDeleteMultiple = async (filesToDelete: UserFile[]) => {
-    const fileCount = filesToDelete.length;
-    if (window.confirm(t('files.delete.confirmMultiple', 'Are you sure you want to delete {count} files?').replace('{count}', fileCount.toString()))) {
-      // Start all delete operations simultaneously
-      const deletePromises = filesToDelete.map(async (file) => {
-        try {
-          const success = await handleFileDelete(file.id);
-          return { fileId: file.id, success };
-        } catch (error) {
-          console.error('Failed to delete file:', file.id, error);
-          return { fileId: file.id, success: false };
-        }
-      });
-
-      // Wait for all deletions to complete
-      const results = await Promise.all(deletePromises);
-      
-      // Check if any deletions failed
-      const failedDeletions = results.filter(result => !result.success);
-      if (failedDeletions.length > 0) {
-        console.error('Some file deletions failed:', failedDeletions);
-      }
-      
-      // Refresh the file list regardless of individual failures
-      refetch();
-    }
-  };
 
   // Show error state
   if (error) {
@@ -100,7 +52,7 @@ export function DateienTable({ className = '' }: DateienTableProps) {
         pagination={true}
         pageSize={10}
         onRowClick={undefined}
-        onDelete={handleDeleteSingle}
+        onDelete={handleDelete}
         onDeleteMultiple={handleDeleteMultiple}
         actions={actions}
         className={styles.dateienFormGenerator}

src/components/Dateien/dateienInterfaces.ts

@@ -85,6 +85,8 @@ export interface DateienLogicReturn {
   handleEditFile: (file: UserFile) => void;
   handleSaveFile: (updatedFile: UserFile) => Promise<void>;
   handleCancelEdit: () => void;
+  handleDelete: (file: UserFile) => Promise<void>;
+  handleDeleteMultiple: (files: UserFile[]) => Promise<void>;
 }
 
 

src/components/Dateien/dateienLogic.tsx

@@ -15,7 +15,7 @@ import type {
 } from './dateienInterfaces';
 
 export function useDateienLogic(): DateienLogicReturn {
-  const { files, loading, error, refetch } = useUserFiles();
+  const { files, loading, error, refetch, removeFileOptimistically } = useUserFiles();
   const { 
     handleFileDownload, 
     handleFileDelete, 
@@ -286,10 +286,10 @@ export function useDateienLogic(): DateienLogicReturn {
   // Handle file deletion
   const handleDelete = async (file: UserFile) => {
     if (window.confirm(t('files.delete.confirm').replace('{name}', file.file_name))) {
-      const success = await handleFileDelete(file.id, () => {
+      // Immediately remove from UI for instant feedback
-        // Optimistic update - this will be called immediately
+      removeFileOptimistically(file.id);
-        refetch();
+      
-      });
+      const success = await handleFileDelete(file.id);
       
       if (!success && deleteError) {
         console.error('Delete failed:', deleteError);
@@ -299,6 +299,37 @@ export function useDateienLogic(): DateienLogicReturn {
     }
   };
 
+  // Handle multiple file deletion
+  const handleDeleteMultiple = async (filesToDelete: UserFile[]) => {
+    const fileCount = filesToDelete.length;
+    if (window.confirm(t('files.delete.confirmMultiple', 'Are you sure you want to delete {count} files?').replace('{count}', fileCount.toString()))) {
+      // Immediately remove all files from UI for instant feedback
+      filesToDelete.forEach(file => removeFileOptimistically(file.id));
+      
+      // Start all delete operations simultaneously
+      const deletePromises = filesToDelete.map(async (file) => {
+        try {
+          const success = await handleFileDelete(file.id);
+          return { fileId: file.id, success };
+        } catch (error) {
+          console.error('Failed to delete file:', file.id, error);
+          return { fileId: file.id, success: false };
+        }
+      });
+
+      // Wait for all deletions to complete
+      const results = await Promise.all(deletePromises);
+      
+      // Check if any deletions failed
+      const failedDeletions = results.filter(result => !result.success);
+      if (failedDeletions.length > 0) {
+        console.error('Some file deletions failed:', failedDeletions);
+        // Refetch to restore any files that failed to delete
+        refetch();
+      }
+    }
+  };
+
   // Configure action buttons
   const actions: TableAction[] = useMemo(() => [
     {
@@ -352,6 +383,8 @@ export function useDateienLogic(): DateienLogicReturn {
     editFileFields,
     handleEditFile,
     handleSaveFile,
-    handleCancelEdit
+    handleCancelEdit,
+    handleDelete,
+    handleDeleteMultiple
   };
 }