PowerOn/frontend_nyla
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed refetching after deleting file

Browse source
This commit is contained in:
Ida Dittrich 2025-09-03 22:52:44 +02:00
parent 4d0928f609
commit 8d64ee7f9c
3 changed files with 45 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
src/components/Dateien/DateienTable.tsx
View file

@ -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}

2
src/components/Dateien/dateienInterfaces.ts
View file

@ -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>;
}

45
src/components/Dateien/dateienLogic.tsx
View file

@ -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, () => {
// Optimistic update - this will be called immediately
refetch();
});
// Immediately remove from UI for instant feedback
removeFileOptimistically(file.id);
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
};
}