@ventlio/tanstack-query 0.2.33 → 0.2.35

package/README.md

@@ -10,6 +10,8 @@ But we were not discouraged. So, we set out to find a solution which led to the
 
 ---
 
+> Please note that this package is still being developed and may not function as expected. We are working to refine its implementation structure to meet a functional standard. The documentation may not align with the current implementation, so if you encounter any difficulties while setting up the package, please raise an issue in the GitHub repository. We appreciate your patience and understanding as we work to improve this package.
+
 ## Install
 
 > You must install @tanstack/react-query and axios first to use this package
@@ -28,10 +30,22 @@ $ npm install @ventlio/tanstack-query
 $ yarn add @ventlio/tanstack-query
 ```
 
+
 ## Getting Started
 
 Follow the below instructions to have the package running on your project
 
+### Set the environment variables
+```env
+# For ReactJS
+REACT_APP_API_URL='https://build.ventlio.com'
+REACT_APP_API_TIMEOUT=300000
+
+# For NextJS
+NEXT_PUBLIC_API_URL='https://build.ventlio.com'
+NEXT_PUBLIC_API_TIMEOUT=300000
+
+```
 ```js
 import { QueryClient } from '@tanstack/react-query';
 import { TanstackQueryConfig } from '@ventlio/tanstack-query';
@@ -44,8 +58,6 @@ queryClient.setQueryData <
   TanstackQueryConfig >
   (['config'],
   {
-    baseURL: 'https://pokeapi.co/api/v2',
-    timeout: 10000,
     headers: {
       Authorization: `Bearer Hello`,
     },
@@ -78,9 +90,7 @@ import {
 } from '@ventlio/tanstack-query';
 
 function LoginPage() {
-  const { baseURL, setQueryBaseUrl } = useQueryBaseURL();
   const { headers, setQueryHeaders } = useQueryHeaders();
-  const { timeout, setQueryTimeout } = useQueryTimeout();
 
   useEffect(() => {
     // after user has logged in successfully set the authorization header token

package/dist/config/bootstrapQueryRequest.d.ts

@@ -0,0 +1,2 @@
+import type { QueryClient } from '@tanstack/react-query';
+export declare const bootstrapQueryRequest: (queryClient: QueryClient) => void;

package/dist/config/bootstrapQueryRequest.js

@@ -0,0 +1,18 @@
+'use strict';
+
+const bootstrapQueryRequest = (queryClient) => {
+    // make query config doesn't expire
+    queryClient.setQueryDefaults(['config'], {
+        staleTime: Infinity,
+        cacheTime: Infinity,
+    });
+    // set default query confg
+    queryClient.setQueryData(['config'], {
+        headers: {
+            Authorization: ``,
+        },
+    });
+};
+
+exports.bootstrapQueryRequest = bootstrapQueryRequest;
+//# sourceMappingURL=bootstrapQueryRequest.js.map

package/dist/config/bootstrapQueryRequest.js.map

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

package/dist/config/index.d.ts

@@ -1,3 +1,4 @@
+export * from './bootstrapQueryRequest';
 export * from './config.interface';
 export * from './useEnvironmentVariables';
 export * from './useQueryConfig';

package/dist/config/useQueryHeaders.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var reactQuery = require('@tanstack/react-query');
+var timeFuncs = require('../helpers/timeFuncs.js');
 
 const useQueryHeaders = () => {
     const queryClient = reactQuery.useQueryClient();
@@ -18,7 +19,9 @@ const useQueryHeaders = () => {
         queryClient.setQueryData(['config'], (config) => {
             const newConfig = { ...config, headers: newHeaders };
             return newConfig;
-        }, {});
+        }, {
+            updatedAt: timeFuncs.getDateInFuture(2),
+        });
     };
     return { setQueryHeaders, getHeaders };
 };

package/dist/config/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/helpers/index.d.ts

@@ -1 +1,2 @@
 export * from './scrollToTop';
+export * from './timeFuncs';

package/dist/helpers/timeFuncs.d.ts

@@ -0,0 +1 @@
+export declare function getDateInFuture(days: number): number;

package/dist/helpers/timeFuncs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+function getDateInFuture(days) {
+    // Create a new Date object
+    const date = new Date();
+    // Add the specified number of days to the date
+    date.setDate(date.getDate() + days);
+    // Get the Unix timestamp of the date (in milliseconds)
+    return date.getTime();
+}
+
+exports.getDateInFuture = getDateInFuture;
+//# sourceMappingURL=timeFuncs.js.map

package/dist/helpers/timeFuncs.js.map

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

package/dist/index.js

@@ -1,9 +1,11 @@
 'use strict';
 
+var bootstrapQueryRequest = require('./config/bootstrapQueryRequest.js');
 var useEnvironmentVariables = require('./config/useEnvironmentVariables.js');
 var useQueryConfig = require('./config/useQueryConfig.js');
 var useQueryHeaders = require('./config/useQueryHeaders.js');
 var scrollToTop = require('./helpers/scrollToTop.js');
+var timeFuncs = require('./helpers/timeFuncs.js');
 var useKeyTrackerModel = require('./model/useKeyTrackerModel.js');
 var useQueryModel = require('./model/useQueryModel.js');
 var useRefetchQuery = require('./model/useRefetchQuery.js');
@@ -19,10 +21,12 @@ var transformer = require('./request/transformer.js');
 
 
 
+exports.bootstrapQueryRequest = bootstrapQueryRequest.bootstrapQueryRequest;
 exports.useEnvironmentVariables = useEnvironmentVariables.useEnvironmentVariables;
 exports.useQueryConfig = useQueryConfig.useQueryConfig;
 exports.useQueryHeaders = useQueryHeaders.useQueryHeaders;
 exports.scrollToTop = scrollToTop.scrollToTop;
+exports.getDateInFuture = timeFuncs.getDateInFuture;
 exports.useKeyTrackerModel = useKeyTrackerModel.useKeyTrackerModel;
 exports.useQueryModel = useQueryModel.useQueryModel;
 exports.useRefetchQuery = useRefetchQuery.useRefetchQuery;

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

@@ -2,6 +2,20 @@ import { useQueryClient, useQuery, useMutation } from '@tanstack/react-query';
 import { useState, useMemo, useEffect, startTransition } from 'react';
 import axios from 'axios';
 
+const bootstrapQueryRequest = (queryClient) => {
+    // make query config doesn't expire
+    queryClient.setQueryDefaults(['config'], {
+        staleTime: Infinity,
+        cacheTime: Infinity,
+    });
+    // set default query confg
+    queryClient.setQueryData(['config'], {
+        headers: {
+            Authorization: ``,
+        },
+    });
+};
+
 const useEnvironmentVariables = () => {
     const url = process.env.REACT_APP_API_URL || process.env.NEXT_PUBLIC_API_URL;
     const timeout = process.env.REACT_APP_API_TIMEOUT || process.env.NEXT_PUBLIC_API_TIMEOUT;
@@ -17,6 +31,22 @@ const useQueryConfig = () => {
     return { headers };
 };
 
+const scrollToTop = () => {
+    window.scrollTo({
+        top: 0,
+        behavior: 'smooth',
+    });
+};
+
+function getDateInFuture(days) {
+    // Create a new Date object
+    const date = new Date();
+    // Add the specified number of days to the date
+    date.setDate(date.getDate() + days);
+    // Get the Unix timestamp of the date (in milliseconds)
+    return date.getTime();
+}
+
 const useQueryHeaders = () => {
     const queryClient = useQueryClient();
     const getHeaders = () => {
@@ -33,18 +63,13 @@ const useQueryHeaders = () => {
         queryClient.setQueryData(['config'], (config) => {
             const newConfig = { ...config, headers: newHeaders };
             return newConfig;
-        }, {});
+        }, {
+            updatedAt: getDateInFuture(2),
+        });
     };
     return { setQueryHeaders, getHeaders };
 };
 
-const scrollToTop = () => {
-    window.scrollTo({
-        top: 0,
-        behavior: 'smooth',
-    });
-};
-
 const useKeyTrackerModel = (keyTracker) => {
     const queryClient = useQueryClient();
     const [data, setData] = useState();
@@ -404,5 +429,5 @@ const usePostRequest = ({ path, isFormData = false, }) => {
     return { post, ...mutation };
 };
 
-export { ContentType, HttpMethod, axiosInstance, buildFormData, errorTransformer, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetRequest, useKeyTrackerModel, usePatchRequest, usePostRequest, useQueryConfig, useQueryHeaders, useQueryModel, useRefetchQuery };
+export { ContentType, HttpMethod, axiosInstance, bootstrapQueryRequest, buildFormData, errorTransformer, getDateInFuture, 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/package.json

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

package/src/config/bootstrapQueryRequest.ts

@@ -0,0 +1,17 @@
+import type { QueryClient } from '@tanstack/react-query';
+import type { TanstackQueryConfig } from '../types';
+
+export const bootstrapQueryRequest = (queryClient: QueryClient): void => {
+  // make query config doesn't expire
+  queryClient.setQueryDefaults(['config'], {
+    staleTime: Infinity,
+    cacheTime: Infinity,
+  });
+
+  // set default query confg
+  queryClient.setQueryData<TanstackQueryConfig>(['config'], {
+    headers: {
+      Authorization: ``,
+    },
+  });
+};

package/src/config/index.ts

@@ -1,3 +1,4 @@
+export * from './bootstrapQueryRequest';
 export * from './config.interface';
 export * from './useEnvironmentVariables';
 export * from './useQueryConfig';

package/src/config/useQueryHeaders.ts

@@ -1,4 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query';
+import { getDateInFuture } from '../helpers';
 import type { IUseQueryHeaders, TanstackQueryConfig } from '../types';
 
 export const useQueryHeaders = (): IUseQueryHeaders => {
@@ -23,7 +24,9 @@ export const useQueryHeaders = (): IUseQueryHeaders => {
         const newConfig = { ...config, headers: newHeaders };
         return newConfig;
       },
-      {}
+      {
+        updatedAt: getDateInFuture(2),
+      }
     );
   };
 

package/src/helpers/index.ts

@@ -1 +1,2 @@
 export * from './scrollToTop';
+export * from './timeFuncs';

package/src/helpers/timeFuncs.ts

@@ -0,0 +1,10 @@
+export function getDateInFuture(days: number) {
+  // Create a new Date object
+  const date = new Date();
+
+  // Add the specified number of days to the date
+  date.setDate(date.getDate() + days);
+
+  // Get the Unix timestamp of the date (in milliseconds)
+  return date.getTime();
+}