@hashrytech/quick-components-kit 0.20.6 → 0.20.7

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hashrytech/quick-components-kit
 
+## 0.20.7
+
+### Patch Changes
+
+- Adding requests in progress to fetch client
+
 ## 0.20.6
 
 ### Patch Changes

package/dist/modules/fetch-client.d.ts

@@ -91,6 +91,7 @@ export declare class FetchClient {
     private responseInterceptors;
     private errorHandlers;
     private events;
+    private activeRequests;
     /**
      * Creates an instance of ApiClient.
      * @param config - Configuration for the API client.
@@ -126,6 +127,14 @@ export declare class FetchClient {
      */
     addErrorHandler(handler: ErrorHandler): void;
     setEventHooks(events: Partial<FetchClientEvents>): void;
+    /**
+     * True when one or more requests are currently in progress.
+     */
+    get requestsInProgress(): boolean;
+    /**
+     * Number of active in-flight requests.
+     */
+    get activeRequestCount(): number;
     /**
      * Emits a typed event to a single-argument handler (if registered).
      *
@@ -143,6 +152,8 @@ export declare class FetchClient {
      * (e.g. `type EventArgsMap = { onRequest: [Request]; ... }`) to keep spreads type-safe.
     */
     private emit;
+    private beginRequest;
+    private endRequest;
     /**
      * Processes the request, applying default headers, auth token, and request interceptors.
      * @param endpoint - The API endpoint (e.g., '/products', '/users/123').

package/dist/modules/fetch-client.js

@@ -40,6 +40,7 @@ export class FetchClient {
     responseInterceptors = [];
     errorHandlers = [];
     events = {};
+    activeRequests = 0;
     /**
      * Creates an instance of ApiClient.
      * @param config - Configuration for the API client.
@@ -91,6 +92,18 @@ export class FetchClient {
     setEventHooks(events) {
         Object.assign(this.events, events);
     }
+    /**
+     * True when one or more requests are currently in progress.
+     */
+    get requestsInProgress() {
+        return this.activeRequests > 0;
+    }
+    /**
+     * Number of active in-flight requests.
+     */
+    get activeRequestCount() {
+        return this.activeRequests;
+    }
     /**
      * Emits a typed event to a single-argument handler (if registered).
      *
@@ -119,6 +132,14 @@ export class FetchClient {
                 console.warn(`FetchClient ${String(name)} handler threw`, e);
         }
     }
+    beginRequest() {
+        this.activeRequests += 1;
+    }
+    endRequest() {
+        if (this.activeRequests > 0) {
+            this.activeRequests -= 1;
+        }
+    }
     /**
      * Processes the request, applying default headers, auth token, and request interceptors.
      * @param endpoint - The API endpoint (e.g., '/products', '/users/123').
@@ -264,6 +285,7 @@ export class FetchClient {
         if (this.debug)
             console.debug(`Fetch Client: ${options.fetchInstance || this.fetchInstance ? "Using sveltekit fetch instance..." : "Using default fetch instance"}`);
         const currentFetch = options.fetchInstance || this.fetchInstance || fetch; // Use provided fetch first then the class instance fetch or the global fetch if not specified.
+        this.beginRequest();
         try {
             const request = await this.processRequest(endpoint, method, body, options);
             const response = await currentFetch(request);
@@ -292,6 +314,9 @@ export class FetchClient {
                 error: problemError
             };
         }
+        finally {
+            this.endRequest();
+        }
     }
     evaluateRedirect(errorObj, status) {
         for (const rule of this.autoRedirects) {
@@ -437,53 +462,74 @@ export class FetchClient {
         const url = this.baseURL ? new URL(endpoint, this.baseURL).toString() : endpoint; // Resolve endpoint relative to baseURL
         const token = this.accessToken;
         const headers = new Headers(this.defaultHeaders);
+        this.beginRequest();
         // Merge user-supplied headers
         if (options.headers) {
             const userHeaders = new Headers(options.headers);
             userHeaders.forEach((value, key) => headers.set(key, value));
         }
         return new Promise((resolve, reject) => {
-            const xhr = new XMLHttpRequest();
-            xhr.open(method, url, true);
-            // Add Authorization if not skipped
-            if (!options.skipAuth && token) {
-                xhr.setRequestHeader('Authorization', `Bearer ${token}`);
-            }
-            // Add any remaining headers
-            headers.forEach((value, key) => {
-                // Let the browser set Content-Type for FormData
-                if (key.toLowerCase() !== 'content-type') {
-                    xhr.setRequestHeader(key, value);
-                }
-            });
-            xhr.upload.onprogress = (event) => {
-                if (event.lengthComputable) {
-                    onProgress?.(Math.round((event.loaded / event.total) * 100));
-                }
+            let settled = false;
+            const resolveOnce = (value) => {
+                if (settled)
+                    return;
+                settled = true;
+                this.endRequest();
+                resolve(value);
+            };
+            const rejectOnce = (reason) => {
+                if (settled)
+                    return;
+                settled = true;
+                this.endRequest();
+                reject(reason);
             };
-            xhr.onload = () => {
-                if (xhr.status >= 200 && xhr.status < 300) {
-                    const contentType = xhr.getResponseHeader('Content-Type') || '';
-                    if (contentType.includes('application/json')) {
-                        try {
-                            const json = JSON.parse(xhr.responseText);
-                            resolve(json);
+            try {
+                const xhr = new XMLHttpRequest();
+                xhr.open(method, url, true);
+                // Add Authorization if not skipped
+                if (!options.skipAuth && token) {
+                    xhr.setRequestHeader('Authorization', `Bearer ${token}`);
+                }
+                // Add any remaining headers
+                headers.forEach((value, key) => {
+                    // Let the browser set Content-Type for FormData
+                    if (key.toLowerCase() !== 'content-type') {
+                        xhr.setRequestHeader(key, value);
+                    }
+                });
+                xhr.upload.onprogress = (event) => {
+                    if (event.lengthComputable) {
+                        onProgress?.(Math.round((event.loaded / event.total) * 100));
+                    }
+                };
+                xhr.onload = () => {
+                    if (xhr.status >= 200 && xhr.status < 300) {
+                        const contentType = xhr.getResponseHeader('Content-Type') || '';
+                        if (contentType.includes('application/json')) {
+                            try {
+                                const json = JSON.parse(xhr.responseText);
+                                resolveOnce(json);
+                            }
+                            catch {
+                                rejectOnce(new Error('Failed to parse JSON response'));
+                            }
                         }
-                        catch {
-                            reject(new Error('Failed to parse JSON response'));
+                        else {
+                            // If not JSON, cast explicitly to unknown first, then to T
+                            resolveOnce(xhr.responseText);
                         }
                     }
                     else {
-                        // If not JSON, cast explicitly to unknown first, then to T
-                        resolve(xhr.responseText);
+                        rejectOnce(new FetchError(xhr.statusText, xhr.status));
                     }
-                }
-                else {
-                    reject(new FetchError(xhr.statusText, xhr.status));
-                }
-            };
-            xhr.onerror = () => reject(new Error('Upload failed'));
-            xhr.send(data);
+                };
+                xhr.onerror = () => rejectOnce(new Error('Upload failed'));
+                xhr.send(data);
+            }
+            catch (error) {
+                rejectOnce(error);
+            }
         });
     }
     /**

package/package.json

@@ -5,7 +5,7 @@
     "type": "git",
     "url": "git+https://github.com/hashrytech/quick-components-kit.git"
   },
-  "version": "0.20.6",
+  "version": "0.20.7",
   "license": "MIT",
   "author": "Hashry Tech",
   "files": [