@ventlio/tanstack-query 0.2.76 → 0.2.77

package/dist/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './useUploadProgress';

package/dist/hooks/useUploadProgress.d.ts

@@ -0,0 +1,5 @@
+import type { AxiosProgressEvent } from 'axios';
+export declare const useUploadProgress: () => {
+    onUploadProgress: (progressEvent: AxiosProgressEvent) => void;
+    uploadProgressPercent: number;
+};

package/dist/hooks/useUploadProgress.js

@@ -0,0 +1,14 @@
+import { useState } from 'react';
+
+const useUploadProgress = () => {
+    const [uploadProgressPercent, setUploadProgressPercent] = useState(0);
+    const onUploadProgress = (progressEvent) => {
+        const { loaded, total } = progressEvent;
+        const percentage = Math.round((loaded / total) * 100);
+        setUploadProgressPercent(percentage);
+    };
+    return { onUploadProgress, uploadProgressPercent };
+};
+
+export { useUploadProgress };
+//# sourceMappingURL=useUploadProgress.js.map

package/dist/hooks/useUploadProgress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useUploadProgress.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/index.mjs

@@ -313,7 +313,7 @@ const successTransformer = (data) => {
     };
 };
 
-async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, headers = {}, baseURL, timeout, appFileConfig, }) {
+async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, headers = {}, baseURL, timeout, appFileConfig, onUploadProgress, }) {
     // check if file is included in mobile app environment and extract all file input to avoid
     // it being formatted to object using axios formData builder
     const isApp = appFileConfig?.isApp;
@@ -351,6 +351,7 @@ async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, he
             url: path,
             method,
             data: body,
+            onUploadProgress,
         });
         // get response json
         const jsonResp = await resp.data;
@@ -599,8 +600,19 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
     };
 };
 
+const useUploadProgress = () => {
+    const [uploadProgressPercent, setUploadProgressPercent] = useState(0);
+    const onUploadProgress = (progressEvent) => {
+        const { loaded, total } = progressEvent;
+        const percentage = Math.round((loaded / total) * 100);
+        setUploadProgressPercent(percentage);
+    };
+    return { onUploadProgress, uploadProgressPercent };
+};
+
 const usePatchRequest = ({ path, baseUrl, headers }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
+    const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
     const { getHeaders } = useQueryHeaders();
     const queryClient = useQueryClient();
     const config = queryClient.getQueryData(['config']);
@@ -614,6 +626,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
             headers: { ...globalHeaders, ...headers },
             baseURL: baseUrl ?? API_URL,
             timeout: TIMEOUT,
+            onUploadProgress,
         });
         if (patchResponse.status) {
             // scroll to top after success
@@ -637,7 +650,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
     const patch = async (data, options) => {
         return mutation.mutateAsync(data, options);
     };
-    return { patch, ...mutation };
+    return { patch, uploadProgressPercent, ...mutation };
 };
 
 const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelectors, }) => {
@@ -645,6 +658,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
     const queryClient = useQueryClient();
     const { getHeaders } = useQueryHeaders();
     const { isApp } = useReactNativeEnv();
+    const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
     const sendRequest = async (res, rej, postData) => {
         // get request headers
         const globalHeaders = getHeaders();
@@ -661,6 +675,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
                 isApp,
                 fileSelectors,
             },
+            onUploadProgress,
         });
         if (postResponse.status) {
             // scroll to top after success
@@ -682,7 +697,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
     const post = async (data, options) => {
         return mutation.mutateAsync(data, options);
     };
-    return { post, ...mutation };
+    return { post, uploadProgressPercent, ...mutation };
 };
 
 export { ContentType, HttpMethod, axiosInstance, bootstrapQueryRequest, buildFormData, errorTransformer, getDateInFuture, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetInfiniteRequest, useGetRequest, useKeyTrackerModel, usePatchRequest, usePostRequest, useQueryConfig, useQueryHeaders, useQueryModel, useReactNativeEnv, useRefetchQuery };

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/queries/usePatchRequest.d.ts

@@ -20,6 +20,7 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: undefined;
     error: null;
@@ -37,6 +38,7 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: undefined;
     error: IRequestError;
@@ -54,6 +56,7 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: IRequestSuccess<TResponse>;
     error: null;
@@ -71,4 +74,5 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 };

package/dist/queries/usePatchRequest.js

@@ -3,12 +3,14 @@ import 'url-search-params-polyfill';
 import { useEnvironmentVariables } from '../config/useEnvironmentVariables.js';
 import { useQueryHeaders } from '../config/useQueryHeaders.js';
 import { scrollToTop } from '../helpers/scrollToTop.js';
+import { useUploadProgress } from '../hooks/useUploadProgress.js';
 import 'axios';
 import { makeRequest } from '../request/make-request.js';
 import { HttpMethod } from '../request/request.enum.js';
 
 const usePatchRequest = ({ path, baseUrl, headers }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
+    const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
     const { getHeaders } = useQueryHeaders();
     const queryClient = useQueryClient();
     const config = queryClient.getQueryData(['config']);
@@ -22,6 +24,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
             headers: { ...globalHeaders, ...headers },
             baseURL: baseUrl ?? API_URL,
             timeout: TIMEOUT,
+            onUploadProgress,
         });
         if (patchResponse.status) {
             // scroll to top after success
@@ -45,7 +48,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
     const patch = async (data, options) => {
         return mutation.mutateAsync(data, options);
     };
-    return { patch, ...mutation };
+    return { patch, uploadProgressPercent, ...mutation };
 };
 
 export { usePatchRequest };

package/dist/queries/usePatchRequest.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePatchRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"usePatchRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/queries/usePostRequest.d.ts

@@ -22,6 +22,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     post: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: undefined;
     error: null;
@@ -39,6 +40,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     post: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: undefined;
     error: IRequestError;
@@ -56,6 +58,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     post: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 } | {
     data: IRequestSuccess<TResponse>;
     error: null;
@@ -73,4 +76,5 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
     variables: void | undefined;
     mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
     post: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse>>;
+    uploadProgressPercent: number;
 };

package/dist/queries/usePostRequest.js

@@ -4,6 +4,7 @@ import { useEnvironmentVariables } from '../config/useEnvironmentVariables.js';
 import { useQueryHeaders } from '../config/useQueryHeaders.js';
 import { useReactNativeEnv } from '../config/useReactNativeEnv.js';
 import { scrollToTop } from '../helpers/scrollToTop.js';
+import { useUploadProgress } from '../hooks/useUploadProgress.js';
 import 'axios';
 import { makeRequest } from '../request/make-request.js';
 import { HttpMethod } from '../request/request.enum.js';
@@ -13,6 +14,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
     const queryClient = useQueryClient();
     const { getHeaders } = useQueryHeaders();
     const { isApp } = useReactNativeEnv();
+    const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
     const sendRequest = async (res, rej, postData) => {
         // get request headers
         const globalHeaders = getHeaders();
@@ -29,6 +31,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
                 isApp,
                 fileSelectors,
             },
+            onUploadProgress,
         });
         if (postResponse.status) {
             // scroll to top after success
@@ -50,7 +53,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
     const post = async (data, options) => {
         return mutation.mutateAsync(data, options);
     };
-    return { post, ...mutation };
+    return { post, uploadProgressPercent, ...mutation };
 };
 
 export { usePostRequest };

package/dist/queries/usePostRequest.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePostRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"usePostRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/request/make-request.d.ts

@@ -1,2 +1,2 @@
 import type { IMakeRequest } from './request.interface';
-export declare function makeRequest<TResponse>({ body, method, path, isFormData, headers, baseURL, timeout, appFileConfig, }: IMakeRequest): Promise<import("./request.interface").IRequestError>;
+export declare function makeRequest<TResponse>({ body, method, path, isFormData, headers, baseURL, timeout, appFileConfig, onUploadProgress, }: IMakeRequest): Promise<import("./request.interface").IRequestError>;

package/dist/request/make-request.js

@@ -3,7 +3,7 @@ import { axiosInstance } from './axios-instance.js';
 import { ContentType, HttpMethod } from './request.enum.js';
 import { errorTransformer, successTransformer } from './transformer.js';
 
-async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, headers = {}, baseURL, timeout, appFileConfig, }) {
+async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, headers = {}, baseURL, timeout, appFileConfig, onUploadProgress, }) {
     // check if file is included in mobile app environment and extract all file input to avoid
     // it being formatted to object using axios formData builder
     const isApp = appFileConfig?.isApp;
@@ -41,6 +41,7 @@ async function makeRequest({ body, method = HttpMethod.GET, path, isFormData, he
             url: path,
             method,
             data: body,
+            onUploadProgress,
         });
         // get response json
         const jsonResp = await resp.data;

package/dist/request/make-request.js.map

@@ -1 +1 @@
-{"version":3,"file":"make-request.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"make-request.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/request/request.interface.d.ts

@@ -1,4 +1,4 @@
-import type { RawAxiosRequestHeaders } from 'axios';
+import type { AxiosProgressEvent, RawAxiosRequestHeaders } from 'axios';
 import type { HttpMethod } from './request.enum';
 export interface IMakeRequest {
     baseURL: string;
@@ -9,6 +9,7 @@ export interface IMakeRequest {
     isFormData?: boolean;
     headers: RawAxiosRequestHeaders;
     appFileConfig?: AppFileConfig;
+    onUploadProgress?: (progressEvent: AxiosProgressEvent) => void;
 }
 export interface AppFileConfig {
     fileSelectors?: string[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ventlio/tanstack-query",
-  "version": "0.2.76",
+  "version": "0.2.77",
   "license": "MIT",
   "main": "dist/index.js",
   "contributors": [

package/src/hooks/index.ts

@@ -0,0 +1 @@
+export * from './useUploadProgress';

package/src/hooks/useUploadProgress.ts

@@ -0,0 +1,15 @@
+import type { AxiosProgressEvent } from 'axios';
+import { useState } from 'react';
+
+export const useUploadProgress = () => {
+  const [uploadProgressPercent, setUploadProgressPercent] = useState<number>(0);
+
+  const onUploadProgress = (progressEvent: AxiosProgressEvent) => {
+    const { loaded, total } = progressEvent;
+    const percentage = Math.round((loaded / (total as number)) * 100);
+
+    setUploadProgressPercent(percentage);
+  };
+
+  return { onUploadProgress, uploadProgressPercent };
+};

package/src/queries/usePatchRequest.ts

@@ -3,6 +3,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 import type { RawAxiosRequestHeaders } from 'axios';
 import { useEnvironmentVariables, useQueryHeaders } from '../config';
 import { scrollToTop } from '../helpers';
+import { useUploadProgress } from '../hooks';
 import { HttpMethod, makeRequest } from '../request';
 import type { IRequestError, IRequestSuccess } from '../request/request.interface';
 import type { TanstackQueryConfig } from '../types';
@@ -10,6 +11,7 @@ import type { DefaultRequestOptions } from './queries.interface';
 
 export const usePatchRequest = <TResponse>({ path, baseUrl, headers }: { path: string } & DefaultRequestOptions) => {
   const { API_URL, TIMEOUT } = useEnvironmentVariables();
+  const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
 
   const { getHeaders } = useQueryHeaders();
   const queryClient = useQueryClient();
@@ -27,6 +29,7 @@ export const usePatchRequest = <TResponse>({ path, baseUrl, headers }: { path: s
       headers: { ...globalHeaders, ...headers },
       baseURL: baseUrl ?? API_URL,
       timeout: TIMEOUT,
+      onUploadProgress,
     });
 
     if (patchResponse.status) {
@@ -59,5 +62,5 @@ export const usePatchRequest = <TResponse>({ path, baseUrl, headers }: { path: s
     return mutation.mutateAsync(data, options);
   };
 
-  return { patch, ...mutation };
+  return { patch, uploadProgressPercent, ...mutation };
 };

package/src/queries/usePostRequest.ts

@@ -4,6 +4,7 @@ import { useEnvironmentVariables, useQueryHeaders, useReactNativeEnv } from '../
 
 import type { RawAxiosRequestHeaders } from 'axios';
 import { scrollToTop } from '../helpers';
+import { useUploadProgress } from '../hooks';
 import type { IRequestError, IRequestSuccess } from '../request';
 import { HttpMethod, makeRequest } from '../request';
 import type { TanstackQueryConfig } from '../types';
@@ -24,6 +25,8 @@ export const usePostRequest = <TResponse>({
   const queryClient = useQueryClient();
   const { getHeaders } = useQueryHeaders();
   const { isApp } = useReactNativeEnv();
+  const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
+
   const sendRequest = async (res: (value: any) => void, rej: (reason?: any) => void, postData: any) => {
     // get request headers
     const globalHeaders: RawAxiosRequestHeaders = getHeaders();
@@ -41,6 +44,7 @@ export const usePostRequest = <TResponse>({
         isApp,
         fileSelectors,
       },
+      onUploadProgress,
     });
 
     if (postResponse.status) {
@@ -70,5 +74,5 @@ export const usePostRequest = <TResponse>({
     return mutation.mutateAsync(data, options);
   };
 
-  return { post, ...mutation };
+  return { post, uploadProgressPercent, ...mutation };
 };

package/src/request/make-request.ts

@@ -14,6 +14,7 @@ export async function makeRequest<TResponse>({
   baseURL,
   timeout,
   appFileConfig,
+  onUploadProgress,
 }: IMakeRequest) {
   // check if file is included in mobile app environment and extract all file input to avoid
   // it being formatted to object using axios formData builder
@@ -53,6 +54,7 @@ export async function makeRequest<TResponse>({
       url: path,
       method,
       data: body,
+      onUploadProgress,
     });
 
     // get response json

package/src/request/request.interface.ts

@@ -1,4 +1,4 @@
-import type { RawAxiosRequestHeaders } from 'axios';
+import type { AxiosProgressEvent, RawAxiosRequestHeaders } from 'axios';
 import type { HttpMethod } from './request.enum';
 
 export interface IMakeRequest {
@@ -10,12 +10,14 @@ export interface IMakeRequest {
   isFormData?: boolean;
   headers: RawAxiosRequestHeaders;
   appFileConfig?: AppFileConfig;
+  onUploadProgress?: (progressEvent: AxiosProgressEvent) => void;
 }
 
 export interface AppFileConfig {
   fileSelectors?: string[];
   isApp: boolean;
 }
+
 export interface AxiosInstanceOption {
   bearerToken?: string;
   contentType?: string;