@ventlio/tanstack-query 0.2.87 → 0.3.0
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.
- package/dist/config/bootstrapQueryRequest.js +1 -1
- package/dist/config/useQueryConfig.js +27 -1
- package/dist/config/useQueryConfig.js.map +1 -1
- package/dist/config/useQueryHeaders.js +4 -15
- package/dist/config/useQueryHeaders.js.map +1 -1
- package/dist/config/useReactNativeEnv.js +3 -3
- package/dist/index.mjs +155 -65
- package/dist/index.mjs.map +1 -1
- package/dist/model/useKeyTrackerModel.d.ts +1 -1
- package/dist/model/useKeyTrackerModel.js +5 -1
- package/dist/model/useKeyTrackerModel.js.map +1 -1
- package/dist/queries/useDeleteRequest.d.ts +4 -4
- package/dist/queries/useDeleteRequest.js +24 -9
- package/dist/queries/useDeleteRequest.js.map +1 -1
- package/dist/queries/useGetInfiniteRequest.d.ts +4 -4
- package/dist/queries/useGetInfiniteRequest.js +24 -13
- package/dist/queries/useGetInfiniteRequest.js.map +1 -1
- package/dist/queries/useGetRequest.d.ts +4 -4
- package/dist/queries/useGetRequest.js +23 -12
- package/dist/queries/useGetRequest.js.map +1 -1
- package/dist/queries/usePatchRequest.d.ts +8 -8
- package/dist/queries/usePatchRequest.js +25 -5
- package/dist/queries/usePatchRequest.js.map +1 -1
- package/dist/queries/usePostRequest.d.ts +4 -4
- package/dist/queries/usePostRequest.js +20 -5
- package/dist/queries/usePostRequest.js.map +1 -1
- package/dist/types/index.d.ts +7 -4
- package/package.json +1 -1
- package/src/config/bootstrapQueryRequest.ts +1 -1
- package/src/config/useQueryConfig.ts +41 -4
- package/src/config/useQueryHeaders.ts +6 -18
- package/src/config/useReactNativeEnv.ts +3 -3
- package/src/model/useKeyTrackerModel.ts +5 -1
- package/src/queries/useDeleteRequest.ts +25 -11
- package/src/queries/useGetInfiniteRequest.ts +25 -15
- package/src/queries/useGetRequest.ts +25 -15
- package/src/queries/usePatchRequest.ts +27 -8
- package/src/queries/usePostRequest.ts +22 -8
- package/src/types/index.ts +7 -4
|
@@ -2,9 +2,35 @@ import { useQueryClient } from '@tanstack/react-query';
|
|
|
2
2
|
|
|
3
3
|
const useQueryConfig = () => {
|
|
4
4
|
const queryClient = useQueryClient();
|
|
5
|
+
const setConfig = (options) => {
|
|
6
|
+
let mutationMeta = queryClient.getMutationDefaults()?.meta ?? {};
|
|
7
|
+
let queryMeta = queryClient.getQueryDefaults()?.meta ?? {};
|
|
8
|
+
const { pauseFutureMutations, pauseFutureQueries, mutationMiddleware, queryMiddleware, ...otherOptions } = options;
|
|
9
|
+
if (pauseFutureMutations) {
|
|
10
|
+
mutationMeta.pauseFutureMutations = pauseFutureMutations;
|
|
11
|
+
}
|
|
12
|
+
if (mutationMiddleware) {
|
|
13
|
+
mutationMeta.mutationMiddleware = mutationMiddleware;
|
|
14
|
+
}
|
|
15
|
+
mutationMeta = { meta: { ...mutationMeta, ...otherOptions } };
|
|
16
|
+
if (pauseFutureQueries) {
|
|
17
|
+
queryMeta.pauseFutureQueries = pauseFutureQueries;
|
|
18
|
+
}
|
|
19
|
+
if (queryMiddleware) {
|
|
20
|
+
queryMeta.mutationMiddleware = queryMiddleware;
|
|
21
|
+
}
|
|
22
|
+
queryMeta = { meta: { ...queryMeta, ...otherOptions } };
|
|
23
|
+
const defaultMutationOptions = queryClient.defaultMutationOptions();
|
|
24
|
+
const defaultQueryOptions = queryClient.defaultQueryOptions();
|
|
25
|
+
queryClient.setDefaultOptions({
|
|
26
|
+
queries: { ...defaultQueryOptions, meta: queryMeta },
|
|
27
|
+
mutations: { ...defaultMutationOptions, meta: mutationMeta },
|
|
28
|
+
});
|
|
29
|
+
};
|
|
5
30
|
const mutationMeta = (queryClient.getDefaultOptions().mutations?.meta ?? {});
|
|
6
31
|
const queryMeta = (queryClient.getDefaultOptions().queries?.meta ?? {});
|
|
7
|
-
|
|
32
|
+
const options = { ...queryMeta, ...mutationMeta };
|
|
33
|
+
return { options, setConfig };
|
|
8
34
|
};
|
|
9
35
|
|
|
10
36
|
export { useQueryConfig };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useQueryConfig.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useQueryConfig.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,23 +1,12 @@
|
|
|
1
|
-
import { useQueryClient } from '@tanstack/react-query';
|
|
2
1
|
import { useQueryConfig } from './useQueryConfig.js';
|
|
3
2
|
|
|
4
3
|
const useQueryHeaders = () => {
|
|
5
|
-
const
|
|
6
|
-
const { headers, options } = useQueryConfig();
|
|
4
|
+
const { setConfig, ...config } = useQueryConfig();
|
|
7
5
|
const getHeaders = () => {
|
|
8
|
-
return headers;
|
|
6
|
+
return config.options?.headers;
|
|
9
7
|
};
|
|
10
|
-
const setQueryHeaders = (
|
|
11
|
-
|
|
12
|
-
headers: { ...headers, ...newHeaders },
|
|
13
|
-
options,
|
|
14
|
-
};
|
|
15
|
-
queryClient.setDefaultOptions({
|
|
16
|
-
queries: {
|
|
17
|
-
meta: defaultMeta,
|
|
18
|
-
},
|
|
19
|
-
mutations: { meta: defaultMeta },
|
|
20
|
-
});
|
|
8
|
+
const setQueryHeaders = (headers) => {
|
|
9
|
+
setConfig({ headers });
|
|
21
10
|
};
|
|
22
11
|
return { setQueryHeaders, getHeaders };
|
|
23
12
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useQueryHeaders.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useQueryHeaders.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}
|
|
@@ -2,9 +2,9 @@ import { useQueryConfig } from './useQueryConfig.js';
|
|
|
2
2
|
|
|
3
3
|
const useReactNativeEnv = () => {
|
|
4
4
|
const config = useQueryConfig();
|
|
5
|
-
const appUrl = config.options
|
|
6
|
-
const appTimeout = config.options
|
|
7
|
-
const isApp = config.options
|
|
5
|
+
const appUrl = config.options.environments?.appBaseUrl;
|
|
6
|
+
const appTimeout = config.options.environments?.appTimeout;
|
|
7
|
+
const isApp = config.options.context === 'app';
|
|
8
8
|
return { appUrl, appTimeout, isApp };
|
|
9
9
|
};
|
|
10
10
|
|
package/dist/index.mjs
CHANGED
|
@@ -2,7 +2,7 @@ import 'url-search-params-polyfill';
|
|
|
2
2
|
import { useQueryClient, useQuery, useInfiniteQuery, useMutation } from '@tanstack/react-query';
|
|
3
3
|
import result from 'lodash.result';
|
|
4
4
|
import lodashSet from 'lodash.set';
|
|
5
|
-
import { useState,
|
|
5
|
+
import { useState, useEffect, useMemo, startTransition } from 'react';
|
|
6
6
|
import axios from 'axios';
|
|
7
7
|
|
|
8
8
|
const bootstrapQueryRequest = (queryClient, options) => {
|
|
@@ -12,7 +12,7 @@ const bootstrapQueryRequest = (queryClient, options) => {
|
|
|
12
12
|
headers: {
|
|
13
13
|
Authorization: ``,
|
|
14
14
|
},
|
|
15
|
-
options,
|
|
15
|
+
...options,
|
|
16
16
|
};
|
|
17
17
|
queryClient.setDefaultOptions({
|
|
18
18
|
queries: {
|
|
@@ -24,16 +24,42 @@ const bootstrapQueryRequest = (queryClient, options) => {
|
|
|
24
24
|
|
|
25
25
|
const useQueryConfig = () => {
|
|
26
26
|
const queryClient = useQueryClient();
|
|
27
|
+
const setConfig = (options) => {
|
|
28
|
+
let mutationMeta = queryClient.getMutationDefaults()?.meta ?? {};
|
|
29
|
+
let queryMeta = queryClient.getQueryDefaults()?.meta ?? {};
|
|
30
|
+
const { pauseFutureMutations, pauseFutureQueries, mutationMiddleware, queryMiddleware, ...otherOptions } = options;
|
|
31
|
+
if (pauseFutureMutations) {
|
|
32
|
+
mutationMeta.pauseFutureMutations = pauseFutureMutations;
|
|
33
|
+
}
|
|
34
|
+
if (mutationMiddleware) {
|
|
35
|
+
mutationMeta.mutationMiddleware = mutationMiddleware;
|
|
36
|
+
}
|
|
37
|
+
mutationMeta = { meta: { ...mutationMeta, ...otherOptions } };
|
|
38
|
+
if (pauseFutureQueries) {
|
|
39
|
+
queryMeta.pauseFutureQueries = pauseFutureQueries;
|
|
40
|
+
}
|
|
41
|
+
if (queryMiddleware) {
|
|
42
|
+
queryMeta.mutationMiddleware = queryMiddleware;
|
|
43
|
+
}
|
|
44
|
+
queryMeta = { meta: { ...queryMeta, ...otherOptions } };
|
|
45
|
+
const defaultMutationOptions = queryClient.defaultMutationOptions();
|
|
46
|
+
const defaultQueryOptions = queryClient.defaultQueryOptions();
|
|
47
|
+
queryClient.setDefaultOptions({
|
|
48
|
+
queries: { ...defaultQueryOptions, meta: queryMeta },
|
|
49
|
+
mutations: { ...defaultMutationOptions, meta: mutationMeta },
|
|
50
|
+
});
|
|
51
|
+
};
|
|
27
52
|
const mutationMeta = (queryClient.getDefaultOptions().mutations?.meta ?? {});
|
|
28
53
|
const queryMeta = (queryClient.getDefaultOptions().queries?.meta ?? {});
|
|
29
|
-
|
|
54
|
+
const options = { ...queryMeta, ...mutationMeta };
|
|
55
|
+
return { options, setConfig };
|
|
30
56
|
};
|
|
31
57
|
|
|
32
58
|
const useReactNativeEnv = () => {
|
|
33
59
|
const config = useQueryConfig();
|
|
34
|
-
const appUrl = config.options
|
|
35
|
-
const appTimeout = config.options
|
|
36
|
-
const isApp = config.options
|
|
60
|
+
const appUrl = config.options.environments?.appBaseUrl;
|
|
61
|
+
const appTimeout = config.options.environments?.appTimeout;
|
|
62
|
+
const isApp = config.options.context === 'app';
|
|
37
63
|
return { appUrl, appTimeout, isApp };
|
|
38
64
|
};
|
|
39
65
|
|
|
@@ -48,22 +74,12 @@ const useEnvironmentVariables = () => {
|
|
|
48
74
|
};
|
|
49
75
|
|
|
50
76
|
const useQueryHeaders = () => {
|
|
51
|
-
const
|
|
52
|
-
const { headers, options } = useQueryConfig();
|
|
77
|
+
const { setConfig, ...config } = useQueryConfig();
|
|
53
78
|
const getHeaders = () => {
|
|
54
|
-
return headers;
|
|
79
|
+
return config.options?.headers;
|
|
55
80
|
};
|
|
56
|
-
const setQueryHeaders = (
|
|
57
|
-
|
|
58
|
-
headers: { ...headers, ...newHeaders },
|
|
59
|
-
options,
|
|
60
|
-
};
|
|
61
|
-
queryClient.setDefaultOptions({
|
|
62
|
-
queries: {
|
|
63
|
-
meta: defaultMeta,
|
|
64
|
-
},
|
|
65
|
-
mutations: { meta: defaultMeta },
|
|
66
|
-
});
|
|
81
|
+
const setQueryHeaders = (headers) => {
|
|
82
|
+
setConfig({ headers });
|
|
67
83
|
};
|
|
68
84
|
return { setQueryHeaders, getHeaders };
|
|
69
85
|
};
|
|
@@ -87,7 +103,11 @@ function getDateInFuture(days) {
|
|
|
87
103
|
const useKeyTrackerModel = (keyTracker) => {
|
|
88
104
|
const queryClient = useQueryClient();
|
|
89
105
|
const getQueryKey = (innerKeyTracker) => {
|
|
90
|
-
const
|
|
106
|
+
const meta = {
|
|
107
|
+
...queryClient.getDefaultOptions().mutations?.meta,
|
|
108
|
+
...queryClient.getDefaultOptions().queries?.meta,
|
|
109
|
+
};
|
|
110
|
+
const queryKey = meta[innerKeyTracker ?? keyTracker];
|
|
91
111
|
return queryKey;
|
|
92
112
|
};
|
|
93
113
|
const refetchQuery = async (innerKeyTracker) => {
|
|
@@ -395,6 +415,7 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
395
415
|
const { baseUrl, headers } = deleteOptions ?? {};
|
|
396
416
|
const [requestPath, setRequestPath] = useState('');
|
|
397
417
|
const [options, setOptions] = useState();
|
|
418
|
+
const [destroyConfig, setDestroyConfig] = useState();
|
|
398
419
|
const { options: queryConfigOptions } = useQueryConfig();
|
|
399
420
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
400
421
|
const { getHeaders } = useQueryHeaders();
|
|
@@ -410,7 +431,7 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
410
431
|
timeout: TIMEOUT,
|
|
411
432
|
};
|
|
412
433
|
let shouldContinue = true;
|
|
413
|
-
if (queryConfigOptions
|
|
434
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
414
435
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
415
436
|
}
|
|
416
437
|
if (shouldContinue) {
|
|
@@ -434,22 +455,37 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
434
455
|
return setOptions(fetchOptions);
|
|
435
456
|
};
|
|
436
457
|
const destroy = async (link, internalDeleteOptions) => {
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
458
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
459
|
+
// set enabled to be true for every delete
|
|
460
|
+
internalDeleteOptions = internalDeleteOptions ?? {};
|
|
461
|
+
internalDeleteOptions.enabled = true;
|
|
462
|
+
await setOptionsAsync(internalDeleteOptions);
|
|
463
|
+
await updatedPathAsync(link);
|
|
464
|
+
return query.data;
|
|
465
|
+
}
|
|
466
|
+
else {
|
|
467
|
+
// save delete config
|
|
468
|
+
setDestroyConfig({ link, internalDeleteOptions });
|
|
469
|
+
return undefined;
|
|
470
|
+
}
|
|
471
|
+
};
|
|
472
|
+
useEffect(() => {
|
|
473
|
+
if (!queryConfigOptions.pauseFutureQueries && destroyConfig) {
|
|
474
|
+
destroy(destroyConfig.link, destroyConfig.internalDeleteOptions);
|
|
475
|
+
setDestroyConfig(undefined);
|
|
476
|
+
}
|
|
477
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
478
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
479
|
+
return { destroy, ...query, isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries };
|
|
445
480
|
};
|
|
446
481
|
|
|
447
482
|
const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl, headers, }) => {
|
|
448
483
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
449
484
|
const { getHeaders } = useQueryHeaders();
|
|
450
485
|
const [requestPath, setRequestPath] = useState(path);
|
|
486
|
+
const [queryConfig, setQueryConfig] = useState();
|
|
451
487
|
const [options, setOptions] = useState(queryOptions);
|
|
452
|
-
const { options: queryConfigOptions } = useQueryConfig();
|
|
488
|
+
const { options: queryConfigOptions, setConfig } = useQueryConfig();
|
|
453
489
|
let queryClient = useQueryClient();
|
|
454
490
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
455
491
|
queryClient = useMemo(() => queryClient, []);
|
|
@@ -464,7 +500,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
464
500
|
timeout: TIMEOUT,
|
|
465
501
|
};
|
|
466
502
|
let shouldContinue = true;
|
|
467
|
-
if (queryConfigOptions
|
|
503
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
468
504
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
469
505
|
}
|
|
470
506
|
if (shouldContinue) {
|
|
@@ -496,7 +532,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
496
532
|
return pathname + '?' + queryParams.toString();
|
|
497
533
|
};
|
|
498
534
|
const query = useInfiniteQuery([requestPath, {}], ({ pageParam = requestPath, queryKey }) => new Promise((res, rej) => sendRequest(res, rej, queryKey, pageParam)), {
|
|
499
|
-
enabled: load,
|
|
535
|
+
enabled: load || !queryConfigOptions.pauseFutureQueries,
|
|
500
536
|
getNextPageParam: (lastPage) => constructPaginationLink('next_page', lastPage),
|
|
501
537
|
getPreviousPageParam: (lastPage) => constructPaginationLink('previous_page', lastPage),
|
|
502
538
|
...options,
|
|
@@ -507,9 +543,15 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
507
543
|
});
|
|
508
544
|
};
|
|
509
545
|
const get = async (link, fetchOptions) => {
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
546
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
547
|
+
await setOptionsAsync(fetchOptions);
|
|
548
|
+
await updatedPathAsync(link);
|
|
549
|
+
return query.data;
|
|
550
|
+
}
|
|
551
|
+
else {
|
|
552
|
+
setQueryConfig({ link, fetchOptions });
|
|
553
|
+
return undefined;
|
|
554
|
+
}
|
|
513
555
|
};
|
|
514
556
|
const updatedPathAsync = async (link) => {
|
|
515
557
|
startTransition(() => {
|
|
@@ -518,17 +560,21 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
518
560
|
};
|
|
519
561
|
useEffect(() => {
|
|
520
562
|
if (keyTracker) {
|
|
521
|
-
|
|
522
|
-
queryClient.setQueryDefaults([keyTracker], {
|
|
523
|
-
cacheTime: Infinity,
|
|
524
|
-
staleTime: Infinity,
|
|
525
|
-
});
|
|
526
|
-
queryClient.setQueryData([keyTracker], [requestPath, {}]);
|
|
563
|
+
setConfig({ [keyTracker]: [requestPath, {}] });
|
|
527
564
|
}
|
|
528
|
-
|
|
565
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
566
|
+
}, [keyTracker, requestPath]);
|
|
567
|
+
useEffect(() => {
|
|
568
|
+
if (!queryConfigOptions.pauseFutureQueries && queryConfig) {
|
|
569
|
+
get(queryConfig.link, queryConfig.fetchOptions);
|
|
570
|
+
setQueryConfig(undefined);
|
|
571
|
+
}
|
|
572
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
573
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
529
574
|
return {
|
|
530
575
|
get,
|
|
531
576
|
...query,
|
|
577
|
+
isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries,
|
|
532
578
|
};
|
|
533
579
|
};
|
|
534
580
|
|
|
@@ -538,7 +584,8 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
538
584
|
const [page, setPage] = useState(1);
|
|
539
585
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
540
586
|
const { getHeaders } = useQueryHeaders();
|
|
541
|
-
const { options: queryConfigOptions } = useQueryConfig();
|
|
587
|
+
const { options: queryConfigOptions, setConfig } = useQueryConfig();
|
|
588
|
+
const [queryConfig, setQueryConfig] = useState();
|
|
542
589
|
let queryClient = useQueryClient();
|
|
543
590
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
544
591
|
queryClient = useMemo(() => queryClient, []);
|
|
@@ -555,7 +602,7 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
555
602
|
timeout: TIMEOUT,
|
|
556
603
|
};
|
|
557
604
|
let shouldContinue = true;
|
|
558
|
-
if (queryConfigOptions
|
|
605
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
559
606
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
560
607
|
}
|
|
561
608
|
if (shouldContinue) {
|
|
@@ -586,14 +633,10 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
586
633
|
}, [path]);
|
|
587
634
|
useEffect(() => {
|
|
588
635
|
if (keyTracker) {
|
|
589
|
-
|
|
590
|
-
queryClient.setQueryDefaults([keyTracker], {
|
|
591
|
-
cacheTime: Infinity,
|
|
592
|
-
staleTime: Infinity,
|
|
593
|
-
});
|
|
594
|
-
queryClient.setQueryData([keyTracker], [requestPath, {}]);
|
|
636
|
+
setConfig({ [keyTracker]: [requestPath, {}] });
|
|
595
637
|
}
|
|
596
|
-
|
|
638
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
639
|
+
}, [keyTracker, requestPath]);
|
|
597
640
|
const nextPage = () => {
|
|
598
641
|
if (query.data?.data.pagination) {
|
|
599
642
|
const pagination = query.data.data.pagination;
|
|
@@ -636,12 +679,26 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
636
679
|
});
|
|
637
680
|
};
|
|
638
681
|
const get = async (link, fetchOptions) => {
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
682
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
683
|
+
await setOptionsAsync(fetchOptions);
|
|
684
|
+
await updatedPathAsync(link);
|
|
685
|
+
return query.data;
|
|
686
|
+
}
|
|
687
|
+
else {
|
|
688
|
+
setQueryConfig({ link, fetchOptions });
|
|
689
|
+
return undefined;
|
|
690
|
+
}
|
|
642
691
|
};
|
|
692
|
+
useEffect(() => {
|
|
693
|
+
if (!queryConfigOptions.pauseFutureQueries && queryConfig) {
|
|
694
|
+
get(queryConfig.link, queryConfig.fetchOptions);
|
|
695
|
+
setQueryConfig(undefined);
|
|
696
|
+
}
|
|
697
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
698
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
643
699
|
return {
|
|
644
700
|
...query,
|
|
701
|
+
isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries,
|
|
645
702
|
setRequestPath,
|
|
646
703
|
nextPage,
|
|
647
704
|
prevPage,
|
|
@@ -665,6 +722,7 @@ const useUploadProgress = () => {
|
|
|
665
722
|
const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
666
723
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
667
724
|
const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
|
|
725
|
+
const [mutationConfig, setMutationConfig] = useState();
|
|
668
726
|
const { getHeaders } = useQueryHeaders();
|
|
669
727
|
const config = useQueryConfig();
|
|
670
728
|
const sendRequest = async (res, rej, data) => {
|
|
@@ -680,7 +738,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
680
738
|
onUploadProgress,
|
|
681
739
|
};
|
|
682
740
|
let shouldContinue = true;
|
|
683
|
-
if (config.options
|
|
741
|
+
if (config.options.mutationMiddleware) {
|
|
684
742
|
shouldContinue = await config.options.mutationMiddleware({
|
|
685
743
|
mutationKey: [path, { type: 'mutation' }],
|
|
686
744
|
...requestOptions,
|
|
@@ -690,14 +748,14 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
690
748
|
const patchResponse = await makeRequest(requestOptions);
|
|
691
749
|
if (patchResponse.status) {
|
|
692
750
|
// scroll to top after success
|
|
693
|
-
if (config.options
|
|
751
|
+
if (config.options.context !== 'app') {
|
|
694
752
|
scrollToTop();
|
|
695
753
|
}
|
|
696
754
|
res(patchResponse);
|
|
697
755
|
}
|
|
698
756
|
else {
|
|
699
757
|
// scroll to top after error
|
|
700
|
-
if (config.options
|
|
758
|
+
if (config.options.context !== 'app') {
|
|
701
759
|
scrollToTop();
|
|
702
760
|
}
|
|
703
761
|
rej(patchResponse);
|
|
@@ -712,14 +770,33 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
712
770
|
return sendRequest(res, rej, dataData);
|
|
713
771
|
}), { mutationKey: [path, { type: 'mutation' }] });
|
|
714
772
|
const patch = async (data, options) => {
|
|
715
|
-
|
|
773
|
+
if (!config.options.pauseFutureMutations) {
|
|
774
|
+
return mutation.mutateAsync(data, options);
|
|
775
|
+
}
|
|
776
|
+
else {
|
|
777
|
+
setMutationConfig({ data, options });
|
|
778
|
+
return undefined;
|
|
779
|
+
}
|
|
780
|
+
};
|
|
781
|
+
useEffect(() => {
|
|
782
|
+
if (!config.options.pauseFutureMutations && mutationConfig) {
|
|
783
|
+
patch(mutationConfig.data, mutationConfig.options);
|
|
784
|
+
setMutationConfig(undefined);
|
|
785
|
+
}
|
|
786
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
787
|
+
}, [config.options.pauseFutureMutations]);
|
|
788
|
+
return {
|
|
789
|
+
patch,
|
|
790
|
+
uploadProgressPercent,
|
|
791
|
+
...mutation,
|
|
792
|
+
isLoading: mutation.isLoading || config.options.pauseFutureMutations,
|
|
716
793
|
};
|
|
717
|
-
return { patch, uploadProgressPercent, ...mutation };
|
|
718
794
|
};
|
|
719
795
|
|
|
720
796
|
const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelectors, }) => {
|
|
721
797
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
722
798
|
const config = useQueryConfig();
|
|
799
|
+
const [mutationConfig, setMutationConfig] = useState();
|
|
723
800
|
const { getHeaders } = useQueryHeaders();
|
|
724
801
|
const { isApp } = useReactNativeEnv();
|
|
725
802
|
const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
|
|
@@ -744,7 +821,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
744
821
|
...requestConfig,
|
|
745
822
|
};
|
|
746
823
|
let shouldContinue = true;
|
|
747
|
-
if (config.options
|
|
824
|
+
if (config.options.mutationMiddleware) {
|
|
748
825
|
shouldContinue = await config.options.mutationMiddleware({
|
|
749
826
|
mutationKey: [path, { type: 'mutation' }],
|
|
750
827
|
...requestOptions,
|
|
@@ -754,14 +831,14 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
754
831
|
const postResponse = await makeRequest(requestOptions);
|
|
755
832
|
if (postResponse.status) {
|
|
756
833
|
// scroll to top after success
|
|
757
|
-
if (config.options
|
|
834
|
+
if (config.options.context !== 'app') {
|
|
758
835
|
scrollToTop();
|
|
759
836
|
}
|
|
760
837
|
res(postResponse);
|
|
761
838
|
}
|
|
762
839
|
else {
|
|
763
840
|
// scroll to top after error
|
|
764
|
-
if (config.options
|
|
841
|
+
if (config.options.context !== 'app') {
|
|
765
842
|
scrollToTop();
|
|
766
843
|
}
|
|
767
844
|
rej(postResponse);
|
|
@@ -776,9 +853,22 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
776
853
|
mutationKey: [path, { type: 'mutation' }],
|
|
777
854
|
});
|
|
778
855
|
const post = async (data, options) => {
|
|
779
|
-
|
|
780
|
-
|
|
856
|
+
if (!config.options.pauseFutureMutations) {
|
|
857
|
+
const { requestConfig, ...otherOptions } = options ?? {};
|
|
858
|
+
return mutation.mutateAsync({ data, requestConfig }, otherOptions);
|
|
859
|
+
}
|
|
860
|
+
else {
|
|
861
|
+
setMutationConfig({ data, options });
|
|
862
|
+
return undefined;
|
|
863
|
+
}
|
|
781
864
|
};
|
|
865
|
+
useEffect(() => {
|
|
866
|
+
if (!config.options.pauseFutureMutations && mutationConfig) {
|
|
867
|
+
post(mutationConfig.data, mutationConfig.options);
|
|
868
|
+
setMutationConfig(undefined);
|
|
869
|
+
}
|
|
870
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
871
|
+
}, [config.options.pauseFutureMutations]);
|
|
782
872
|
return { post, uploadProgressPercent, ...mutation };
|
|
783
873
|
};
|
|
784
874
|
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -3,7 +3,11 @@ import { useQueryClient } from '@tanstack/react-query';
|
|
|
3
3
|
const useKeyTrackerModel = (keyTracker) => {
|
|
4
4
|
const queryClient = useQueryClient();
|
|
5
5
|
const getQueryKey = (innerKeyTracker) => {
|
|
6
|
-
const
|
|
6
|
+
const meta = {
|
|
7
|
+
...queryClient.getDefaultOptions().mutations?.meta,
|
|
8
|
+
...queryClient.getDefaultOptions().queries?.meta,
|
|
9
|
+
};
|
|
10
|
+
const queryKey = meta[innerKeyTracker ?? keyTracker];
|
|
7
11
|
return queryKey;
|
|
8
12
|
};
|
|
9
13
|
const refetchQuery = async (innerKeyTracker) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useKeyTrackerModel.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useKeyTrackerModel.js","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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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,5 +1,5 @@
|
|
|
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';
|
|
@@ -12,6 +12,7 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
12
12
|
const { baseUrl, headers } = deleteOptions ?? {};
|
|
13
13
|
const [requestPath, setRequestPath] = useState('');
|
|
14
14
|
const [options, setOptions] = useState();
|
|
15
|
+
const [destroyConfig, setDestroyConfig] = useState();
|
|
15
16
|
const { options: queryConfigOptions } = useQueryConfig();
|
|
16
17
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
17
18
|
const { getHeaders } = useQueryHeaders();
|
|
@@ -27,7 +28,7 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
27
28
|
timeout: TIMEOUT,
|
|
28
29
|
};
|
|
29
30
|
let shouldContinue = true;
|
|
30
|
-
if (queryConfigOptions
|
|
31
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
31
32
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
32
33
|
}
|
|
33
34
|
if (shouldContinue) {
|
|
@@ -51,14 +52,28 @@ const useDeleteRequest = (deleteOptions) => {
|
|
|
51
52
|
return setOptions(fetchOptions);
|
|
52
53
|
};
|
|
53
54
|
const destroy = async (link, internalDeleteOptions) => {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
55
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
56
|
+
// set enabled to be true for every delete
|
|
57
|
+
internalDeleteOptions = internalDeleteOptions ?? {};
|
|
58
|
+
internalDeleteOptions.enabled = true;
|
|
59
|
+
await setOptionsAsync(internalDeleteOptions);
|
|
60
|
+
await updatedPathAsync(link);
|
|
61
|
+
return query.data;
|
|
62
|
+
}
|
|
63
|
+
else {
|
|
64
|
+
// save delete config
|
|
65
|
+
setDestroyConfig({ link, internalDeleteOptions });
|
|
66
|
+
return undefined;
|
|
67
|
+
}
|
|
60
68
|
};
|
|
61
|
-
|
|
69
|
+
useEffect(() => {
|
|
70
|
+
if (!queryConfigOptions.pauseFutureQueries && destroyConfig) {
|
|
71
|
+
destroy(destroyConfig.link, destroyConfig.internalDeleteOptions);
|
|
72
|
+
setDestroyConfig(undefined);
|
|
73
|
+
}
|
|
74
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
75
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
76
|
+
return { destroy, ...query, isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries };
|
|
62
77
|
};
|
|
63
78
|
|
|
64
79
|
export { useDeleteRequest };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDeleteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDeleteRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|