@ventlio/tanstack-query 0.3.1 → 0.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/dist/index.d.ts +2 -0
  2. package/dist/index.js +2 -0
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.mjs +127 -33
  5. package/dist/index.mjs.map +1 -1
  6. package/dist/queries/useDeleteRequest.d.ts +4 -4
  7. package/dist/queries/useDeleteRequest.js +26 -9
  8. package/dist/queries/useDeleteRequest.js.map +1 -1
  9. package/dist/queries/useGetInfiniteRequest.d.ts +4 -4
  10. package/dist/queries/useGetInfiniteRequest.js +21 -4
  11. package/dist/queries/useGetInfiniteRequest.js.map +1 -1
  12. package/dist/queries/useGetRequest.d.ts +4 -4
  13. package/dist/queries/useGetRequest.js +21 -4
  14. package/dist/queries/useGetRequest.js.map +1 -1
  15. package/dist/queries/usePatchRequest.d.ts +8 -8
  16. package/dist/queries/usePatchRequest.js +19 -2
  17. package/dist/queries/usePatchRequest.js.map +1 -1
  18. package/dist/queries/usePostRequest.d.ts +8 -8
  19. package/dist/queries/usePostRequest.js +20 -3
  20. package/dist/queries/usePostRequest.js.map +1 -1
  21. package/dist/stores/index.d.ts +1 -0
  22. package/dist/stores/usePauseFutureRequests.d.ts +7 -0
  23. package/dist/stores/usePauseFutureRequests.js +19 -0
  24. package/dist/stores/usePauseFutureRequests.js.map +1 -0
  25. package/package.json +4 -2
  26. package/src/__tests__/queries/usePostRequest.spec.tsx +84 -0
  27. package/src/index.ts +2 -0
  28. package/src/queries/useDeleteRequest.ts +27 -9
  29. package/src/queries/useGetInfiniteRequest.ts +22 -4
  30. package/src/queries/useGetRequest.ts +22 -4
  31. package/src/queries/usePatchRequest.ts +22 -3
  32. package/src/queries/usePostRequest.ts +22 -4
  33. package/src/stores/index.ts +1 -0
  34. package/src/stores/usePauseFutureRequests.ts +25 -0
  35. package/src/__tests__/queries/usePostRequest.spec.ts +0 -77
package/dist/index.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  export * from './config';
2
2
  export * from './helpers';
3
+ export * from './hooks';
3
4
  export * from './model';
4
5
  export * from './queries';
5
6
  export * from './request';
7
+ export * from './stores';
6
8
  export * from './types';
package/dist/index.js CHANGED
@@ -5,6 +5,7 @@ export { useQueryHeaders } from './config/useQueryHeaders.js';
5
5
  export { useReactNativeEnv } from './config/useReactNativeEnv.js';
6
6
  export { scrollToTop } from './helpers/scrollToTop.js';
7
7
  export { getDateInFuture } from './helpers/timeFuncs.js';
8
+ export { useUploadProgress } from './hooks/useUploadProgress.js';
8
9
  export { useKeyTrackerModel } from './model/useKeyTrackerModel.js';
9
10
  export { useQueryModel } from './model/useQueryModel.js';
10
11
  export { useRefetchQuery } from './model/useRefetchQuery.js';
@@ -18,4 +19,5 @@ export { buildFormData } from './request/buildFormData.js';
18
19
  export { makeRequest } from './request/make-request.js';
19
20
  export { ContentType, HttpMethod } from './request/request.enum.js';
20
21
  export { errorTransformer, successTransformer } from './request/transformer.js';
22
+ export { usePauseFutureRequests } from './stores/usePauseFutureRequests.js';
21
23
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}
package/dist/index.mjs CHANGED
@@ -1,9 +1,10 @@
1
1
  import 'url-search-params-polyfill';
2
2
  import { useQueryClient, useQuery, useInfiniteQuery, useMutation } from '@tanstack/react-query';
3
+ import { useState, useEffect, useMemo, startTransition } from 'react';
3
4
  import result from 'lodash.result';
4
5
  import lodashSet from 'lodash.set';
5
- import { useState, useMemo, useEffect, startTransition } from 'react';
6
6
  import axios from 'axios';
7
+ import { create } from 'zustand';
7
8
 
8
9
  const bootstrapQueryRequest = (queryClient, options) => {
9
10
  // make query config doesn't expire
@@ -84,6 +85,16 @@ function getDateInFuture(days) {
84
85
  return date.getTime();
85
86
  }
86
87
 
88
+ const useUploadProgress = () => {
89
+ const [uploadProgressPercent, setUploadProgressPercent] = useState(0);
90
+ const onUploadProgress = (progressEvent) => {
91
+ const { loaded, total } = progressEvent;
92
+ const percentage = Math.round((loaded / total) * 100);
93
+ setUploadProgressPercent(percentage);
94
+ };
95
+ return { onUploadProgress, uploadProgressPercent };
96
+ };
97
+
87
98
  const useKeyTrackerModel = (keyTracker) => {
88
99
  const queryClient = useQueryClient();
89
100
  const getQueryKey = (innerKeyTracker) => {
@@ -391,11 +402,28 @@ function getAppFiles(body, fileSelectors = []) {
391
402
  return files;
392
403
  }
393
404
 
405
+ const usePauseFutureRequests = create((set) => {
406
+ const pauseFutureQueries = (status) => {
407
+ return set({ isFutureQueriesPaused: status });
408
+ };
409
+ const pauseFutureMutation = (status) => {
410
+ return set({ isFutureQueriesPaused: status });
411
+ };
412
+ return {
413
+ isFutureMutationsPaused: false,
414
+ isFutureQueriesPaused: false,
415
+ pauseFutureQueries,
416
+ pauseFutureMutation,
417
+ };
418
+ });
419
+
394
420
  const useDeleteRequest = (deleteOptions) => {
395
421
  const { baseUrl, headers } = deleteOptions ?? {};
396
422
  const [requestPath, setRequestPath] = useState('');
397
423
  const [options, setOptions] = useState();
398
424
  const { options: queryConfigOptions } = useQueryConfig();
425
+ const [requestPayload, setRequestPayload] = useState();
426
+ const isFutureQueriesPaused = usePauseFutureRequests((state) => state.isFutureQueriesPaused);
399
427
  const { API_URL, TIMEOUT } = useEnvironmentVariables();
400
428
  const { getHeaders } = useQueryHeaders();
401
429
  const sendRequest = async (res, rej, queryKey) => {
@@ -407,6 +435,7 @@ const useDeleteRequest = (deleteOptions) => {
407
435
  path: requestUrl,
408
436
  headers: { ...globalHeaders, ...headers },
409
437
  baseURL: baseUrl ?? API_URL,
438
+ method: HttpMethod.DELETE,
410
439
  timeout: TIMEOUT,
411
440
  };
412
441
  let shouldContinue = true;
@@ -434,14 +463,27 @@ const useDeleteRequest = (deleteOptions) => {
434
463
  return setOptions(fetchOptions);
435
464
  };
436
465
  const destroy = async (link, internalDeleteOptions) => {
437
- // set enabled to be true for every delete
438
- internalDeleteOptions = internalDeleteOptions ?? {};
439
- internalDeleteOptions.enabled = true;
440
- await setOptionsAsync(internalDeleteOptions);
441
- await updatedPathAsync(link);
442
- return query.data;
443
- };
444
- return { destroy, ...query };
466
+ if (!isFutureQueriesPaused) {
467
+ // set enabled to be true for every delete
468
+ internalDeleteOptions = internalDeleteOptions ?? {};
469
+ internalDeleteOptions.enabled = true;
470
+ await setOptionsAsync(internalDeleteOptions);
471
+ await updatedPathAsync(link);
472
+ return query.data;
473
+ }
474
+ else {
475
+ setRequestPayload({ link, internalDeleteOptions });
476
+ return undefined;
477
+ }
478
+ };
479
+ useEffect(() => {
480
+ if (!isFutureQueriesPaused && requestPayload) {
481
+ destroy(requestPayload.link, requestPayload.internalDeleteOptions);
482
+ setRequestPayload(undefined);
483
+ }
484
+ // eslint-disable-next-line react-hooks/exhaustive-deps
485
+ }, [isFutureQueriesPaused]);
486
+ return { destroy, ...query, isLoading: query.isLoading || isFutureQueriesPaused };
445
487
  };
446
488
 
447
489
  const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl, headers, }) => {
@@ -450,6 +492,8 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
450
492
  const [requestPath, setRequestPath] = useState(path);
451
493
  const [options, setOptions] = useState(queryOptions);
452
494
  const { options: queryConfigOptions } = useQueryConfig();
495
+ const [requestPayload, setRequestPayload] = useState();
496
+ const isFutureQueriesPaused = usePauseFutureRequests((state) => state.isFutureQueriesPaused);
453
497
  let queryClient = useQueryClient();
454
498
  // eslint-disable-next-line react-hooks/exhaustive-deps
455
499
  queryClient = useMemo(() => queryClient, []);
@@ -496,7 +540,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
496
540
  return pathname + '?' + queryParams.toString();
497
541
  };
498
542
  const query = useInfiniteQuery([requestPath, {}], ({ pageParam = requestPath, queryKey }) => new Promise((res, rej) => sendRequest(res, rej, queryKey, pageParam)), {
499
- enabled: load,
543
+ enabled: load && !isFutureQueriesPaused,
500
544
  getNextPageParam: (lastPage) => constructPaginationLink('next_page', lastPage),
501
545
  getPreviousPageParam: (lastPage) => constructPaginationLink('previous_page', lastPage),
502
546
  ...options,
@@ -507,10 +551,23 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
507
551
  });
508
552
  };
509
553
  const get = async (link, fetchOptions) => {
510
- await setOptionsAsync(fetchOptions);
511
- await updatedPathAsync(link);
512
- return query.data;
554
+ if (!isFutureQueriesPaused) {
555
+ await setOptionsAsync(fetchOptions);
556
+ await updatedPathAsync(link);
557
+ return query.data;
558
+ }
559
+ else {
560
+ setRequestPayload({ link, fetchOptions });
561
+ return undefined;
562
+ }
513
563
  };
564
+ useEffect(() => {
565
+ if (!isFutureQueriesPaused && requestPayload) {
566
+ get(requestPayload.link, requestPayload.fetchOptions);
567
+ setRequestPayload(undefined);
568
+ }
569
+ // eslint-disable-next-line react-hooks/exhaustive-deps
570
+ }, [isFutureQueriesPaused]);
514
571
  const updatedPathAsync = async (link) => {
515
572
  startTransition(() => {
516
573
  setRequestPath(link);
@@ -529,6 +586,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
529
586
  return {
530
587
  get,
531
588
  ...query,
589
+ isLoading: query.isLoading || isFutureQueriesPaused,
532
590
  };
533
591
  };
534
592
 
@@ -539,6 +597,8 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
539
597
  const { API_URL, TIMEOUT } = useEnvironmentVariables();
540
598
  const { getHeaders } = useQueryHeaders();
541
599
  const { options: queryConfigOptions } = useQueryConfig();
600
+ const [requestPayload, setRequestPayload] = useState();
601
+ const isFutureQueriesPaused = usePauseFutureRequests((state) => state.isFutureQueriesPaused);
542
602
  let queryClient = useQueryClient();
543
603
  // eslint-disable-next-line react-hooks/exhaustive-deps
544
604
  queryClient = useMemo(() => queryClient, []);
@@ -576,7 +636,7 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
576
636
  }
577
637
  };
578
638
  const query = useQuery([requestPath, {}], ({ queryKey }) => new Promise((res, rej) => sendRequest(res, rej, queryKey)), {
579
- enabled: load,
639
+ enabled: load && !isFutureQueriesPaused,
580
640
  ...options,
581
641
  });
582
642
  useEffect(() => {
@@ -636,12 +696,26 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
636
696
  });
637
697
  };
638
698
  const get = async (link, fetchOptions) => {
639
- await setOptionsAsync(fetchOptions);
640
- await updatedPathAsync(link);
641
- return query.data;
699
+ if (!isFutureQueriesPaused) {
700
+ await setOptionsAsync(fetchOptions);
701
+ await updatedPathAsync(link);
702
+ return query.data;
703
+ }
704
+ else {
705
+ setRequestPayload({ link, fetchOptions });
706
+ return undefined;
707
+ }
642
708
  };
709
+ useEffect(() => {
710
+ if (!isFutureQueriesPaused && requestPayload) {
711
+ get(requestPayload.link, requestPayload.fetchOptions);
712
+ setRequestPayload(undefined);
713
+ }
714
+ // eslint-disable-next-line react-hooks/exhaustive-deps
715
+ }, [isFutureQueriesPaused]);
643
716
  return {
644
717
  ...query,
718
+ isLoading: query.isLoading || isFutureQueriesPaused,
645
719
  setRequestPath,
646
720
  nextPage,
647
721
  prevPage,
@@ -652,19 +726,11 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
652
726
  };
653
727
  };
654
728
 
655
- const useUploadProgress = () => {
656
- const [uploadProgressPercent, setUploadProgressPercent] = useState(0);
657
- const onUploadProgress = (progressEvent) => {
658
- const { loaded, total } = progressEvent;
659
- const percentage = Math.round((loaded / total) * 100);
660
- setUploadProgressPercent(percentage);
661
- };
662
- return { onUploadProgress, uploadProgressPercent };
663
- };
664
-
665
729
  const usePatchRequest = ({ path, baseUrl, headers }) => {
666
730
  const { API_URL, TIMEOUT } = useEnvironmentVariables();
667
731
  const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
732
+ const [requestPayload, setRequestPayload] = useState();
733
+ const isFutureMutationsPaused = usePauseFutureRequests((state) => state.isFutureMutationsPaused);
668
734
  const { getHeaders } = useQueryHeaders();
669
735
  const config = useQueryConfig();
670
736
  const sendRequest = async (res, rej, data) => {
@@ -712,9 +778,22 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
712
778
  return sendRequest(res, rej, dataData);
713
779
  }), { mutationKey: [path, { type: 'mutation' }] });
714
780
  const patch = async (data, options) => {
715
- return mutation.mutateAsync(data, options);
781
+ if (!isFutureMutationsPaused) {
782
+ return mutation.mutateAsync(data, options);
783
+ }
784
+ else {
785
+ setRequestPayload({ data, options });
786
+ return undefined;
787
+ }
716
788
  };
717
- return { patch, uploadProgressPercent, ...mutation };
789
+ useEffect(() => {
790
+ if (!isFutureMutationsPaused && requestPayload) {
791
+ patch(requestPayload.data, requestPayload.options);
792
+ setRequestPayload(undefined);
793
+ }
794
+ // eslint-disable-next-line react-hooks/exhaustive-deps
795
+ }, [isFutureMutationsPaused]);
796
+ return { patch, uploadProgressPercent, ...mutation, isLoading: mutation.isLoading || isFutureMutationsPaused };
718
797
  };
719
798
 
720
799
  const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelectors, }) => {
@@ -723,6 +802,8 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
723
802
  const { getHeaders } = useQueryHeaders();
724
803
  const { isApp } = useReactNativeEnv();
725
804
  const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
805
+ const [requestPayload, setRequestPayload] = useState();
806
+ const isFutureMutationsPaused = usePauseFutureRequests((state) => state.isFutureMutationsPaused);
726
807
  const sendRequest = async (res, rej, postData) => {
727
808
  // get request headers
728
809
  const globalHeaders = getHeaders();
@@ -776,11 +857,24 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
776
857
  mutationKey: [path, { type: 'mutation' }],
777
858
  });
778
859
  const post = async (data, options) => {
779
- const { requestConfig, ...otherOptions } = options ?? {};
780
- return mutation.mutateAsync({ data, requestConfig }, otherOptions);
860
+ if (!isFutureMutationsPaused) {
861
+ const { requestConfig, ...otherOptions } = options ?? {};
862
+ return mutation.mutateAsync({ data, requestConfig }, otherOptions);
863
+ }
864
+ else {
865
+ setRequestPayload({ data, options });
866
+ return undefined;
867
+ }
781
868
  };
782
- return { post, uploadProgressPercent, ...mutation };
869
+ useEffect(() => {
870
+ if (!isFutureMutationsPaused && requestPayload) {
871
+ post(requestPayload.data, requestPayload.options);
872
+ setRequestPayload(undefined);
873
+ }
874
+ // eslint-disable-next-line react-hooks/exhaustive-deps
875
+ }, [isFutureMutationsPaused]);
876
+ return { post, uploadProgressPercent, ...mutation, isLoading: mutation.isLoading || isFutureMutationsPaused };
783
877
  };
784
878
 
785
- export { ContentType, HttpMethod, axiosInstance, bootstrapQueryRequest, buildFormData, errorTransformer, getDateInFuture, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetInfiniteRequest, useGetRequest, useKeyTrackerModel, usePatchRequest, usePostRequest, useQueryConfig, useQueryHeaders, useQueryModel, useReactNativeEnv, useRefetchQuery };
879
+ export { ContentType, HttpMethod, axiosInstance, bootstrapQueryRequest, buildFormData, errorTransformer, getDateInFuture, makeRequest, scrollToTop, successTransformer, useDeleteRequest, useEnvironmentVariables, useGetInfiniteRequest, useGetRequest, useKeyTrackerModel, usePatchRequest, usePauseFutureRequests, usePostRequest, useQueryConfig, useQueryHeaders, useQueryModel, useReactNativeEnv, useRefetchQuery, useUploadProgress };
786
880
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -2,10 +2,10 @@ import type { UseQueryOptions } from '@tanstack/react-query';
2
2
  import type { IRequestError, IRequestSuccess } from '../request';
3
3
  import type { DefaultRequestOptions } from './queries.interface';
4
4
  export declare const useDeleteRequest: <TResponse>(deleteOptions?: DefaultRequestOptions) => {
5
+ isLoading: boolean;
5
6
  data: IRequestSuccess<TResponse>;
6
7
  error: any;
7
8
  isError: true;
8
- isLoading: false;
9
9
  isLoadingError: false;
10
10
  isRefetchError: true;
11
11
  isSuccess: false;
@@ -31,10 +31,10 @@ export declare const useDeleteRequest: <TResponse>(deleteOptions?: DefaultReques
31
31
  cached?: boolean | undefined;
32
32
  }) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
33
33
  } | {
34
+ isLoading: boolean;
34
35
  data: IRequestSuccess<TResponse>;
35
36
  error: null;
36
37
  isError: false;
37
- isLoading: false;
38
38
  isLoadingError: false;
39
39
  isRefetchError: false;
40
40
  isSuccess: true;
@@ -60,10 +60,10 @@ export declare const useDeleteRequest: <TResponse>(deleteOptions?: DefaultReques
60
60
  cached?: boolean | undefined;
61
61
  }) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
62
62
  } | {
63
+ isLoading: boolean;
63
64
  data: undefined;
64
65
  error: any;
65
66
  isError: true;
66
- isLoading: false;
67
67
  isLoadingError: true;
68
68
  isRefetchError: false;
69
69
  isSuccess: false;
@@ -89,10 +89,10 @@ export declare const useDeleteRequest: <TResponse>(deleteOptions?: DefaultReques
89
89
  cached?: boolean | undefined;
90
90
  }) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
91
91
  } | {
92
+ isLoading: boolean;
92
93
  data: undefined;
93
94
  error: null;
94
95
  isError: false;
95
- isLoading: true;
96
96
  isLoadingError: false;
97
97
  isRefetchError: false;
98
98
  isSuccess: false;
@@ -1,18 +1,21 @@
1
1
  import { useQuery } from '@tanstack/react-query';
2
- import { useState } from 'react';
2
+ import { useState, useEffect } from 'react';
3
3
  import 'url-search-params-polyfill';
4
4
  import { useEnvironmentVariables } from '../config/useEnvironmentVariables.js';
5
5
  import { useQueryConfig } from '../config/useQueryConfig.js';
6
6
  import { useQueryHeaders } from '../config/useQueryHeaders.js';
7
7
  import 'axios';
8
8
  import { makeRequest } from '../request/make-request.js';
9
- import '../request/request.enum.js';
9
+ import { HttpMethod } from '../request/request.enum.js';
10
+ import { usePauseFutureRequests } from '../stores/usePauseFutureRequests.js';
10
11
 
11
12
  const useDeleteRequest = (deleteOptions) => {
12
13
  const { baseUrl, headers } = deleteOptions ?? {};
13
14
  const [requestPath, setRequestPath] = useState('');
14
15
  const [options, setOptions] = useState();
15
16
  const { options: queryConfigOptions } = useQueryConfig();
17
+ const [requestPayload, setRequestPayload] = useState();
18
+ const isFutureQueriesPaused = usePauseFutureRequests((state) => state.isFutureQueriesPaused);
16
19
  const { API_URL, TIMEOUT } = useEnvironmentVariables();
17
20
  const { getHeaders } = useQueryHeaders();
18
21
  const sendRequest = async (res, rej, queryKey) => {
@@ -24,6 +27,7 @@ const useDeleteRequest = (deleteOptions) => {
24
27
  path: requestUrl,
25
28
  headers: { ...globalHeaders, ...headers },
26
29
  baseURL: baseUrl ?? API_URL,
30
+ method: HttpMethod.DELETE,
27
31
  timeout: TIMEOUT,
28
32
  };
29
33
  let shouldContinue = true;
@@ -51,14 +55,27 @@ const useDeleteRequest = (deleteOptions) => {
51
55
  return setOptions(fetchOptions);
52
56
  };
53
57
  const destroy = async (link, internalDeleteOptions) => {
54
- // set enabled to be true for every delete
55
- internalDeleteOptions = internalDeleteOptions ?? {};
56
- internalDeleteOptions.enabled = true;
57
- await setOptionsAsync(internalDeleteOptions);
58
- await updatedPathAsync(link);
59
- return query.data;
58
+ if (!isFutureQueriesPaused) {
59
+ // set enabled to be true for every delete
60
+ internalDeleteOptions = internalDeleteOptions ?? {};
61
+ internalDeleteOptions.enabled = true;
62
+ await setOptionsAsync(internalDeleteOptions);
63
+ await updatedPathAsync(link);
64
+ return query.data;
65
+ }
66
+ else {
67
+ setRequestPayload({ link, internalDeleteOptions });
68
+ return undefined;
69
+ }
60
70
  };
61
- return { destroy, ...query };
71
+ useEffect(() => {
72
+ if (!isFutureQueriesPaused && requestPayload) {
73
+ destroy(requestPayload.link, requestPayload.internalDeleteOptions);
74
+ setRequestPayload(undefined);
75
+ }
76
+ // eslint-disable-next-line react-hooks/exhaustive-deps
77
+ }, [isFutureQueriesPaused]);
78
+ return { destroy, ...query, isLoading: query.isLoading || isFutureQueriesPaused };
62
79
  };
63
80
 
64
81
  export { useDeleteRequest };
@@ -1 +1 @@
1
- {"version":3,"file":"useDeleteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"useDeleteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -17,10 +17,10 @@ export declare const useGetInfiniteRequest: <TResponse extends Record<string, an
17
17
  }> | undefined;
18
18
  keyTracker?: string | undefined;
19
19
  } & DefaultRequestOptions) => {
20
+ isLoading: boolean;
20
21
  data: undefined;
21
22
  error: any;
22
23
  isError: true;
23
- isLoading: false;
24
24
  isLoadingError: true;
25
25
  isRefetchError: false;
26
26
  isSuccess: false;
@@ -58,10 +58,10 @@ export declare const useGetInfiniteRequest: <TResponse extends Record<string, an
58
58
  pagination: Pagination;
59
59
  }>> | undefined>;
60
60
  } | {
61
+ isLoading: boolean;
61
62
  data: undefined;
62
63
  error: null;
63
64
  isError: false;
64
- isLoading: true;
65
65
  isLoadingError: false;
66
66
  isRefetchError: false;
67
67
  isSuccess: false;
@@ -99,12 +99,12 @@ export declare const useGetInfiniteRequest: <TResponse extends Record<string, an
99
99
  pagination: Pagination;
100
100
  }>> | undefined>;
101
101
  } | {
102
+ isLoading: boolean;
102
103
  data: InfiniteData<IRequestSuccess<TResponse & {
103
104
  pagination: Pagination;
104
105
  }>>;
105
106
  error: any;
106
107
  isError: true;
107
- isLoading: false;
108
108
  isLoadingError: false;
109
109
  isRefetchError: true;
110
110
  isSuccess: false;
@@ -142,12 +142,12 @@ export declare const useGetInfiniteRequest: <TResponse extends Record<string, an
142
142
  pagination: Pagination;
143
143
  }>> | undefined>;
144
144
  } | {
145
+ isLoading: boolean;
145
146
  data: InfiniteData<IRequestSuccess<TResponse & {
146
147
  pagination: Pagination;
147
148
  }>>;
148
149
  error: null;
149
150
  isError: false;
150
- isLoading: false;
151
151
  isLoadingError: false;
152
152
  isRefetchError: false;
153
153
  isSuccess: true;
@@ -7,6 +7,7 @@ import { useQueryHeaders } from '../config/useQueryHeaders.js';
7
7
  import 'axios';
8
8
  import { makeRequest } from '../request/make-request.js';
9
9
  import '../request/request.enum.js';
10
+ import { usePauseFutureRequests } from '../stores/usePauseFutureRequests.js';
10
11
 
11
12
  const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl, headers, }) => {
12
13
  const { API_URL, TIMEOUT } = useEnvironmentVariables();
@@ -14,6 +15,8 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
14
15
  const [requestPath, setRequestPath] = useState(path);
15
16
  const [options, setOptions] = useState(queryOptions);
16
17
  const { options: queryConfigOptions } = useQueryConfig();
18
+ const [requestPayload, setRequestPayload] = useState();
19
+ const isFutureQueriesPaused = usePauseFutureRequests((state) => state.isFutureQueriesPaused);
17
20
  let queryClient = useQueryClient();
18
21
  // eslint-disable-next-line react-hooks/exhaustive-deps
19
22
  queryClient = useMemo(() => queryClient, []);
@@ -60,7 +63,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
60
63
  return pathname + '?' + queryParams.toString();
61
64
  };
62
65
  const query = useInfiniteQuery([requestPath, {}], ({ pageParam = requestPath, queryKey }) => new Promise((res, rej) => sendRequest(res, rej, queryKey, pageParam)), {
63
- enabled: load,
66
+ enabled: load && !isFutureQueriesPaused,
64
67
  getNextPageParam: (lastPage) => constructPaginationLink('next_page', lastPage),
65
68
  getPreviousPageParam: (lastPage) => constructPaginationLink('previous_page', lastPage),
66
69
  ...options,
@@ -71,10 +74,23 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
71
74
  });
72
75
  };
73
76
  const get = async (link, fetchOptions) => {
74
- await setOptionsAsync(fetchOptions);
75
- await updatedPathAsync(link);
76
- return query.data;
77
+ if (!isFutureQueriesPaused) {
78
+ await setOptionsAsync(fetchOptions);
79
+ await updatedPathAsync(link);
80
+ return query.data;
81
+ }
82
+ else {
83
+ setRequestPayload({ link, fetchOptions });
84
+ return undefined;
85
+ }
77
86
  };
87
+ useEffect(() => {
88
+ if (!isFutureQueriesPaused && requestPayload) {
89
+ get(requestPayload.link, requestPayload.fetchOptions);
90
+ setRequestPayload(undefined);
91
+ }
92
+ // eslint-disable-next-line react-hooks/exhaustive-deps
93
+ }, [isFutureQueriesPaused]);
78
94
  const updatedPathAsync = async (link) => {
79
95
  startTransition(() => {
80
96
  setRequestPath(link);
@@ -93,6 +109,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
93
109
  return {
94
110
  get,
95
111
  ...query,
112
+ isLoading: query.isLoading || isFutureQueriesPaused,
96
113
  };
97
114
  };
98
115
 
@@ -1 +1 @@
1
- {"version":3,"file":"useGetInfiniteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"useGetInfiniteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -8,6 +8,7 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
8
8
  queryOptions?: TanstackQueryOption<TResponse> | undefined;
9
9
  keyTracker?: string | undefined;
10
10
  } & DefaultRequestOptions) => {
11
+ isLoading: boolean;
11
12
  setRequestPath: import("react").Dispatch<import("react").SetStateAction<string>>;
12
13
  nextPage: () => void;
13
14
  prevPage: () => void;
@@ -18,7 +19,6 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
18
19
  data: IRequestSuccess<TResponse>;
19
20
  error: any;
20
21
  isError: true;
21
- isLoading: false;
22
22
  isLoadingError: false;
23
23
  isRefetchError: true;
24
24
  isSuccess: false;
@@ -41,6 +41,7 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
41
41
  remove: () => void;
42
42
  fetchStatus: import("@tanstack/react-query").FetchStatus;
43
43
  } | {
44
+ isLoading: boolean;
44
45
  setRequestPath: import("react").Dispatch<import("react").SetStateAction<string>>;
45
46
  nextPage: () => void;
46
47
  prevPage: () => void;
@@ -51,7 +52,6 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
51
52
  data: IRequestSuccess<TResponse>;
52
53
  error: null;
53
54
  isError: false;
54
- isLoading: false;
55
55
  isLoadingError: false;
56
56
  isRefetchError: false;
57
57
  isSuccess: true;
@@ -74,6 +74,7 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
74
74
  remove: () => void;
75
75
  fetchStatus: import("@tanstack/react-query").FetchStatus;
76
76
  } | {
77
+ isLoading: boolean;
77
78
  setRequestPath: import("react").Dispatch<import("react").SetStateAction<string>>;
78
79
  nextPage: () => void;
79
80
  prevPage: () => void;
@@ -84,7 +85,6 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
84
85
  data: undefined;
85
86
  error: any;
86
87
  isError: true;
87
- isLoading: false;
88
88
  isLoadingError: true;
89
89
  isRefetchError: false;
90
90
  isSuccess: false;
@@ -107,6 +107,7 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
107
107
  remove: () => void;
108
108
  fetchStatus: import("@tanstack/react-query").FetchStatus;
109
109
  } | {
110
+ isLoading: boolean;
110
111
  setRequestPath: import("react").Dispatch<import("react").SetStateAction<string>>;
111
112
  nextPage: () => void;
112
113
  prevPage: () => void;
@@ -117,7 +118,6 @@ export declare const useGetRequest: <TResponse extends Record<string, any>>({ pa
117
118
  data: undefined;
118
119
  error: null;
119
120
  isError: false;
120
- isLoading: true;
121
121
  isLoadingError: false;
122
122
  isRefetchError: false;
123
123
  isSuccess: false;