diff --git a/frontend/src/System/Backup/BackupRow.tsx b/frontend/src/System/Backup/BackupRow.tsx index 97cd5c446..739d07ec9 100644 --- a/frontend/src/System/Backup/BackupRow.tsx +++ b/frontend/src/System/Backup/BackupRow.tsx @@ -24,7 +24,7 @@ interface BackupRowProps { } function BackupRow({ id, type, name, path, size, time }: BackupRowProps) { - const deleteBackupMutation = useDeleteBackup(id); + const { deleteBackup } = useDeleteBackup(id); const [isRestoreModalOpen, setIsRestoreModalOpen] = useState(false); const [isConfirmDeleteModalOpen, setIsConfirmDeleteModalOpen] = useState(false); @@ -67,7 +67,7 @@ function BackupRow({ id, type, name, path, size, time }: BackupRowProps) { }, []); const handleConfirmDeletePress = useCallback(() => { - deleteBackupMutation.mutate(undefined, { + deleteBackup(undefined, { onSuccess: () => { setIsConfirmDeleteModalOpen(false); }, @@ -75,7 +75,7 @@ function BackupRow({ id, type, name, path, size, time }: BackupRowProps) { console.error('Failed to delete backup:', error); }, }); - }, [deleteBackupMutation]); + }, [deleteBackup]); return ( diff --git a/frontend/src/System/Backup/RestoreBackupModalContent.tsx b/frontend/src/System/Backup/RestoreBackupModalContent.tsx index 16dc47347..94abd3835 100644 --- a/frontend/src/System/Backup/RestoreBackupModalContent.tsx +++ b/frontend/src/System/Backup/RestoreBackupModalContent.tsx @@ -82,16 +82,10 @@ function RestoreBackupModalContent({ const { isRestarting } = useSelector((state: AppState) => state.app); const dispatch = useDispatch(); - const { - mutate: restoreBackupById, - isPending: isRestoreBackupPending, - error: restoreBackupError, - } = useRestoreBackup(id || 0); - const { - mutate: uploadBackupFile, - isPending: isUploadBackupPending, - error: uploadBackupError, - } = useRestoreBackupUpload(); + const { restoreBackupById, isRestoringBackup, restoreBackupError } = + useRestoreBackup(id || 0); + const { uploadBackup, isUploadingBackup, uploadBackupError } = + useRestoreBackupUpload(); const { mutate: restart } = useRestart(); const [path, setPath] = useState(''); @@ -100,7 +94,7 @@ function RestoreBackupModalContent({ const [isRestarted, setIsRestarted] = useState(false); const [isReloading, setIsReloading] = useState(false); - const isRestoring = isRestoreBackupPending || isUploadBackupPending; + const isRestoring = isRestoringBackup || isUploadingBackup; const restoreError = restoreBackupError || uploadBackupError; const wasRestoring = usePrevious(isRestoring); const wasRestarting = usePrevious(isRestarting); @@ -123,9 +117,9 @@ function RestoreBackupModalContent({ } else if (file) { const formData = new FormData(); formData.append('restore', file); - uploadBackupFile(formData); + uploadBackup(formData); } - }, [id, file, restoreBackupById, uploadBackupFile]); + }, [id, file, restoreBackupById, uploadBackup]); useEffect(() => { if (wasRestoring && !isRestoring && !restoreError) { diff --git a/frontend/src/System/Backup/useBackups.ts b/frontend/src/System/Backup/useBackups.ts index 7b2dfad8c..04efdd498 100644 --- a/frontend/src/System/Backup/useBackups.ts +++ b/frontend/src/System/Backup/useBackups.ts @@ -22,7 +22,7 @@ export default useBackups; export const useDeleteBackup = (id: number) => { const queryClient = useQueryClient(); - return useApiMutation({ + const { mutate, isPending, error } = useApiMutation({ path: `/system/backup/${id}`, method: 'DELETE', mutationOptions: { @@ -31,6 +31,12 @@ export const useDeleteBackup = (id: number) => { }, }, }); + + return { + deleteBackup: mutate, + isDeleting: isPending, + deleteError: error, + }; }; interface RestoreBackupResponse { @@ -40,7 +46,10 @@ interface RestoreBackupResponse { export const useRestoreBackup = (id: number) => { const queryClient = useQueryClient(); - return useApiMutation({ + const { mutate, isPending, error } = useApiMutation< + RestoreBackupResponse, + void + >({ path: `/system/backup/restore/${id}`, method: 'POST', mutationOptions: { @@ -49,12 +58,22 @@ export const useRestoreBackup = (id: number) => { }, }, }); + + return { + restoreBackupById: mutate, + isRestoringBackup: isPending, + restoreBackupError: error, + }; }; export const useRestoreBackupUpload = () => { const queryClient = useQueryClient(); - return useMutation({ + const { mutate, isPending, error } = useMutation< + RestoreBackupResponse, + Error, + FormData + >({ mutationFn: async (formData: FormData) => { const response = await fetch( `${window.Sonarr.urlBase}/api/v5/system/backup/restore/upload`, @@ -79,4 +98,10 @@ export const useRestoreBackupUpload = () => { queryClient.invalidateQueries({ queryKey: ['/system/backup'] }); }, }); + + return { + uploadBackup: mutate, + isUploadingBackup: isPending, + uploadBackupError: error, + }; };