@ventlio/tanstack-query 0.2.87 → 0.2.89
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/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 +154 -64
- 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/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
|
@@ -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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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;
|
|
@@ -12,8 +12,9 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
12
12
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
13
13
|
const { getHeaders } = useQueryHeaders();
|
|
14
14
|
const [requestPath, setRequestPath] = useState(path);
|
|
15
|
+
const [queryConfig, setQueryConfig] = useState();
|
|
15
16
|
const [options, setOptions] = useState(queryOptions);
|
|
16
|
-
const { options: queryConfigOptions } = useQueryConfig();
|
|
17
|
+
const { options: queryConfigOptions, setConfig } = useQueryConfig();
|
|
17
18
|
let queryClient = useQueryClient();
|
|
18
19
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
19
20
|
queryClient = useMemo(() => queryClient, []);
|
|
@@ -28,7 +29,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
28
29
|
timeout: TIMEOUT,
|
|
29
30
|
};
|
|
30
31
|
let shouldContinue = true;
|
|
31
|
-
if (queryConfigOptions
|
|
32
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
32
33
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
33
34
|
}
|
|
34
35
|
if (shouldContinue) {
|
|
@@ -60,7 +61,7 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
60
61
|
return pathname + '?' + queryParams.toString();
|
|
61
62
|
};
|
|
62
63
|
const query = useInfiniteQuery([requestPath, {}], ({ pageParam = requestPath, queryKey }) => new Promise((res, rej) => sendRequest(res, rej, queryKey, pageParam)), {
|
|
63
|
-
enabled: load,
|
|
64
|
+
enabled: load || !queryConfigOptions.pauseFutureQueries,
|
|
64
65
|
getNextPageParam: (lastPage) => constructPaginationLink('next_page', lastPage),
|
|
65
66
|
getPreviousPageParam: (lastPage) => constructPaginationLink('previous_page', lastPage),
|
|
66
67
|
...options,
|
|
@@ -71,9 +72,15 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
71
72
|
});
|
|
72
73
|
};
|
|
73
74
|
const get = async (link, fetchOptions) => {
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
75
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
76
|
+
await setOptionsAsync(fetchOptions);
|
|
77
|
+
await updatedPathAsync(link);
|
|
78
|
+
return query.data;
|
|
79
|
+
}
|
|
80
|
+
else {
|
|
81
|
+
setQueryConfig({ link, fetchOptions });
|
|
82
|
+
return undefined;
|
|
83
|
+
}
|
|
77
84
|
};
|
|
78
85
|
const updatedPathAsync = async (link) => {
|
|
79
86
|
startTransition(() => {
|
|
@@ -82,17 +89,21 @@ const useGetInfiniteRequest = ({ path, load = false, queryOptions, keyTracker, b
|
|
|
82
89
|
};
|
|
83
90
|
useEffect(() => {
|
|
84
91
|
if (keyTracker) {
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
92
|
+
setConfig({ [keyTracker]: [requestPath, {}] });
|
|
93
|
+
}
|
|
94
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
95
|
+
}, [keyTracker, requestPath]);
|
|
96
|
+
useEffect(() => {
|
|
97
|
+
if (!queryConfigOptions.pauseFutureQueries && queryConfig) {
|
|
98
|
+
get(queryConfig.link, queryConfig.fetchOptions);
|
|
99
|
+
setQueryConfig(undefined);
|
|
91
100
|
}
|
|
92
|
-
|
|
101
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
102
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
93
103
|
return {
|
|
94
104
|
get,
|
|
95
105
|
...query,
|
|
106
|
+
isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries,
|
|
96
107
|
};
|
|
97
108
|
};
|
|
98
109
|
|
|
@@ -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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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 | undefined;
|
|
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;
|
|
@@ -14,7 +14,8 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
14
14
|
const [page, setPage] = useState(1);
|
|
15
15
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
16
16
|
const { getHeaders } = useQueryHeaders();
|
|
17
|
-
const { options: queryConfigOptions } = useQueryConfig();
|
|
17
|
+
const { options: queryConfigOptions, setConfig } = useQueryConfig();
|
|
18
|
+
const [queryConfig, setQueryConfig] = useState();
|
|
18
19
|
let queryClient = useQueryClient();
|
|
19
20
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
20
21
|
queryClient = useMemo(() => queryClient, []);
|
|
@@ -31,7 +32,7 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
31
32
|
timeout: TIMEOUT,
|
|
32
33
|
};
|
|
33
34
|
let shouldContinue = true;
|
|
34
|
-
if (queryConfigOptions
|
|
35
|
+
if (queryConfigOptions.queryMiddleware) {
|
|
35
36
|
shouldContinue = await queryConfigOptions.queryMiddleware({ queryKey, ...requestOptions });
|
|
36
37
|
}
|
|
37
38
|
if (shouldContinue) {
|
|
@@ -62,14 +63,10 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
62
63
|
}, [path]);
|
|
63
64
|
useEffect(() => {
|
|
64
65
|
if (keyTracker) {
|
|
65
|
-
|
|
66
|
-
queryClient.setQueryDefaults([keyTracker], {
|
|
67
|
-
cacheTime: Infinity,
|
|
68
|
-
staleTime: Infinity,
|
|
69
|
-
});
|
|
70
|
-
queryClient.setQueryData([keyTracker], [requestPath, {}]);
|
|
66
|
+
setConfig({ [keyTracker]: [requestPath, {}] });
|
|
71
67
|
}
|
|
72
|
-
|
|
68
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
69
|
+
}, [keyTracker, requestPath]);
|
|
73
70
|
const nextPage = () => {
|
|
74
71
|
if (query.data?.data.pagination) {
|
|
75
72
|
const pagination = query.data.data.pagination;
|
|
@@ -112,12 +109,26 @@ const useGetRequest = ({ path, load = false, queryOptions, keyTracker, baseUrl,
|
|
|
112
109
|
});
|
|
113
110
|
};
|
|
114
111
|
const get = async (link, fetchOptions) => {
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
112
|
+
if (!queryConfigOptions.pauseFutureQueries) {
|
|
113
|
+
await setOptionsAsync(fetchOptions);
|
|
114
|
+
await updatedPathAsync(link);
|
|
115
|
+
return query.data;
|
|
116
|
+
}
|
|
117
|
+
else {
|
|
118
|
+
setQueryConfig({ link, fetchOptions });
|
|
119
|
+
return undefined;
|
|
120
|
+
}
|
|
118
121
|
};
|
|
122
|
+
useEffect(() => {
|
|
123
|
+
if (!queryConfigOptions.pauseFutureQueries && queryConfig) {
|
|
124
|
+
get(queryConfig.link, queryConfig.fetchOptions);
|
|
125
|
+
setQueryConfig(undefined);
|
|
126
|
+
}
|
|
127
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
128
|
+
}, [queryConfigOptions.pauseFutureQueries]);
|
|
119
129
|
return {
|
|
120
130
|
...query,
|
|
131
|
+
isLoading: query.isLoading || queryConfigOptions.pauseFutureQueries,
|
|
121
132
|
setRequestPath,
|
|
122
133
|
nextPage,
|
|
123
134
|
prevPage,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGetRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGetRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -4,11 +4,11 @@ import type { DefaultRequestOptions } from './queries.interface';
|
|
|
4
4
|
export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
|
|
5
5
|
path: string;
|
|
6
6
|
} & DefaultRequestOptions) => {
|
|
7
|
+
isLoading: boolean | undefined;
|
|
7
8
|
data: undefined;
|
|
8
9
|
error: null;
|
|
9
10
|
isError: false;
|
|
10
11
|
isIdle: true;
|
|
11
|
-
isLoading: false;
|
|
12
12
|
isSuccess: false;
|
|
13
13
|
status: "idle";
|
|
14
14
|
mutate: import("@tanstack/react-query").UseMutateFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
@@ -19,14 +19,14 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
|
|
|
19
19
|
isPaused: boolean;
|
|
20
20
|
variables: void | undefined;
|
|
21
21
|
mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
22
|
-
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse
|
|
22
|
+
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
23
23
|
uploadProgressPercent: number;
|
|
24
24
|
} | {
|
|
25
|
+
isLoading: boolean | undefined;
|
|
25
26
|
data: undefined;
|
|
26
27
|
error: null;
|
|
27
28
|
isError: false;
|
|
28
29
|
isIdle: false;
|
|
29
|
-
isLoading: true;
|
|
30
30
|
isSuccess: false;
|
|
31
31
|
status: "loading";
|
|
32
32
|
mutate: import("@tanstack/react-query").UseMutateFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
@@ -37,14 +37,14 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
|
|
|
37
37
|
isPaused: boolean;
|
|
38
38
|
variables: void | undefined;
|
|
39
39
|
mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
40
|
-
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse
|
|
40
|
+
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
41
41
|
uploadProgressPercent: number;
|
|
42
42
|
} | {
|
|
43
|
+
isLoading: boolean | undefined;
|
|
43
44
|
data: undefined;
|
|
44
45
|
error: IRequestError;
|
|
45
46
|
isError: true;
|
|
46
47
|
isIdle: false;
|
|
47
|
-
isLoading: false;
|
|
48
48
|
isSuccess: false;
|
|
49
49
|
status: "error";
|
|
50
50
|
mutate: import("@tanstack/react-query").UseMutateFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
@@ -55,14 +55,14 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
|
|
|
55
55
|
isPaused: boolean;
|
|
56
56
|
variables: void | undefined;
|
|
57
57
|
mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
58
|
-
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse
|
|
58
|
+
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
59
59
|
uploadProgressPercent: number;
|
|
60
60
|
} | {
|
|
61
|
+
isLoading: boolean | undefined;
|
|
61
62
|
data: IRequestSuccess<TResponse>;
|
|
62
63
|
error: null;
|
|
63
64
|
isError: false;
|
|
64
65
|
isIdle: false;
|
|
65
|
-
isLoading: false;
|
|
66
66
|
isSuccess: true;
|
|
67
67
|
status: "success";
|
|
68
68
|
mutate: import("@tanstack/react-query").UseMutateFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
@@ -73,6 +73,6 @@ export declare const usePatchRequest: <TResponse>({ path, baseUrl, headers }: {
|
|
|
73
73
|
isPaused: boolean;
|
|
74
74
|
variables: void | undefined;
|
|
75
75
|
mutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<IRequestSuccess<TResponse>, IRequestError, void, unknown>;
|
|
76
|
-
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse
|
|
76
|
+
patch: (data: any, options?: MutateOptions<IRequestSuccess<TResponse>, IRequestError, void, unknown> | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
77
77
|
uploadProgressPercent: number;
|
|
78
78
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useMutation } from '@tanstack/react-query';
|
|
2
|
+
import { useState, useEffect } from 'react';
|
|
2
3
|
import 'url-search-params-polyfill';
|
|
3
4
|
import { useEnvironmentVariables } from '../config/useEnvironmentVariables.js';
|
|
4
5
|
import { useQueryConfig } from '../config/useQueryConfig.js';
|
|
@@ -12,6 +13,7 @@ import { HttpMethod } from '../request/request.enum.js';
|
|
|
12
13
|
const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
13
14
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
14
15
|
const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
|
|
16
|
+
const [mutationConfig, setMutationConfig] = useState();
|
|
15
17
|
const { getHeaders } = useQueryHeaders();
|
|
16
18
|
const config = useQueryConfig();
|
|
17
19
|
const sendRequest = async (res, rej, data) => {
|
|
@@ -27,7 +29,7 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
27
29
|
onUploadProgress,
|
|
28
30
|
};
|
|
29
31
|
let shouldContinue = true;
|
|
30
|
-
if (config.options
|
|
32
|
+
if (config.options.mutationMiddleware) {
|
|
31
33
|
shouldContinue = await config.options.mutationMiddleware({
|
|
32
34
|
mutationKey: [path, { type: 'mutation' }],
|
|
33
35
|
...requestOptions,
|
|
@@ -37,14 +39,14 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
37
39
|
const patchResponse = await makeRequest(requestOptions);
|
|
38
40
|
if (patchResponse.status) {
|
|
39
41
|
// scroll to top after success
|
|
40
|
-
if (config.options
|
|
42
|
+
if (config.options.context !== 'app') {
|
|
41
43
|
scrollToTop();
|
|
42
44
|
}
|
|
43
45
|
res(patchResponse);
|
|
44
46
|
}
|
|
45
47
|
else {
|
|
46
48
|
// scroll to top after error
|
|
47
|
-
if (config.options
|
|
49
|
+
if (config.options.context !== 'app') {
|
|
48
50
|
scrollToTop();
|
|
49
51
|
}
|
|
50
52
|
rej(patchResponse);
|
|
@@ -59,9 +61,27 @@ const usePatchRequest = ({ path, baseUrl, headers }) => {
|
|
|
59
61
|
return sendRequest(res, rej, dataData);
|
|
60
62
|
}), { mutationKey: [path, { type: 'mutation' }] });
|
|
61
63
|
const patch = async (data, options) => {
|
|
62
|
-
|
|
64
|
+
if (!config.options.pauseFutureMutations) {
|
|
65
|
+
return mutation.mutateAsync(data, options);
|
|
66
|
+
}
|
|
67
|
+
else {
|
|
68
|
+
setMutationConfig({ data, options });
|
|
69
|
+
return undefined;
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
useEffect(() => {
|
|
73
|
+
if (!config.options.pauseFutureMutations && mutationConfig) {
|
|
74
|
+
patch(mutationConfig.data, mutationConfig.options);
|
|
75
|
+
setMutationConfig(undefined);
|
|
76
|
+
}
|
|
77
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
78
|
+
}, [config.options.pauseFutureMutations]);
|
|
79
|
+
return {
|
|
80
|
+
patch,
|
|
81
|
+
uploadProgressPercent,
|
|
82
|
+
...mutation,
|
|
83
|
+
isLoading: mutation.isLoading || config.options.pauseFutureMutations,
|
|
63
84
|
};
|
|
64
|
-
return { patch, uploadProgressPercent, ...mutation };
|
|
65
85
|
};
|
|
66
86
|
|
|
67
87
|
export { usePatchRequest };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePatchRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"usePatchRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -39,7 +39,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
|
|
|
39
39
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
40
40
|
} & {
|
|
41
41
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
42
|
-
}) | undefined) => Promise<IRequestSuccess<TResponse
|
|
42
|
+
}) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
43
43
|
uploadProgressPercent: number;
|
|
44
44
|
} | {
|
|
45
45
|
data: undefined;
|
|
@@ -75,7 +75,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
|
|
|
75
75
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
76
76
|
} & {
|
|
77
77
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
78
|
-
}) | undefined) => Promise<IRequestSuccess<TResponse
|
|
78
|
+
}) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
79
79
|
uploadProgressPercent: number;
|
|
80
80
|
} | {
|
|
81
81
|
data: undefined;
|
|
@@ -111,7 +111,7 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
|
|
|
111
111
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
112
112
|
} & {
|
|
113
113
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
114
|
-
}) | undefined) => Promise<IRequestSuccess<TResponse
|
|
114
|
+
}) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
115
115
|
uploadProgressPercent: number;
|
|
116
116
|
} | {
|
|
117
117
|
data: IRequestSuccess<TResponse>;
|
|
@@ -147,6 +147,6 @@ export declare const usePostRequest: <TResponse>({ path, isFormData, baseUrl, he
|
|
|
147
147
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
148
148
|
} & {
|
|
149
149
|
requestConfig?: Partial<Omit<IMakeRequest, "body">> | undefined;
|
|
150
|
-
}) | undefined) => Promise<IRequestSuccess<TResponse
|
|
150
|
+
}) | undefined) => Promise<IRequestSuccess<TResponse> | undefined>;
|
|
151
151
|
uploadProgressPercent: number;
|
|
152
152
|
};
|
|
@@ -4,6 +4,7 @@ import { useEnvironmentVariables } from '../config/useEnvironmentVariables.js';
|
|
|
4
4
|
import { useQueryConfig } from '../config/useQueryConfig.js';
|
|
5
5
|
import { useQueryHeaders } from '../config/useQueryHeaders.js';
|
|
6
6
|
import { useReactNativeEnv } from '../config/useReactNativeEnv.js';
|
|
7
|
+
import { useState, useEffect } from 'react';
|
|
7
8
|
import { scrollToTop } from '../helpers/scrollToTop.js';
|
|
8
9
|
import { useUploadProgress } from '../hooks/useUploadProgress.js';
|
|
9
10
|
import 'axios';
|
|
@@ -13,6 +14,7 @@ import { HttpMethod } from '../request/request.enum.js';
|
|
|
13
14
|
const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelectors, }) => {
|
|
14
15
|
const { API_URL, TIMEOUT } = useEnvironmentVariables();
|
|
15
16
|
const config = useQueryConfig();
|
|
17
|
+
const [mutationConfig, setMutationConfig] = useState();
|
|
16
18
|
const { getHeaders } = useQueryHeaders();
|
|
17
19
|
const { isApp } = useReactNativeEnv();
|
|
18
20
|
const { uploadProgressPercent, onUploadProgress } = useUploadProgress();
|
|
@@ -37,7 +39,7 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
37
39
|
...requestConfig,
|
|
38
40
|
};
|
|
39
41
|
let shouldContinue = true;
|
|
40
|
-
if (config.options
|
|
42
|
+
if (config.options.mutationMiddleware) {
|
|
41
43
|
shouldContinue = await config.options.mutationMiddleware({
|
|
42
44
|
mutationKey: [path, { type: 'mutation' }],
|
|
43
45
|
...requestOptions,
|
|
@@ -47,14 +49,14 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
47
49
|
const postResponse = await makeRequest(requestOptions);
|
|
48
50
|
if (postResponse.status) {
|
|
49
51
|
// scroll to top after success
|
|
50
|
-
if (config.options
|
|
52
|
+
if (config.options.context !== 'app') {
|
|
51
53
|
scrollToTop();
|
|
52
54
|
}
|
|
53
55
|
res(postResponse);
|
|
54
56
|
}
|
|
55
57
|
else {
|
|
56
58
|
// scroll to top after error
|
|
57
|
-
if (config.options
|
|
59
|
+
if (config.options.context !== 'app') {
|
|
58
60
|
scrollToTop();
|
|
59
61
|
}
|
|
60
62
|
rej(postResponse);
|
|
@@ -69,9 +71,22 @@ const usePostRequest = ({ path, isFormData = false, baseUrl, headers, fileSelect
|
|
|
69
71
|
mutationKey: [path, { type: 'mutation' }],
|
|
70
72
|
});
|
|
71
73
|
const post = async (data, options) => {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
+
if (!config.options.pauseFutureMutations) {
|
|
75
|
+
const { requestConfig, ...otherOptions } = options ?? {};
|
|
76
|
+
return mutation.mutateAsync({ data, requestConfig }, otherOptions);
|
|
77
|
+
}
|
|
78
|
+
else {
|
|
79
|
+
setMutationConfig({ data, options });
|
|
80
|
+
return undefined;
|
|
81
|
+
}
|
|
74
82
|
};
|
|
83
|
+
useEffect(() => {
|
|
84
|
+
if (!config.options.pauseFutureMutations && mutationConfig) {
|
|
85
|
+
post(mutationConfig.data, mutationConfig.options);
|
|
86
|
+
setMutationConfig(undefined);
|
|
87
|
+
}
|
|
88
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
89
|
+
}, [config.options.pauseFutureMutations]);
|
|
75
90
|
return { post, uploadProgressPercent, ...mutation };
|
|
76
91
|
};
|
|
77
92
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePostRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"usePostRequest.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -14,16 +14,19 @@ export interface BootstrapConfig {
|
|
|
14
14
|
queryMiddleware?: (queryRequestConfig?: IMakeRequest & {
|
|
15
15
|
queryKey: QueryKey;
|
|
16
16
|
}) => Promise<boolean>;
|
|
17
|
+
pauseFutureMutations?: boolean;
|
|
18
|
+
pauseFutureQueries?: boolean;
|
|
19
|
+
headers?: RawAxiosRequestHeaders;
|
|
17
20
|
}
|
|
18
21
|
export interface BootstrapModelConfig {
|
|
19
22
|
idColumn: string;
|
|
20
23
|
}
|
|
21
24
|
export type ContextType = 'app' | 'web' | 'electronjs';
|
|
22
25
|
export interface TanstackQueryConfig {
|
|
23
|
-
|
|
24
|
-
options
|
|
26
|
+
options: BootstrapConfig;
|
|
27
|
+
setConfig: (options: BootstrapConfig) => void;
|
|
25
28
|
}
|
|
26
29
|
export interface IUseQueryHeaders {
|
|
27
|
-
getHeaders: () =>
|
|
28
|
-
setQueryHeaders: (header:
|
|
30
|
+
getHeaders: () => BootstrapConfig['headers'];
|
|
31
|
+
setQueryHeaders: (header: BootstrapConfig['headers']) => void;
|
|
29
32
|
}
|
package/package.json
CHANGED
|
@@ -1,11 +1,48 @@
|
|
|
1
|
+
import type { MutationMeta, QueryMeta } from '@tanstack/react-query';
|
|
1
2
|
import { useQueryClient } from '@tanstack/react-query';
|
|
2
|
-
import type { TanstackQueryConfig } from '../types';
|
|
3
|
+
import type { BootstrapConfig, TanstackQueryConfig } from '../types';
|
|
3
4
|
|
|
4
5
|
export const useQueryConfig = (): TanstackQueryConfig => {
|
|
5
6
|
const queryClient = useQueryClient();
|
|
6
7
|
|
|
7
|
-
const
|
|
8
|
-
|
|
8
|
+
const setConfig = (options: BootstrapConfig) => {
|
|
9
|
+
let mutationMeta: MutationMeta | undefined = queryClient.getMutationDefaults()?.meta ?? {};
|
|
10
|
+
let queryMeta: QueryMeta | undefined = queryClient.getQueryDefaults()?.meta ?? {};
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
const { pauseFutureMutations, pauseFutureQueries, mutationMiddleware, queryMiddleware, ...otherOptions } = options;
|
|
13
|
+
|
|
14
|
+
if (pauseFutureMutations) {
|
|
15
|
+
mutationMeta.pauseFutureMutations = pauseFutureMutations;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
if (mutationMiddleware) {
|
|
19
|
+
mutationMeta.mutationMiddleware = mutationMiddleware;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
mutationMeta = { meta: { ...mutationMeta, ...otherOptions } };
|
|
23
|
+
|
|
24
|
+
if (pauseFutureQueries) {
|
|
25
|
+
queryMeta.pauseFutureQueries = pauseFutureQueries;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
if (queryMiddleware) {
|
|
29
|
+
queryMeta.mutationMiddleware = queryMiddleware;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
queryMeta = { meta: { ...queryMeta, ...otherOptions } };
|
|
33
|
+
|
|
34
|
+
const defaultMutationOptions = queryClient.defaultMutationOptions();
|
|
35
|
+
const defaultQueryOptions = queryClient.defaultQueryOptions();
|
|
36
|
+
|
|
37
|
+
queryClient.setDefaultOptions({
|
|
38
|
+
queries: { ...defaultQueryOptions, meta: queryMeta },
|
|
39
|
+
mutations: { ...defaultMutationOptions, meta: mutationMeta },
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
const mutationMeta = (queryClient.getDefaultOptions().mutations?.meta ?? {}) as unknown as BootstrapConfig;
|
|
44
|
+
const queryMeta = (queryClient.getDefaultOptions().queries?.meta ?? {}) as unknown as BootstrapConfig;
|
|
45
|
+
|
|
46
|
+
const options: BootstrapConfig = { ...queryMeta, ...mutationMeta };
|
|
47
|
+
return { options, setConfig };
|
|
11
48
|
};
|
|
@@ -1,27 +1,15 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import type { IUseQueryHeaders, TanstackQueryConfig } from '../types';
|
|
1
|
+
import type { BootstrapConfig, IUseQueryHeaders } from '../types';
|
|
3
2
|
import { useQueryConfig } from './useQueryConfig';
|
|
4
3
|
|
|
5
4
|
export const useQueryHeaders = (): IUseQueryHeaders => {
|
|
6
|
-
const
|
|
7
|
-
const { headers, options } = useQueryConfig();
|
|
5
|
+
const { setConfig, ...config } = useQueryConfig();
|
|
8
6
|
|
|
9
|
-
const getHeaders = ():
|
|
10
|
-
return headers;
|
|
7
|
+
const getHeaders = (): BootstrapConfig['headers'] => {
|
|
8
|
+
return config.options?.headers;
|
|
11
9
|
};
|
|
12
10
|
|
|
13
|
-
const setQueryHeaders = (
|
|
14
|
-
|
|
15
|
-
headers: { ...headers, ...newHeaders },
|
|
16
|
-
options,
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
queryClient.setDefaultOptions({
|
|
20
|
-
queries: {
|
|
21
|
-
meta: defaultMeta,
|
|
22
|
-
},
|
|
23
|
-
mutations: { meta: defaultMeta },
|
|
24
|
-
});
|
|
11
|
+
const setQueryHeaders = (headers: BootstrapConfig['headers']) => {
|
|
12
|
+
setConfig({ headers });
|
|
25
13
|
};
|
|
26
14
|
|
|
27
15
|
return { setQueryHeaders, getHeaders };
|
|
@@ -3,9 +3,9 @@ import { useQueryConfig } from './useQueryConfig';
|
|
|
3
3
|
export const useReactNativeEnv = () => {
|
|
4
4
|
const config = useQueryConfig();
|
|
5
5
|
|
|
6
|
-
const appUrl: string | undefined = config.options
|
|
7
|
-
const appTimeout: number | undefined = config.options
|
|
8
|
-
const isApp = config.options
|
|
6
|
+
const appUrl: string | undefined = config.options.environments?.appBaseUrl;
|
|
7
|
+
const appTimeout: number | undefined = config.options.environments?.appTimeout;
|
|
8
|
+
const isApp = config.options.context === 'app';
|
|
9
9
|
|
|
10
10
|
return { appUrl, appTimeout, isApp };
|
|
11
11
|
};
|