@ventlio/tanstack-query 0.2.22 → 0.2.24

package/dist/config/index.d.ts

@@ -1,6 +1,3 @@
 export * from './config.interface';
 export * from './useEnvironmentVariables';
-export * from './useQueryBaseURL';
 export * from './useQueryConfig';
-export * from './useQueryHeaders';
-export * from './useQueryTimeout';

package/dist/config/useQueryConfig.js

@@ -4,8 +4,8 @@ var reactQuery = require('@tanstack/react-query');
 
 const useQueryConfig = () => {
     const queryClient = reactQuery.useQueryClient();
-    const { headers = {}, baseURL = '', timeout = 10000, } = queryClient.getQueryData(['config']) ?? {};
-    return { headers, baseURL, timeout };
+    const { headers = {} } = queryClient.getQueryData(['config']) ?? {};
+    return { headers };
 };
 
 exports.useQueryConfig = useQueryConfig;

package/dist/contexts/QueryClientRequestProvider.d.ts

@@ -0,0 +1,12 @@
+import type { QueryClient } from '@tanstack/react-query';
+import type { RawAxiosRequestHeaders } from 'axios';
+import React from 'react';
+export interface IRequestHeaderProvider {
+    headers: RawAxiosRequestHeaders;
+    setHeaders: (newHeaders: RawAxiosRequestHeaders) => void;
+}
+export declare const RequestHeaderProvider: React.Context<IRequestHeaderProvider>;
+export declare const QueryClientRequestProvider: ({ client, children, }: {
+    client: QueryClient;
+    children: React.ReactNode;
+}) => JSX.Element;

package/dist/contexts/QueryClientRequestProvider.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var reactQuery = require('@tanstack/react-query');
+var React = require('react');
+
+const RequestHeaderProvider = React.createContext({
+    headers: {},
+    setHeaders: (_newHeaders) => {
+        //
+    },
+});
+const QueryClientRequestProvider = ({ client, children, }) => {
+    const [headers, updateHeaders] = React.useState({});
+    const setHeaders = React.useCallback((newHeaders) => {
+        updateHeaders(newHeaders);
+    }, []);
+    const requestContextValue = React.useMemo(() => ({ headers, setHeaders }), [headers, setHeaders]);
+    return (React.createElement(reactQuery.QueryClientProvider, { client: client },
+        React.createElement(RequestHeaderProvider.Provider, { value: requestContextValue }, children)));
+};
+
+exports.QueryClientRequestProvider = QueryClientRequestProvider;
+exports.RequestHeaderProvider = RequestHeaderProvider;
+//# sourceMappingURL=QueryClientRequestProvider.js.map

package/dist/contexts/QueryClientRequestProvider.js.map

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

package/dist/contexts/index.d.ts

@@ -0,0 +1,2 @@
+export * from './QueryClientRequestProvider';
+export * from './useQueryHeaders';

package/dist/contexts/useQueryHeaders.d.ts

@@ -0,0 +1,2 @@
+import type { IRequestHeaderProvider } from './QueryClientRequestProvider';
+export declare const useQueryHeaders: () => IRequestHeaderProvider;

package/dist/contexts/useQueryHeaders.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var React = require('react');
+var QueryClientRequestProvider = require('./QueryClientRequestProvider.js');
+
+const useQueryHeaders = () => {
+    return React.useContext(QueryClientRequestProvider.RequestHeaderProvider);
+};
+
+exports.useQueryHeaders = useQueryHeaders;
+//# sourceMappingURL=useQueryHeaders.js.map

package/dist/{config → contexts}/useQueryHeaders.js.map

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

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './config';
+export * from './contexts';
 export * from './helpers';
 export * from './model';
 export * from './queries';

package/dist/index.js

@@ -1,10 +1,9 @@
 'use strict';
 
 var useEnvironmentVariables = require('./config/useEnvironmentVariables.js');
-var useQueryBaseURL = require('./config/useQueryBaseURL.js');
 var useQueryConfig = require('./config/useQueryConfig.js');
-var useQueryHeaders = require('./config/useQueryHeaders.js');
-var useQueryTimeout = require('./config/useQueryTimeout.js');
+var QueryClientRequestProvider = require('./contexts/QueryClientRequestProvider.js');
+var useQueryHeaders = require('./contexts/useQueryHeaders.js');
 var scrollToTop = require('./helpers/scrollToTop.js');
 var useKeyTrackerModel = require('./model/useKeyTrackerModel.js');
 var useQueryModel = require('./model/useQueryModel.js');
@@ -22,10 +21,10 @@ var transformer = require('./request/transformer.js');
 
 
 exports.useEnvironmentVariables = useEnvironmentVariables.useEnvironmentVariables;
-exports.useQueryBaseURL = useQueryBaseURL.useQueryBaseURL;
 exports.useQueryConfig = useQueryConfig.useQueryConfig;
+exports.QueryClientRequestProvider = QueryClientRequestProvider.QueryClientRequestProvider;
+exports.RequestHeaderProvider = QueryClientRequestProvider.RequestHeaderProvider;
 exports.useQueryHeaders = useQueryHeaders.useQueryHeaders;
-exports.useQueryTimeout = useQueryTimeout.useQueryTimeout;
 exports.scrollToTop = scrollToTop.scrollToTop;
 exports.useKeyTrackerModel = useKeyTrackerModel.useKeyTrackerModel;
 exports.useQueryModel = useQueryModel.useQueryModel;

package/dist/index.js.map

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

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { useQueryClient, useQuery, useMutation } from '@tanstack/react-query';
-import { useState, useMemo, useEffect, startTransition } from 'react';
+import { useQueryClient, QueryClientProvider, useQuery, useMutation } from '@tanstack/react-query';
+import React, { createContext, useState, useCallback, useMemo, useContext, useEffect, startTransition } from 'react';
 import axios from 'axios';
 
 const useEnvironmentVariables = () => {
@@ -13,47 +13,28 @@ const useEnvironmentVariables = () => {
 
 const useQueryConfig = () => {
     const queryClient = useQueryClient();
-    const { headers = {}, baseURL = '', timeout = 10000, } = queryClient.getQueryData(['config']) ?? {};
-    return { headers, baseURL, timeout };
+    const { headers = {} } = queryClient.getQueryData(['config']) ?? {};
+    return { headers };
 };
 
-const useQueryBaseURL = () => {
-    const { baseURL } = useQueryConfig();
-    const queryClient = useQueryClient();
-    const setQueryBaseUrl = (newBaseUrl) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = {
-                ...config,
-                baseURL: newBaseUrl,
-            };
-            return newConfig;
-        });
-    };
-    return { baseURL, setQueryBaseUrl };
+const RequestHeaderProvider = createContext({
+    headers: {},
+    setHeaders: (_newHeaders) => {
+        //
+    },
+});
+const QueryClientRequestProvider = ({ client, children, }) => {
+    const [headers, updateHeaders] = useState({});
+    const setHeaders = useCallback((newHeaders) => {
+        updateHeaders(newHeaders);
+    }, []);
+    const requestContextValue = useMemo(() => ({ headers, setHeaders }), [headers, setHeaders]);
+    return (React.createElement(QueryClientProvider, { client: client },
+        React.createElement(RequestHeaderProvider.Provider, { value: requestContextValue }, children)));
 };
 
 const useQueryHeaders = () => {
-    const { headers } = useQueryConfig();
-    const queryClient = useQueryClient();
-    const setQueryHeaders = (newHeaders) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = { ...config, headers: newHeaders };
-            return newConfig;
-        });
-    };
-    return { headers, setQueryHeaders };
-};
-
-const useQueryTimeout = () => {
-    const { timeout } = useQueryConfig();
-    const queryClient = useQueryClient();
-    const setQueryTimeout = (newTimeout) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = { ...config, timeout: newTimeout };
-            return newConfig;
-        });
-    };
-    return { timeout, setQueryTimeout };
+    return useContext(RequestHeaderProvider);
 };
 
 const scrollToTop = () => {
@@ -198,7 +179,7 @@ const useDeleteRequest = () => {
     const [requestPath, updateDeletePath] = useState('');
     const [options, setOptions] = useState();
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
-    const { headers } = useQueryConfig();
+    const { headers } = useQueryHeaders();
     const query = useQuery([requestPath, {}], () => new Promise((res, rej) => {
         setTimeout(async () => {
             const postResponse = await makeRequest({
@@ -241,7 +222,7 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, }) => {
     const [options, setOptions] = useState(queryOptions);
     const [page, setPage] = useState(1);
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
-    const { headers } = useQueryConfig();
+    const { headers } = useQueryHeaders();
     let queryClient = useQueryClient();
     // eslint-disable-next-line react-hooks/exhaustive-deps
     queryClient = useMemo(() => queryClient, []);
@@ -338,7 +319,7 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, }) => {
 
 const usePatchRequest = ({ path }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
-    const { headers } = useQueryConfig();
+    const { headers } = useQueryHeaders();
     // register post mutation
     const mutation = useMutation((postData) => new Promise((res, rej) => {
         makeRequest({
@@ -372,7 +353,7 @@ const usePatchRequest = ({ path }) => {
 
 const usePostRequest = ({ path, isFormData = false, }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables();
-    const { headers } = useQueryConfig();
+    const { headers } = useQueryHeaders();
     // register post mutation
     const mutation = useMutation(async (postData) => new Promise((res, rej) => {
         makeRequest({
@@ -408,5 +389,5 @@ const usePostRequest = ({ path, isFormData = false, }) => {
     return { post, ...mutation };
 };
 
-export { ContentType, HttpMethod, axiosInstance, buildFormData, errorTransformer, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetRequest, useKeyTrackerModel, usePatchRequest, usePostRequest, useQueryBaseURL, useQueryConfig, useQueryHeaders, useQueryModel, useQueryTimeout, useRefetchQuery };
+export { ContentType, HttpMethod, QueryClientRequestProvider, RequestHeaderProvider, axiosInstance, buildFormData, errorTransformer, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetRequest, useKeyTrackerModel, usePatchRequest, usePostRequest, useQueryConfig, useQueryHeaders, useQueryModel, useRefetchQuery };
 //# sourceMappingURL=index.mjs.map

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/model/useKeyTrackerModel.js

@@ -1,12 +1,12 @@
 'use strict';
 
 var reactQuery = require('@tanstack/react-query');
-var react = require('react');
+var React = require('react');
 
 const useKeyTrackerModel = (keyTracker) => {
     const queryClient = reactQuery.useQueryClient();
-    const [data, setData] = react.useState();
-    const [queryKey, setQueryKey] = react.useState();
+    const [data, setData] = React.useState();
+    const [queryKey, setQueryKey] = React.useState();
     const getQueryKey = (innerKeyTracker) => {
         const key = queryClient.getQueryData([
             innerKeyTracker ?? keyTracker,

package/dist/queries/useDeleteRequest.js

@@ -1,18 +1,19 @@
 'use strict';
 
 var reactQuery = require('@tanstack/react-query');
-var react = require('react');
+var React = require('react');
 var useEnvironmentVariables = require('../config/useEnvironmentVariables.js');
-var useQueryConfig = require('../config/useQueryConfig.js');
+require('../contexts/QueryClientRequestProvider.js');
+var useQueryHeaders = require('../contexts/useQueryHeaders.js');
 require('axios');
 var makeRequest = require('../request/make-request.js');
 var request_enum = require('../request/request.enum.js');
 
 const useDeleteRequest = () => {
-    const [requestPath, updateDeletePath] = react.useState('');
-    const [options, setOptions] = react.useState();
+    const [requestPath, updateDeletePath] = React.useState('');
+    const [options, setOptions] = React.useState();
     const { API_URL, TIMEOUT } = useEnvironmentVariables.useEnvironmentVariables();
-    const { headers } = useQueryConfig.useQueryConfig();
+    const { headers } = useQueryHeaders.useQueryHeaders();
     const query = reactQuery.useQuery([requestPath, {}], () => new Promise((res, rej) => {
         setTimeout(async () => {
             const postResponse = await makeRequest.makeRequest({

package/dist/queries/useDeleteRequest.js.map

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

package/dist/queries/useGetRequest.js

@@ -1,22 +1,23 @@
 'use strict';
 
 var reactQuery = require('@tanstack/react-query');
-var react = require('react');
+var React = require('react');
 var useEnvironmentVariables = require('../config/useEnvironmentVariables.js');
-var useQueryConfig = require('../config/useQueryConfig.js');
+require('../contexts/QueryClientRequestProvider.js');
+var useQueryHeaders = require('../contexts/useQueryHeaders.js');
 require('axios');
 var makeRequest = require('../request/make-request.js');
 require('../request/request.enum.js');
 
 const useGetRequest = ({ path, load = false, queryOptions, keyTracker, }) => {
-    const [requestPath, updatePath] = react.useState(path);
-    const [options, setOptions] = react.useState(queryOptions);
-    const [page, setPage] = react.useState(1);
+    const [requestPath, updatePath] = React.useState(path);
+    const [options, setOptions] = React.useState(queryOptions);
+    const [page, setPage] = React.useState(1);
     const { API_URL, TIMEOUT } = useEnvironmentVariables.useEnvironmentVariables();
-    const { headers } = useQueryConfig.useQueryConfig();
+    const { headers } = useQueryHeaders.useQueryHeaders();
     let queryClient = reactQuery.useQueryClient();
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    queryClient = react.useMemo(() => queryClient, []);
+    queryClient = React.useMemo(() => queryClient, []);
     const sendRequest = async (res, rej) => {
         const postResponse = await makeRequest.makeRequest({
             path: requestPath,
@@ -37,12 +38,12 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, }) => {
         enabled: load,
         ...options,
     });
-    react.useEffect(() => {
+    React.useEffect(() => {
         if (path) {
             updatePath(path);
         }
     }, [path]);
-    react.useEffect(() => {
+    React.useEffect(() => {
         if (keyTracker) {
             queryClient.setQueryData([keyTracker], [requestPath, {}]);
         }
@@ -82,12 +83,12 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, }) => {
         updatePath(constructPaginationLink(requestPath, pageNumber));
     };
     const updatedPathAsync = async (link) => {
-        react.startTransition(() => {
+        React.startTransition(() => {
             updatePath(link);
         });
     };
     const setOptionsAsync = async (fetchOptions) => {
-        react.startTransition(() => {
+        React.startTransition(() => {
             setOptions(fetchOptions);
         });
     };

package/dist/queries/useGetRequest.js.map

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

package/dist/queries/usePatchRequest.js

@@ -6,11 +6,12 @@ require('axios');
 var makeRequest = require('../request/make-request.js');
 var request_enum = require('../request/request.enum.js');
 var useEnvironmentVariables = require('../config/useEnvironmentVariables.js');
-var useQueryConfig = require('../config/useQueryConfig.js');
+require('../contexts/QueryClientRequestProvider.js');
+var useQueryHeaders = require('../contexts/useQueryHeaders.js');
 
 const usePatchRequest = ({ path }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables.useEnvironmentVariables();
-    const { headers } = useQueryConfig.useQueryConfig();
+    const { headers } = useQueryHeaders.useQueryHeaders();
     // register post mutation
     const mutation = reactQuery.useMutation((postData) => new Promise((res, rej) => {
         makeRequest.makeRequest({

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.js

@@ -2,14 +2,15 @@
 
 var reactQuery = require('@tanstack/react-query');
 var useEnvironmentVariables = require('../config/useEnvironmentVariables.js');
-var useQueryConfig = require('../config/useQueryConfig.js');
+require('../contexts/QueryClientRequestProvider.js');
+var useQueryHeaders = require('../contexts/useQueryHeaders.js');
 require('axios');
 var makeRequest = require('../request/make-request.js');
 var request_enum = require('../request/request.enum.js');
 
 const usePostRequest = ({ path, isFormData = false, }) => {
     const { API_URL, TIMEOUT } = useEnvironmentVariables.useEnvironmentVariables();
-    const { headers } = useQueryConfig.useQueryConfig();
+    const { headers } = useQueryHeaders.useQueryHeaders();
     // register post mutation
     const mutation = reactQuery.useMutation(async (postData) => new Promise((res, rej) => {
         makeRequest.makeRequest({

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/types/index.d.ts

@@ -1,18 +1,8 @@
 import type { RawAxiosRequestHeaders } from 'axios';
 export interface TanstackQueryConfig {
-    baseURL: string;
-    timeout?: number;
     headers: RawAxiosRequestHeaders;
 }
 export interface IUseQueryHeaders {
     headers: TanstackQueryConfig['headers'];
     setQueryHeaders: (header: TanstackQueryConfig['headers']) => void;
 }
-export interface IUseQueryTimeout {
-    timeout: TanstackQueryConfig['timeout'];
-    setQueryTimeout: (timeout: TanstackQueryConfig['timeout']) => void;
-}
-export interface IUseQueryBaseURL {
-    baseURL: TanstackQueryConfig['baseURL'];
-    setQueryBaseUrl: (baseURL: TanstackQueryConfig['baseURL']) => void;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ventlio/tanstack-query",
-  "version": "0.2.22",
+  "version": "0.2.24",
   "license": "MIT",
   "main": "dist/index.js",
   "contributors": [
@@ -28,6 +28,7 @@
     "@tanstack/react-query": "^4.26.1",
     "axios": "^1.3.4",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-native": "*"
   },
   "peerDependenciesMeta": {
@@ -48,7 +49,8 @@
     "@tanstack/react-query": "^4.26.1",
     "@types/axios": "^0.14.0",
     "@types/node": "*",
-    "@types/react": "^18.0.28",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0",
     "@typescript-eslint/eslint-plugin": "^5.54.1",
     "@typescript-eslint/parser": "^5.54.1",
     "axios": "^1.3.4",
@@ -62,6 +64,7 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "prettier": "^2.8.4",
     "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rimraf": "^4.4.0",
     "rollup": "^3.19.1",
     "rollup-plugin-typescript2": "^0.34.1",

package/src/config/index.ts

@@ -1,6 +1,3 @@
 export * from './config.interface';
 export * from './useEnvironmentVariables';
-export * from './useQueryBaseURL';
 export * from './useQueryConfig';
-export * from './useQueryHeaders';
-export * from './useQueryTimeout';

package/src/config/useQueryConfig.ts

@@ -4,11 +4,8 @@ import type { TanstackQueryConfig } from '../types';
 export const useQueryConfig = (): TanstackQueryConfig => {
   const queryClient = useQueryClient();
 
-  const {
-    headers = {},
-    baseURL = '',
-    timeout = 10000,
-  } = queryClient.getQueryData<TanstackQueryConfig>(['config']) ?? {};
+  const { headers = {} } =
+    queryClient.getQueryData<TanstackQueryConfig>(['config']) ?? {};
 
-  return { headers, baseURL, timeout };
+  return { headers };
 };

package/src/contexts/QueryClientRequestProvider.tsx

@@ -0,0 +1,48 @@
+import type { QueryClient } from '@tanstack/react-query';
+import { QueryClientProvider } from '@tanstack/react-query';
+import type { RawAxiosRequestHeaders } from 'axios';
+import React, { createContext, useCallback, useMemo, useState } from 'react';
+
+export interface IRequestHeaderProvider {
+  headers: RawAxiosRequestHeaders;
+  setHeaders: (newHeaders: RawAxiosRequestHeaders) => void;
+}
+
+export const RequestHeaderProvider = createContext<IRequestHeaderProvider>({
+  headers: {},
+  setHeaders: (_newHeaders: IRequestHeaderProvider['headers']) => {
+    //
+  },
+});
+
+export const QueryClientRequestProvider = ({
+  client,
+  children,
+}: {
+  client: QueryClient;
+  children: React.ReactNode;
+}) => {
+  const [headers, updateHeaders] = useState<IRequestHeaderProvider['headers']>(
+    {}
+  );
+
+  const setHeaders = useCallback(
+    (newHeaders: IRequestHeaderProvider['headers']) => {
+      updateHeaders(newHeaders);
+    },
+    []
+  );
+
+  const requestContextValue = useMemo(
+    () => ({ headers, setHeaders }),
+    [headers, setHeaders]
+  );
+
+  return (
+    <QueryClientProvider client={client}>
+      <RequestHeaderProvider.Provider value={requestContextValue}>
+        {children}
+      </RequestHeaderProvider.Provider>
+    </QueryClientProvider>
+  );
+};

package/src/contexts/index.ts

@@ -0,0 +1,2 @@
+export * from './QueryClientRequestProvider';
+export * from './useQueryHeaders';

package/src/contexts/useQueryHeaders.ts

@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+import type { IRequestHeaderProvider } from './QueryClientRequestProvider';
+import { RequestHeaderProvider } from './QueryClientRequestProvider';
+
+export const useQueryHeaders = (): IRequestHeaderProvider => {
+  return useContext(RequestHeaderProvider);
+};

package/src/index.ts

@@ -1,4 +1,5 @@
 export * from './config';
+export * from './contexts';
 export * from './helpers';
 export * from './model';
 export * from './queries';

package/src/queries/useDeleteRequest.ts

@@ -1,7 +1,8 @@
 import type { UseQueryOptions } from '@tanstack/react-query';
 import { useQuery } from '@tanstack/react-query';
 import { useState } from 'react';
-import { useEnvironmentVariables, useQueryConfig } from '../config';
+import { useEnvironmentVariables } from '../config';
+import { useQueryHeaders } from '../contexts';
 import type { IRequestError, IRequestSuccess } from '../request';
 import { HttpMethod, makeRequest } from '../request';
 
@@ -11,7 +12,7 @@ export const useDeleteRequest = <TResponse>() => {
 
   const { API_URL, TIMEOUT } = useEnvironmentVariables();
 
-  const { headers } = useQueryConfig();
+  const { headers } = useQueryHeaders();
 
   const query = useQuery<any, any, IRequestSuccess<TResponse>>(
     [requestPath, {}],

package/src/queries/useGetRequest.ts

@@ -1,7 +1,8 @@
 import type { UseQueryOptions } from '@tanstack/react-query';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { startTransition, useEffect, useMemo, useState } from 'react';
-import { useEnvironmentVariables, useQueryConfig } from '../config';
+import { useEnvironmentVariables } from '../config';
+import { useQueryHeaders } from '../contexts';
 import type { IRequestError, IRequestSuccess } from '../request';
 import { makeRequest } from '../request';
 import type { IPagination, TanstackQueryOption } from './queries.interface';
@@ -22,7 +23,7 @@ export const useGetRequest = <TResponse extends Record<string, any>>({
   const [page, setPage] = useState<number>(1);
 
   const { API_URL, TIMEOUT } = useEnvironmentVariables();
-  const { headers } = useQueryConfig();
+  const { headers } = useQueryHeaders();
 
   let queryClient = useQueryClient();
   // eslint-disable-next-line react-hooks/exhaustive-deps

package/src/queries/usePatchRequest.ts

@@ -3,7 +3,8 @@ import { useMutation } from '@tanstack/react-query';
 import { scrollToTop } from '../helpers';
 import { HttpMethod, makeRequest } from '../request';
 
-import { useEnvironmentVariables, useQueryConfig } from '../config';
+import { useEnvironmentVariables } from '../config';
+import { useQueryHeaders } from '../contexts';
 import type {
   IRequestError,
   IRequestSuccess,
@@ -11,7 +12,7 @@ import type {
 
 export const usePatchRequest = <TResponse>({ path }: { path: string }) => {
   const { API_URL, TIMEOUT } = useEnvironmentVariables();
-  const { headers } = useQueryConfig();
+  const { headers } = useQueryHeaders();
 
   // register post mutation
   const mutation = useMutation<IRequestSuccess<TResponse>, IRequestError>(

package/src/queries/usePostRequest.ts

@@ -1,6 +1,7 @@
 import type { MutateOptions } from '@tanstack/react-query';
 import { useMutation } from '@tanstack/react-query';
-import { useEnvironmentVariables, useQueryConfig } from '../config';
+import { useEnvironmentVariables } from '../config';
+import { useQueryHeaders } from '../contexts';
 import type { IRequestError, IRequestSuccess } from '../request';
 import { HttpMethod, makeRequest } from '../request';
 
@@ -13,7 +14,7 @@ export const usePostRequest = <TResponse>({
 }) => {
   const { API_URL, TIMEOUT } = useEnvironmentVariables();
 
-  const { headers } = useQueryConfig();
+  const { headers } = useQueryHeaders();
 
   // register post mutation
   const mutation = useMutation<IRequestSuccess<TResponse>, IRequestError>(

package/src/types/index.ts

@@ -1,8 +1,6 @@
 import type { RawAxiosRequestHeaders } from 'axios';
 
 export interface TanstackQueryConfig {
-  baseURL: string;
-  timeout?: number;
   headers: RawAxiosRequestHeaders;
 }
 
@@ -10,13 +8,3 @@ export interface IUseQueryHeaders {
   headers: TanstackQueryConfig['headers'];
   setQueryHeaders: (header: TanstackQueryConfig['headers']) => void;
 }
-
-export interface IUseQueryTimeout {
-  timeout: TanstackQueryConfig['timeout'];
-  setQueryTimeout: (timeout: TanstackQueryConfig['timeout']) => void;
-}
-
-export interface IUseQueryBaseURL {
-  baseURL: TanstackQueryConfig['baseURL'];
-  setQueryBaseUrl: (baseURL: TanstackQueryConfig['baseURL']) => void;
-}

package/dist/config/useQueryBaseURL.d.ts

@@ -1,2 +0,0 @@
-import type { IUseQueryBaseURL } from '../types';
-export declare const useQueryBaseURL: () => IUseQueryBaseURL;

package/dist/config/useQueryBaseURL.js

@@ -1,22 +0,0 @@
-'use strict';
-
-var reactQuery = require('@tanstack/react-query');
-var useQueryConfig = require('./useQueryConfig.js');
-
-const useQueryBaseURL = () => {
-    const { baseURL } = useQueryConfig.useQueryConfig();
-    const queryClient = reactQuery.useQueryClient();
-    const setQueryBaseUrl = (newBaseUrl) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = {
-                ...config,
-                baseURL: newBaseUrl,
-            };
-            return newConfig;
-        });
-    };
-    return { baseURL, setQueryBaseUrl };
-};
-
-exports.useQueryBaseURL = useQueryBaseURL;
-//# sourceMappingURL=useQueryBaseURL.js.map

package/dist/config/useQueryBaseURL.js.map

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

package/dist/config/useQueryHeaders.d.ts

@@ -1,2 +0,0 @@
-import type { IUseQueryHeaders } from '../types';
-export declare const useQueryHeaders: () => IUseQueryHeaders;

package/dist/config/useQueryHeaders.js

@@ -1,19 +0,0 @@
-'use strict';
-
-var reactQuery = require('@tanstack/react-query');
-var useQueryConfig = require('./useQueryConfig.js');
-
-const useQueryHeaders = () => {
-    const { headers } = useQueryConfig.useQueryConfig();
-    const queryClient = reactQuery.useQueryClient();
-    const setQueryHeaders = (newHeaders) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = { ...config, headers: newHeaders };
-            return newConfig;
-        });
-    };
-    return { headers, setQueryHeaders };
-};
-
-exports.useQueryHeaders = useQueryHeaders;
-//# sourceMappingURL=useQueryHeaders.js.map

package/dist/config/useQueryTimeout.d.ts

@@ -1,2 +0,0 @@
-import type { IUseQueryTimeout } from '../types';
-export declare const useQueryTimeout: () => IUseQueryTimeout;

package/dist/config/useQueryTimeout.js

@@ -1,19 +0,0 @@
-'use strict';
-
-var reactQuery = require('@tanstack/react-query');
-var useQueryConfig = require('./useQueryConfig.js');
-
-const useQueryTimeout = () => {
-    const { timeout } = useQueryConfig.useQueryConfig();
-    const queryClient = reactQuery.useQueryClient();
-    const setQueryTimeout = (newTimeout) => {
-        queryClient.setQueryData(['config'], (config) => {
-            const newConfig = { ...config, timeout: newTimeout };
-            return newConfig;
-        });
-    };
-    return { timeout, setQueryTimeout };
-};
-
-exports.useQueryTimeout = useQueryTimeout;
-//# sourceMappingURL=useQueryTimeout.js.map

package/dist/config/useQueryTimeout.js.map

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

package/src/config/useQueryBaseURL.ts

@@ -1,21 +0,0 @@
-import { useQueryClient } from '@tanstack/react-query';
-import type { IUseQueryBaseURL, TanstackQueryConfig } from '../types';
-import { useQueryConfig } from './useQueryConfig';
-
-export const useQueryBaseURL = (): IUseQueryBaseURL => {
-  const { baseURL } = useQueryConfig();
-  const queryClient = useQueryClient();
-
-  const setQueryBaseUrl = (newBaseUrl: TanstackQueryConfig['baseURL']) => {
-    queryClient.setQueryData<TanstackQueryConfig>(['config'], (config): any => {
-      const newConfig = {
-        ...config,
-        baseURL: newBaseUrl,
-      };
-
-      return newConfig;
-    });
-  };
-
-  return { baseURL, setQueryBaseUrl };
-};

package/src/config/useQueryHeaders.ts

@@ -1,17 +0,0 @@
-import { useQueryClient } from '@tanstack/react-query';
-import type { IUseQueryHeaders, TanstackQueryConfig } from '../types';
-import { useQueryConfig } from './useQueryConfig';
-
-export const useQueryHeaders = (): IUseQueryHeaders => {
-  const { headers } = useQueryConfig();
-  const queryClient = useQueryClient();
-
-  const setQueryHeaders = (newHeaders: TanstackQueryConfig['headers']) => {
-    queryClient.setQueryData<TanstackQueryConfig>(['config'], (config): any => {
-      const newConfig = { ...config, headers: newHeaders };
-      return newConfig;
-    });
-  };
-
-  return { headers, setQueryHeaders };
-};

package/src/config/useQueryTimeout.ts

@@ -1,18 +0,0 @@
-import { useQueryClient } from '@tanstack/react-query';
-import type { IUseQueryTimeout, TanstackQueryConfig } from '../types';
-import { useQueryConfig } from './useQueryConfig';
-
-export const useQueryTimeout = (): IUseQueryTimeout => {
-  const { timeout } = useQueryConfig();
-  const queryClient = useQueryClient();
-
-  const setQueryTimeout = (newTimeout: TanstackQueryConfig['timeout']) => {
-    queryClient.setQueryData<TanstackQueryConfig>(['config'], (config): any => {
-      const newConfig = { ...config, timeout: newTimeout };
-
-      return newConfig;
-    });
-  };
-
-  return { timeout, setQueryTimeout };
-};