Add a queue while installing or removing a module

packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js

@@ -115,8 +115,63 @@ RED.palette.editor = (function() {
             });
         })
     }
-    function installNodeModule(id,version,url,callback) {
+
-        var requestBody = {
+    const moduleQueue = [];
+    const processQueue = function () {
+        if (moduleQueue.length === 0) {
+            return;
+        }
+
+        const { type, body, callback } = moduleQueue[0];
+        if (type === "install") {
+            $.ajax({
+                url: "nodes",
+                type: "POST",
+                data: JSON.stringify(body),
+                contentType: "application/json; charset=utf-8"
+            }).done(function(_data, _textStatus, _xhr) {
+                callback();
+            }).fail(function(xhr, textStatus, err) {
+                callback(xhr, textStatus, err);
+            }).always(function () {
+                // Remove the task from the list
+                moduleQueue.shift();
+                // Process the next task
+                processQueue();
+            });
+        } else if (type === "remove") {
+            $.ajax({
+                url: "nodes/" + body.id,
+                type: "DELETE"
+            }).done(function(_data, _textStatus, _xhr) {
+                callback();
+            }).fail(function(xhr, _textStatus, _err) {
+                callback(xhr);
+            }).always(function () {
+                // Remove the task from the list
+                moduleQueue.shift();
+                // Process the next task
+                processQueue();
+            });
+        }
+    };
+
+    /**
+     * Adds a module to the processing queue to install or remove it
+     * @param {string} type the type of request to apply to the module
+     * @param {Object} body an object with module info
+     * @param {(xhr?: JQuery.jqXHR, textStatus?: JQuery.Ajax.ErrorTextStatus, err?: string) => void} callback a callback function called when the request is done
+     */
+    function addModuleToQueue(type, body, callback) {
+        moduleQueue.push({ type, body, callback });
+
+        if (moduleQueue.length === 1) {
+            processQueue();
+        }
+    }
+
+    function installNodeModule(id, version, url, callback) {
+        const requestBody = {
             module: id
         };
         if (version) {
@@ -125,26 +180,10 @@ RED.palette.editor = (function() {
         if (url) {
             requestBody.url = url;
         }
-        $.ajax({
+        addModuleToQueue("install", requestBody, callback);
-            url:"nodes",
-            type: "POST",
-            data: JSON.stringify(requestBody),
-            contentType: "application/json; charset=utf-8"
-        }).done(function(data,textStatus,xhr) {
-            callback();
-        }).fail(function(xhr,textStatus,err) {
-            callback(xhr,textStatus,err);
-        });
     }
-    function removeNodeModule(id,callback) {
+    function removeNodeModule(id, callback) {
-        $.ajax({
+        addModuleToQueue("remove", { id: id }, callback);
-            url:"nodes/"+id,
-            type: "DELETE"
-        }).done(function(data,textStatus,xhr) {
-            callback();
-        }).fail(function(xhr,textStatus,err) {
-            callback(xhr);
-        })
     }
 
     function refreshNodeModuleList() {