From 9f6302e5053e474313aa7f064ce797d1d1a194b3 Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Fri, 22 Dec 2023 02:33:09 +0200
Subject: [PATCH] Fixed: Abort old fetch items requests in manual import

Fixes #4375
---
 .../Store/Actions/interactiveImportActions.js | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Store/Actions/interactiveImportActions.js b/frontend/src/Store/Actions/interactiveImportActions.js
index 944236a5c..e0e295568 100644
--- a/frontend/src/Store/Actions/interactiveImportActions.js
+++ b/frontend/src/Store/Actions/interactiveImportActions.js
@@ -18,6 +18,7 @@ export const section = 'interactiveImport';
 
 const albumsSection = `${section}.albums`;
 const trackFilesSection = `${section}.trackFiles`;
+let abortCurrentFetchRequest = null;
 let abortCurrentRequest = null;
 let currentIds = [];
 
@@ -127,6 +128,11 @@ export const clearInteractiveImportTrackFiles = createAction(CLEAR_INTERACTIVE_I
 // Action Handlers
 export const actionHandlers = handleThunks({
   [FETCH_INTERACTIVE_IMPORT_ITEMS]: function(getState, payload, dispatch) {
+    if (abortCurrentFetchRequest) {
+      abortCurrentFetchRequest();
+      abortCurrentFetchRequest = null;
+    }
+
     if (!payload.downloadId && !payload.folder) {
       dispatch(set({ section, error: { message: '`downloadId` or `folder` is required.' } }));
       return;
@@ -134,12 +140,14 @@ export const actionHandlers = handleThunks({
 
     dispatch(set({ section, isFetching: true }));
 
-    const promise = createAjaxRequest({
+    const { request, abortRequest } = createAjaxRequest({
       url: '/manualimport',
       data: payload
-    }).request;
+    });
+
+    abortCurrentFetchRequest = abortRequest;
 
-    promise.done((data) => {
+    request.done((data) => {
       dispatch(batchActions([
         update({ section, data }),
 
@@ -152,7 +160,11 @@ export const actionHandlers = handleThunks({
       ]));
     });
 
-    promise.fail((xhr) => {
+    request.fail((xhr) => {
+      if (xhr.aborted) {
+        return;
+      }
+
       dispatch(set({
         section,
         isFetching: false,