[Vue] add utility function for pattern that issues a single AJAX requ…

…est at a time (#19239)

* add utility function for pattern that issues a single AJAX request at a time (aborting the previous if in progress)

* make sure to pass abortController as option

plugins/CoreHome/vue/dist/CoreHome.umd.js

@@ -2149,9 +2149,29 @@ var AjaxHelper_AjaxHelper = /*#__PURE__*/function () {
     value: function post(params) {
       var postParams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
       var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-      return this.fetch(params, Object.assign(Object.assign({}, options), {}, {
+      return AjaxHelper.fetch(params, Object.assign(Object.assign({}, options), {}, {
         postParams: postParams
       }));
+    } // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+  }, {
+    key: "oneAtATime",
+    value: function oneAtATime(method, options) {
+      var abortController = null;
+      return function (params, postParams) {
+        if (abortController) {
+          abortController.abort();
+        }
+
+        abortController = new AbortController();
+        return AjaxHelper.post(Object.assign(Object.assign({}, params), {}, {
+          method: method
+        }), postParams, Object.assign(Object.assign({}, options), {}, {
+          abortController: abortController
+        })).finally(function () {
+          abortController = null;
+        });
+      };
     }
   }]);
 

plugins/CoreHome/vue/src/AjaxHelper/AjaxHelper.ts

@@ -266,7 +266,36 @@ export default class AjaxHelper<T = any> { // eslint-disable-line
     postParams: any = {},
     options: AjaxOptions = {},
   ): Promise<R> {
-    return this.fetch<R>(params, { ...options, postParams });
+    return AjaxHelper.fetch<R>(params, { ...options, postParams });
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  static oneAtATime<R = any>(
+    method: string,
+    options?: AjaxOptions,
+  ): (params: QueryParameters, postParams?: QueryParameters) => Promise<R> {
+    let abortController: AbortController|null = null;
+
+    return (params: QueryParameters, postParams?: QueryParameters) => {
+      if (abortController) {
+        abortController.abort();
+      }
+
+      abortController = new AbortController();
+      return AjaxHelper.post<R>(
+        {
+          ...params,
+          method,
+        },
+        postParams,
+        {
+          ...options,
+          abortController,
+        },
+      ).finally(() => {
+        abortController = null;
+      });
+    };
   }
 
   constructor() {