@tanstack/react-query 5.0.0-alpha.7 → 5.0.0-alpha.71

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 (290) hide show
  1. package/build/codemods/__testfixtures__/default-import.input.tsx +94 -0
  2. package/build/codemods/__testfixtures__/default-import.output.tsx +96 -0
  3. package/build/codemods/__testfixtures__/named-import.input.tsx +96 -0
  4. package/build/codemods/__testfixtures__/named-import.output.tsx +98 -0
  5. package/build/codemods/__testfixtures__/namespaced-import.input.tsx +86 -0
  6. package/build/codemods/__testfixtures__/namespaced-import.output.tsx +88 -0
  7. package/build/codemods/__testfixtures__/parameter-is-identifier.input.tsx +49 -0
  8. package/build/codemods/__testfixtures__/parameter-is-identifier.output.tsx +49 -0
  9. package/build/codemods/__testfixtures__/parameter-is-object-expression.input.tsx +128 -0
  10. package/build/codemods/__testfixtures__/parameter-is-object-expression.output.tsx +175 -0
  11. package/build/codemods/__testfixtures__/replace-import-specifier.input.tsx +10 -0
  12. package/build/codemods/__testfixtures__/replace-import-specifier.output.tsx +10 -0
  13. package/build/codemods/__testfixtures__/type-arguments.input.tsx +25 -0
  14. package/build/codemods/__testfixtures__/type-arguments.output.tsx +31 -0
  15. package/build/codemods/__tests__/key-transformation.test.js +32 -0
  16. package/build/codemods/__tests__/replace-import-specifier.test.js +12 -0
  17. package/build/codemods/remove-overloads/__testfixtures__/default-import.input.tsx +199 -0
  18. package/build/codemods/remove-overloads/__testfixtures__/default-import.output.tsx +484 -0
  19. package/build/codemods/remove-overloads/__tests__/remove-overloads.test.js +6 -0
  20. package/build/codemods/remove-overloads/remove-overloads.js +59 -0
  21. package/build/codemods/remove-overloads/transformers/filter-aware-usage-transformer.js +153 -0
  22. package/build/codemods/remove-overloads/transformers/query-fn-aware-usage-transformer.js +188 -0
  23. package/build/codemods/remove-overloads/utils/index.js +124 -0
  24. package/build/codemods/remove-overloads/utils/unknown-usage-error.js +27 -0
  25. package/build/codemods/src/utils/index.js +205 -0
  26. package/build/codemods/src/v4/key-transformation.js +138 -0
  27. package/build/codemods/src/v4/replace-import-specifier.js +25 -0
  28. package/build/codemods/transformers/query-cache-transformer.js +116 -0
  29. package/build/codemods/transformers/query-client-transformer.js +48 -0
  30. package/build/codemods/transformers/use-query-like-transformer.js +32 -0
  31. package/build/codemods/utils/replacers/key-replacer.js +164 -0
  32. package/build/lib/HydrationBoundary.cjs +50 -0
  33. package/build/lib/{HydrationBoundary.mjs.map → HydrationBoundary.cjs.map} +1 -1
  34. package/build/lib/HydrationBoundary.d.ts +1 -0
  35. package/build/lib/HydrationBoundary.d.ts.map +1 -0
  36. package/build/lib/HydrationBoundary.js +9 -29
  37. package/build/lib/HydrationBoundary.js.map +1 -1
  38. package/build/lib/HydrationBoundary.legacy.cjs +50 -0
  39. package/build/lib/HydrationBoundary.legacy.cjs.map +1 -0
  40. package/build/lib/{HydrationBoundary.esm.js → HydrationBoundary.legacy.js} +3 -2
  41. package/build/lib/HydrationBoundary.legacy.js.map +1 -0
  42. package/build/lib/QueryClientProvider.cjs +54 -0
  43. package/build/lib/QueryClientProvider.cjs.map +1 -0
  44. package/build/lib/QueryClientProvider.d.ts +2 -1
  45. package/build/lib/QueryClientProvider.d.ts.map +1 -0
  46. package/build/lib/QueryClientProvider.js +7 -29
  47. package/build/lib/QueryClientProvider.js.map +1 -1
  48. package/build/lib/QueryClientProvider.legacy.cjs +54 -0
  49. package/build/lib/QueryClientProvider.legacy.cjs.map +1 -0
  50. package/build/lib/{QueryClientProvider.esm.js → QueryClientProvider.legacy.js} +2 -1
  51. package/build/lib/QueryClientProvider.legacy.js.map +1 -0
  52. package/build/lib/QueryErrorResetBoundary.cjs +60 -0
  53. package/build/lib/{QueryErrorResetBoundary.mjs.map → QueryErrorResetBoundary.cjs.map} +1 -1
  54. package/build/lib/QueryErrorResetBoundary.d.ts +1 -0
  55. package/build/lib/QueryErrorResetBoundary.d.ts.map +1 -0
  56. package/build/lib/QueryErrorResetBoundary.js +7 -28
  57. package/build/lib/QueryErrorResetBoundary.js.map +1 -1
  58. package/build/lib/QueryErrorResetBoundary.legacy.cjs +60 -0
  59. package/build/lib/QueryErrorResetBoundary.legacy.cjs.map +1 -0
  60. package/build/lib/{QueryErrorResetBoundary.esm.js → QueryErrorResetBoundary.legacy.js} +2 -1
  61. package/build/lib/QueryErrorResetBoundary.legacy.js.map +1 -0
  62. package/build/lib/__tests__/HydrationBoundary.test.d.ts +1 -0
  63. package/build/lib/__tests__/HydrationBoundary.test.d.ts.map +1 -0
  64. package/build/lib/__tests__/QueryClientProvider.test.d.ts +1 -0
  65. package/build/lib/__tests__/QueryClientProvider.test.d.ts.map +1 -0
  66. package/build/lib/__tests__/QueryResetErrorBoundary.test.d.ts +1 -0
  67. package/build/lib/__tests__/QueryResetErrorBoundary.test.d.ts.map +1 -0
  68. package/build/lib/__tests__/ssr-hydration.test.d.ts +1 -0
  69. package/build/lib/__tests__/ssr-hydration.test.d.ts.map +1 -0
  70. package/build/lib/__tests__/ssr.test.d.ts +1 -0
  71. package/build/lib/__tests__/ssr.test.d.ts.map +1 -0
  72. package/build/lib/__tests__/suspense.test.d.ts +1 -0
  73. package/build/lib/__tests__/suspense.test.d.ts.map +1 -0
  74. package/build/lib/__tests__/useInfiniteQuery.test.d.ts +1 -0
  75. package/build/lib/__tests__/useInfiniteQuery.test.d.ts.map +1 -0
  76. package/build/lib/__tests__/useInfiniteQuery.type.test.d.ts +1 -0
  77. package/build/lib/__tests__/useInfiniteQuery.type.test.d.ts.map +1 -0
  78. package/build/lib/__tests__/useIsFetching.test.d.ts +1 -0
  79. package/build/lib/__tests__/useIsFetching.test.d.ts.map +1 -0
  80. package/build/lib/__tests__/useMutation.test.d.ts +1 -0
  81. package/build/lib/__tests__/useMutation.test.d.ts.map +1 -0
  82. package/build/lib/__tests__/useMutationState.test.d.ts +1 -0
  83. package/build/lib/__tests__/useMutationState.test.d.ts.map +1 -0
  84. package/build/lib/__tests__/useQueries.test.d.ts +1 -0
  85. package/build/lib/__tests__/useQueries.test.d.ts.map +1 -0
  86. package/build/lib/__tests__/useQuery.test.d.ts +1 -0
  87. package/build/lib/__tests__/useQuery.test.d.ts.map +1 -0
  88. package/build/lib/__tests__/useQuery.types.test.d.ts +1 -0
  89. package/build/lib/__tests__/useQuery.types.test.d.ts.map +1 -0
  90. package/build/lib/__tests__/utils.d.ts +3 -2
  91. package/build/lib/__tests__/utils.d.ts.map +1 -0
  92. package/build/lib/errorBoundaryUtils.cjs +51 -0
  93. package/build/lib/errorBoundaryUtils.cjs.map +1 -0
  94. package/build/lib/errorBoundaryUtils.d.ts +4 -3
  95. package/build/lib/errorBoundaryUtils.d.ts.map +1 -0
  96. package/build/lib/errorBoundaryUtils.js +8 -30
  97. package/build/lib/errorBoundaryUtils.js.map +1 -1
  98. package/build/lib/errorBoundaryUtils.legacy.cjs +51 -0
  99. package/build/lib/errorBoundaryUtils.legacy.cjs.map +1 -0
  100. package/build/lib/{errorBoundaryUtils.esm.js → errorBoundaryUtils.legacy.js} +6 -5
  101. package/build/lib/errorBoundaryUtils.legacy.js.map +1 -0
  102. package/build/lib/index.cjs +40 -0
  103. package/build/lib/index.cjs.map +1 -0
  104. package/build/lib/index.d.ts +2 -0
  105. package/build/lib/index.d.ts.map +1 -0
  106. package/build/lib/index.js +12 -37
  107. package/build/lib/index.js.map +1 -1
  108. package/build/lib/index.legacy.cjs +40 -0
  109. package/build/lib/index.legacy.cjs.map +1 -0
  110. package/build/lib/index.legacy.js +13 -0
  111. package/build/lib/index.legacy.js.map +1 -0
  112. package/build/lib/isRestoring.cjs +31 -0
  113. package/build/lib/isRestoring.cjs.map +1 -0
  114. package/build/lib/isRestoring.d.ts +1 -0
  115. package/build/lib/isRestoring.d.ts.map +1 -0
  116. package/build/lib/isRestoring.js +5 -26
  117. package/build/lib/isRestoring.js.map +1 -1
  118. package/build/lib/isRestoring.legacy.cjs +31 -0
  119. package/build/lib/isRestoring.legacy.cjs.map +1 -0
  120. package/build/lib/{isRestoring.esm.js → isRestoring.legacy.js} +2 -1
  121. package/build/lib/isRestoring.legacy.js.map +1 -0
  122. package/build/lib/queryOptions.cjs +8 -0
  123. package/build/lib/queryOptions.cjs.map +1 -0
  124. package/build/lib/queryOptions.d.ts +11 -0
  125. package/build/lib/queryOptions.d.ts.map +1 -0
  126. package/build/lib/queryOptions.js +6 -0
  127. package/build/lib/queryOptions.js.map +1 -0
  128. package/build/lib/queryOptions.legacy.cjs +8 -0
  129. package/build/lib/queryOptions.legacy.cjs.map +1 -0
  130. package/build/lib/queryOptions.legacy.js +6 -0
  131. package/build/lib/queryOptions.legacy.js.map +1 -0
  132. package/build/lib/suspense.cjs +22 -0
  133. package/build/lib/suspense.cjs.map +1 -0
  134. package/build/lib/suspense.d.ts +3 -5
  135. package/build/lib/suspense.d.ts.map +1 -0
  136. package/build/lib/suspense.js +3 -15
  137. package/build/lib/suspense.js.map +1 -1
  138. package/build/lib/{suspense.esm.js → suspense.legacy.cjs} +8 -10
  139. package/build/lib/suspense.legacy.cjs.map +1 -0
  140. package/build/lib/{suspense.mjs → suspense.legacy.js} +3 -10
  141. package/build/lib/suspense.legacy.js.map +1 -0
  142. package/build/lib/types.d.ts +11 -10
  143. package/build/lib/types.d.ts.map +1 -0
  144. package/build/lib/useBaseQuery.cjs +80 -0
  145. package/build/lib/useBaseQuery.cjs.map +1 -0
  146. package/build/lib/useBaseQuery.d.ts +1 -0
  147. package/build/lib/useBaseQuery.d.ts.map +1 -0
  148. package/build/lib/useBaseQuery.js +30 -54
  149. package/build/lib/useBaseQuery.js.map +1 -1
  150. package/build/lib/useBaseQuery.legacy.cjs +80 -0
  151. package/build/lib/useBaseQuery.legacy.cjs.map +1 -0
  152. package/build/lib/{useBaseQuery.mjs → useBaseQuery.legacy.js} +16 -19
  153. package/build/lib/useBaseQuery.legacy.js.map +1 -0
  154. package/build/lib/useInfiniteQuery.cjs +15 -0
  155. package/build/lib/useInfiniteQuery.cjs.map +1 -0
  156. package/build/lib/useInfiniteQuery.d.ts +1 -0
  157. package/build/lib/useInfiniteQuery.d.ts.map +1 -0
  158. package/build/lib/useInfiniteQuery.js +6 -7
  159. package/build/lib/useInfiniteQuery.js.map +1 -1
  160. package/build/lib/useInfiniteQuery.legacy.cjs +15 -0
  161. package/build/lib/useInfiniteQuery.legacy.cjs.map +1 -0
  162. package/build/lib/{useInfiniteQuery.esm.js → useInfiniteQuery.legacy.js} +3 -2
  163. package/build/lib/useInfiniteQuery.legacy.js.map +1 -0
  164. package/build/lib/useIsFetching.cjs +34 -0
  165. package/build/lib/useIsFetching.cjs.map +1 -0
  166. package/build/lib/useIsFetching.d.ts +1 -0
  167. package/build/lib/useIsFetching.d.ts.map +1 -0
  168. package/build/lib/useIsFetching.js +7 -27
  169. package/build/lib/useIsFetching.js.map +1 -1
  170. package/build/lib/useIsFetching.legacy.cjs +34 -0
  171. package/build/lib/useIsFetching.legacy.cjs.map +1 -0
  172. package/build/lib/{useIsFetching.esm.js → useIsFetching.legacy.js} +3 -2
  173. package/build/lib/useIsFetching.legacy.js.map +1 -0
  174. package/build/lib/useMutation.cjs +54 -0
  175. package/build/lib/useMutation.cjs.map +1 -0
  176. package/build/lib/useMutation.d.ts +1 -0
  177. package/build/lib/useMutation.d.ts.map +1 -0
  178. package/build/lib/useMutation.js +12 -32
  179. package/build/lib/useMutation.js.map +1 -1
  180. package/build/lib/useMutation.legacy.cjs +54 -0
  181. package/build/lib/useMutation.legacy.cjs.map +1 -0
  182. package/build/lib/{useMutation.esm.js → useMutation.legacy.js} +5 -4
  183. package/build/lib/useMutation.legacy.js.map +1 -0
  184. package/build/lib/useMutationState.cjs +60 -0
  185. package/build/lib/useMutationState.cjs.map +1 -0
  186. package/build/lib/useMutationState.d.ts +4 -3
  187. package/build/lib/useMutationState.d.ts.map +1 -0
  188. package/build/lib/useMutationState.js +13 -34
  189. package/build/lib/useMutationState.js.map +1 -1
  190. package/build/lib/useMutationState.legacy.cjs +60 -0
  191. package/build/lib/useMutationState.legacy.cjs.map +1 -0
  192. package/build/lib/{useMutationState.esm.js → useMutationState.legacy.js} +3 -2
  193. package/build/lib/useMutationState.legacy.js.map +1 -0
  194. package/build/lib/useQueries.cjs +99 -0
  195. package/build/lib/useQueries.cjs.map +1 -0
  196. package/build/lib/useQueries.d.ts +10 -8
  197. package/build/lib/useQueries.d.ts.map +1 -0
  198. package/build/lib/useQueries.js +52 -67
  199. package/build/lib/useQueries.js.map +1 -1
  200. package/build/lib/useQueries.legacy.cjs +102 -0
  201. package/build/lib/useQueries.legacy.cjs.map +1 -0
  202. package/build/lib/{useQueries.esm.js → useQueries.legacy.js} +37 -28
  203. package/build/lib/useQueries.legacy.js.map +1 -0
  204. package/build/lib/useQuery.cjs +14 -0
  205. package/build/lib/useQuery.cjs.map +1 -0
  206. package/build/lib/useQuery.d.ts +3 -8
  207. package/build/lib/useQuery.d.ts.map +1 -0
  208. package/build/lib/useQuery.js +5 -6
  209. package/build/lib/useQuery.js.map +1 -1
  210. package/build/lib/useQuery.legacy.cjs +14 -0
  211. package/build/lib/useQuery.legacy.cjs.map +1 -0
  212. package/build/lib/{useQuery.esm.js → useQuery.legacy.js} +3 -2
  213. package/build/lib/useQuery.legacy.js.map +1 -0
  214. package/build/lib/{utils.mjs → utils.cjs} +4 -2
  215. package/build/lib/{utils.mjs.map → utils.cjs.map} +1 -1
  216. package/build/lib/utils.d.ts +1 -0
  217. package/build/lib/utils.d.ts.map +1 -0
  218. package/build/lib/utils.js +1 -3
  219. package/build/lib/utils.js.map +1 -1
  220. package/build/lib/utils.legacy.cjs +12 -0
  221. package/build/lib/utils.legacy.cjs.map +1 -0
  222. package/build/lib/{utils.esm.js → utils.legacy.js} +1 -1
  223. package/build/lib/utils.legacy.js.map +1 -0
  224. package/package.json +25 -15
  225. package/src/__tests__/QueryResetErrorBoundary.test.tsx +752 -620
  226. package/src/__tests__/ssr-hydration.test.tsx +2 -2
  227. package/src/__tests__/suspense.test.tsx +6 -88
  228. package/src/__tests__/useInfiniteQuery.type.test.tsx +0 -27
  229. package/src/__tests__/useMutation.test.tsx +4 -4
  230. package/src/__tests__/useMutationState.test.tsx +23 -0
  231. package/src/__tests__/useQueries.test.tsx +206 -83
  232. package/src/__tests__/useQuery.test.tsx +246 -338
  233. package/src/__tests__/useQuery.types.test.tsx +21 -0
  234. package/src/errorBoundaryUtils.ts +6 -5
  235. package/src/index.ts +1 -0
  236. package/src/queryOptions.ts +42 -0
  237. package/src/suspense.ts +9 -15
  238. package/src/useBaseQuery.ts +12 -23
  239. package/src/useInfiniteQuery.ts +1 -0
  240. package/src/useIsFetching.ts +1 -0
  241. package/src/useMutation.ts +2 -1
  242. package/src/useMutationState.ts +4 -3
  243. package/src/useQueries.ts +44 -26
  244. package/src/useQuery.ts +5 -17
  245. package/build/lib/HydrationBoundary.esm.js.map +0 -1
  246. package/build/lib/HydrationBoundary.mjs +0 -28
  247. package/build/lib/QueryClientProvider.esm.js.map +0 -1
  248. package/build/lib/QueryClientProvider.mjs +0 -30
  249. package/build/lib/QueryClientProvider.mjs.map +0 -1
  250. package/build/lib/QueryErrorResetBoundary.esm.js.map +0 -1
  251. package/build/lib/QueryErrorResetBoundary.mjs +0 -37
  252. package/build/lib/errorBoundaryUtils.esm.js.map +0 -1
  253. package/build/lib/errorBoundaryUtils.mjs +0 -27
  254. package/build/lib/errorBoundaryUtils.mjs.map +0 -1
  255. package/build/lib/index.esm.js +0 -12
  256. package/build/lib/index.esm.js.map +0 -1
  257. package/build/lib/index.mjs +0 -12
  258. package/build/lib/index.mjs.map +0 -1
  259. package/build/lib/isRestoring.esm.js.map +0 -1
  260. package/build/lib/isRestoring.mjs +0 -8
  261. package/build/lib/isRestoring.mjs.map +0 -1
  262. package/build/lib/suspense.esm.js.map +0 -1
  263. package/build/lib/suspense.mjs.map +0 -1
  264. package/build/lib/useBaseQuery.esm.js +0 -62
  265. package/build/lib/useBaseQuery.esm.js.map +0 -1
  266. package/build/lib/useBaseQuery.mjs.map +0 -1
  267. package/build/lib/useInfiniteQuery.esm.js.map +0 -1
  268. package/build/lib/useInfiniteQuery.mjs +0 -12
  269. package/build/lib/useInfiniteQuery.mjs.map +0 -1
  270. package/build/lib/useIsFetching.esm.js.map +0 -1
  271. package/build/lib/useIsFetching.mjs +0 -12
  272. package/build/lib/useIsFetching.mjs.map +0 -1
  273. package/build/lib/useMutation.esm.js.map +0 -1
  274. package/build/lib/useMutation.mjs +0 -32
  275. package/build/lib/useMutation.mjs.map +0 -1
  276. package/build/lib/useMutationState.esm.js.map +0 -1
  277. package/build/lib/useMutationState.mjs +0 -37
  278. package/build/lib/useMutationState.mjs.map +0 -1
  279. package/build/lib/useQueries.esm.js.map +0 -1
  280. package/build/lib/useQueries.mjs +0 -69
  281. package/build/lib/useQueries.mjs.map +0 -1
  282. package/build/lib/useQuery.esm.js.map +0 -1
  283. package/build/lib/useQuery.mjs +0 -11
  284. package/build/lib/useQuery.mjs.map +0 -1
  285. package/build/lib/utils.esm.js.map +0 -1
  286. package/build/umd/index.development.js +0 -3040
  287. package/build/umd/index.development.js.map +0 -1
  288. package/build/umd/index.production.js +0 -2
  289. package/build/umd/index.production.js.map +0 -1
  290. /package/src/{isRestoring.tsx → isRestoring.ts} +0 -0
@@ -0,0 +1,94 @@
1
+ import * as React from 'react'
2
+ import {
3
+ QueryCache,
4
+ QueryClient,
5
+ useInfiniteQuery,
6
+ useIsFetching,
7
+ useIsMutating,
8
+ useMutation,
9
+ useQueries,
10
+ useQuery,
11
+ useQueryClient,
12
+ } from 'react-query'
13
+
14
+ export const Examples = () => {
15
+ useQuery('todos')
16
+ useInfiniteQuery('todos')
17
+ useMutation('todos')
18
+ useIsFetching('todos')
19
+ useIsMutating('todos')
20
+ useQueries([query1, query2])
21
+ // QueryClient methods
22
+ // --- Instantiated hook call.
23
+ const queryClient = useQueryClient()
24
+ queryClient.getMutationDefaults('todos')
25
+ queryClient.getQueriesData('todos')
26
+ queryClient.getQueryData('todos')
27
+ queryClient.getQueryDefaults('todos')
28
+ queryClient.getQueryState('todos')
29
+ queryClient.isFetching('todos')
30
+ queryClient.setMutationDefaults('todos', { mutationFn: async () => null })
31
+ queryClient.setQueriesData('todos', () => null)
32
+ queryClient.setQueryData('todos', () => null)
33
+ queryClient.setQueryDefaults('todos', { queryFn: async () => null })
34
+ queryClient.cancelQueries('todos')
35
+ queryClient.fetchInfiniteQuery('todos')
36
+ queryClient.fetchQuery('todos')
37
+ queryClient.invalidateQueries('todos')
38
+ queryClient.prefetchInfiniteQuery('todos')
39
+ queryClient.prefetchQuery('todos')
40
+ queryClient.refetchQueries('todos')
41
+ queryClient.removeQueries('todos')
42
+ queryClient.resetQueries('todos')
43
+ // --- Direct hook call.
44
+ useQueryClient().getMutationDefaults('todos')
45
+ useQueryClient().getQueriesData('todos')
46
+ useQueryClient().getQueryData('todos')
47
+ useQueryClient().getQueryDefaults('todos')
48
+ useQueryClient().getQueryState('todos')
49
+ useQueryClient().isFetching('todos')
50
+ useQueryClient().setMutationDefaults('todos', {
51
+ mutationFn: async () => null,
52
+ })
53
+ useQueryClient().setQueriesData('todos', () => null)
54
+ useQueryClient().setQueryData('todos', () => null)
55
+ useQueryClient().setQueryDefaults('todos', { queryFn: async () => null })
56
+ useQueryClient().cancelQueries('todos')
57
+ useQueryClient().fetchInfiniteQuery('todos')
58
+ useQueryClient().fetchQuery('todos')
59
+ useQueryClient().invalidateQueries('todos')
60
+ useQueryClient().prefetchInfiniteQuery('todos')
61
+ useQueryClient().prefetchQuery('todos')
62
+ useQueryClient().refetchQueries('todos')
63
+ useQueryClient().removeQueries('todos')
64
+ useQueryClient().resetQueries('todos')
65
+ // QueryCache
66
+ // --- NewExpression
67
+ const queryCache1 = new QueryCache({
68
+ onError: (error) => console.log(error),
69
+ onSuccess: (success) => console.log(success)
70
+ })
71
+ queryCache1.find('todos')
72
+ queryCache1.findAll('todos')
73
+ // --- Instantiated hook call.
74
+ const queryClient1 = useQueryClient()
75
+ queryClient1.getQueryCache().find('todos')
76
+ queryClient1.getQueryCache().findAll('todos')
77
+ //
78
+ const queryClient2 = new QueryClient({})
79
+ queryClient2.getQueryCache().find('todos')
80
+ queryClient2.getQueryCache().findAll('todos')
81
+ //
82
+ const queryCache2 = queryClient1.getQueryCache()
83
+ queryCache2.find('todos')
84
+ queryCache2.findAll('todos')
85
+ // --- Direct hook call.
86
+ useQueryClient().getQueryCache().find('todos')
87
+ useQueryClient().getQueryCache().findAll('todos')
88
+ //
89
+ const queryCache3 = useQueryClient().getQueryCache()
90
+ queryCache3.find('todos')
91
+ queryCache3.findAll('todos')
92
+
93
+ return <div>Example Component</div>
94
+ }
@@ -0,0 +1,96 @@
1
+ import * as React from 'react'
2
+ import {
3
+ QueryCache,
4
+ QueryClient,
5
+ useInfiniteQuery,
6
+ useIsFetching,
7
+ useIsMutating,
8
+ useMutation,
9
+ useQueries,
10
+ useQuery,
11
+ useQueryClient,
12
+ } from 'react-query'
13
+
14
+ export const Examples = () => {
15
+ useQuery(['todos'])
16
+ useInfiniteQuery(['todos'])
17
+ useMutation(['todos'])
18
+ useIsFetching(['todos'])
19
+ useIsMutating(['todos'])
20
+ useQueries({
21
+ queries: [query1, query2]
22
+ })
23
+ // QueryClient methods
24
+ // --- Instantiated hook call.
25
+ const queryClient = useQueryClient()
26
+ queryClient.getMutationDefaults(['todos'])
27
+ queryClient.getQueriesData(['todos'])
28
+ queryClient.getQueryData(['todos'])
29
+ queryClient.getQueryDefaults(['todos'])
30
+ queryClient.getQueryState(['todos'])
31
+ queryClient.isFetching(['todos'])
32
+ queryClient.setMutationDefaults(['todos'], { mutationFn: async () => null })
33
+ queryClient.setQueriesData(['todos'], () => null)
34
+ queryClient.setQueryData(['todos'], () => null)
35
+ queryClient.setQueryDefaults(['todos'], { queryFn: async () => null })
36
+ queryClient.cancelQueries(['todos'])
37
+ queryClient.fetchInfiniteQuery(['todos'])
38
+ queryClient.fetchQuery(['todos'])
39
+ queryClient.invalidateQueries(['todos'])
40
+ queryClient.prefetchInfiniteQuery(['todos'])
41
+ queryClient.prefetchQuery(['todos'])
42
+ queryClient.refetchQueries(['todos'])
43
+ queryClient.removeQueries(['todos'])
44
+ queryClient.resetQueries(['todos'])
45
+ // --- Direct hook call.
46
+ useQueryClient().getMutationDefaults(['todos'])
47
+ useQueryClient().getQueriesData(['todos'])
48
+ useQueryClient().getQueryData(['todos'])
49
+ useQueryClient().getQueryDefaults(['todos'])
50
+ useQueryClient().getQueryState(['todos'])
51
+ useQueryClient().isFetching(['todos'])
52
+ useQueryClient().setMutationDefaults(['todos'], {
53
+ mutationFn: async () => null,
54
+ })
55
+ useQueryClient().setQueriesData(['todos'], () => null)
56
+ useQueryClient().setQueryData(['todos'], () => null)
57
+ useQueryClient().setQueryDefaults(['todos'], { queryFn: async () => null })
58
+ useQueryClient().cancelQueries(['todos'])
59
+ useQueryClient().fetchInfiniteQuery(['todos'])
60
+ useQueryClient().fetchQuery(['todos'])
61
+ useQueryClient().invalidateQueries(['todos'])
62
+ useQueryClient().prefetchInfiniteQuery(['todos'])
63
+ useQueryClient().prefetchQuery(['todos'])
64
+ useQueryClient().refetchQueries(['todos'])
65
+ useQueryClient().removeQueries(['todos'])
66
+ useQueryClient().resetQueries(['todos'])
67
+ // QueryCache
68
+ // --- NewExpression
69
+ const queryCache1 = new QueryCache({
70
+ onError: (error) => console.log(error),
71
+ onSuccess: (success) => console.log(success)
72
+ })
73
+ queryCache1.find(['todos'])
74
+ queryCache1.findAll(['todos'])
75
+ // --- Instantiated hook call.
76
+ const queryClient1 = useQueryClient()
77
+ queryClient1.getQueryCache().find(['todos'])
78
+ queryClient1.getQueryCache().findAll(['todos'])
79
+ //
80
+ const queryClient2 = new QueryClient({})
81
+ queryClient2.getQueryCache().find(['todos'])
82
+ queryClient2.getQueryCache().findAll(['todos'])
83
+ //
84
+ const queryCache2 = queryClient1.getQueryCache()
85
+ queryCache2.find(['todos'])
86
+ queryCache2.findAll(['todos'])
87
+ // --- Direct hook call.
88
+ useQueryClient().getQueryCache().find(['todos'])
89
+ useQueryClient().getQueryCache().findAll(['todos'])
90
+ //
91
+ const queryCache3 = useQueryClient().getQueryCache()
92
+ queryCache3.find(['todos'])
93
+ queryCache3.findAll(['todos'])
94
+
95
+ return <div>Example Component</div>
96
+ }
@@ -0,0 +1,96 @@
1
+ import * as React from 'react'
2
+ import {
3
+ QueryCache as RenamedQueryCache,
4
+ QueryClient as RenamedQueryClient,
5
+ useInfiniteQuery as useRenamedInfiniteQuery,
6
+ useIsFetching as useRenamedIsFetching,
7
+ useIsMutating as useRenamedIsMutating,
8
+ useMutation as useRenamedMutation,
9
+ useQueries as useRenamedQueries,
10
+ useQuery as useRenamedQuery,
11
+ useQueryClient as useRenamedQueryClient,
12
+ } from 'react-query'
13
+
14
+ export const Examples = () => {
15
+ useRenamedQuery('todos')
16
+ useRenamedInfiniteQuery('todos')
17
+ useRenamedMutation('todos')
18
+ useRenamedIsFetching('todos')
19
+ useRenamedIsMutating('todos')
20
+ useRenamedQueries([query1, query2])
21
+ // QueryClient methods
22
+ // --- Instantiated hook call.
23
+ const queryClient = useRenamedQueryClient()
24
+ queryClient.getMutationDefaults('todos')
25
+ queryClient.getQueriesData('todos')
26
+ queryClient.getQueryData('todos')
27
+ queryClient.getQueryDefaults('todos')
28
+ queryClient.getQueryState('todos')
29
+ queryClient.isFetching('todos')
30
+ queryClient.setMutationDefaults('todos', { mutationFn: async () => null })
31
+ queryClient.setQueriesData('todos', () => null)
32
+ queryClient.setQueryData('todos', () => null)
33
+ queryClient.setQueryDefaults('todos', { queryFn: async () => null })
34
+ queryClient.cancelQueries('todos')
35
+ queryClient.fetchInfiniteQuery('todos')
36
+ queryClient.fetchQuery('todos')
37
+ queryClient.invalidateQueries('todos')
38
+ queryClient.prefetchInfiniteQuery('todos')
39
+ queryClient.prefetchQuery('todos')
40
+ queryClient.refetchQueries('todos')
41
+ queryClient.removeQueries('todos')
42
+ queryClient.resetQueries('todos')
43
+ // --- Direct hook call.
44
+ useRenamedQueryClient().getMutationDefaults('todos')
45
+ useRenamedQueryClient().getQueriesData('todos')
46
+ useRenamedQueryClient().getQueryData('todos')
47
+ useRenamedQueryClient().getQueryDefaults('todos')
48
+ useRenamedQueryClient().getQueryState('todos')
49
+ useRenamedQueryClient().isFetching('todos')
50
+ useRenamedQueryClient().setMutationDefaults('todos', {
51
+ mutationFn: async () => null,
52
+ })
53
+ useRenamedQueryClient().setQueriesData('todos', () => null)
54
+ useRenamedQueryClient().setQueryData('todos', () => null)
55
+ useRenamedQueryClient().setQueryDefaults('todos', {
56
+ queryFn: async () => null,
57
+ })
58
+ useRenamedQueryClient().cancelQueries('todos')
59
+ useRenamedQueryClient().fetchInfiniteQuery('todos')
60
+ useRenamedQueryClient().fetchQuery('todos')
61
+ useRenamedQueryClient().invalidateQueries('todos')
62
+ useRenamedQueryClient().prefetchInfiniteQuery('todos')
63
+ useRenamedQueryClient().prefetchQuery('todos')
64
+ useRenamedQueryClient().refetchQueries('todos')
65
+ useRenamedQueryClient().removeQueries('todos')
66
+ useRenamedQueryClient().resetQueries('todos')
67
+ // QueryCache
68
+ // --- NewExpression
69
+ const queryCache1 = new RenamedQueryCache({
70
+ onError: (error) => console.log(error),
71
+ onSuccess: (success) => console.log(success)
72
+ })
73
+ queryCache1.find('todos')
74
+ queryCache1.findAll('todos')
75
+ // --- Instantiated hook call.
76
+ const queryClient1 = useRenamedQueryClient()
77
+ queryClient1.getQueryCache().find('todos')
78
+ queryClient1.getQueryCache().findAll('todos')
79
+ //
80
+ const queryClient2 = new RenamedQueryClient({})
81
+ queryClient2.getQueryCache().find('todos')
82
+ queryClient2.getQueryCache().findAll('todos')
83
+ //
84
+ const queryCache2 = queryClient1.getQueryCache()
85
+ queryCache2.find('todos')
86
+ queryCache2.findAll('todos')
87
+ // --- Direct hook call.
88
+ useRenamedQueryClient().getQueryCache().find('todos')
89
+ useRenamedQueryClient().getQueryCache().findAll('todos')
90
+ //
91
+ const queryCache3 = useRenamedQueryClient().getQueryCache()
92
+ queryCache3.find('todos')
93
+ queryCache3.findAll('todos')
94
+
95
+ return <div>Example Component</div>
96
+ }
@@ -0,0 +1,98 @@
1
+ import * as React from 'react'
2
+ import {
3
+ QueryCache as RenamedQueryCache,
4
+ QueryClient as RenamedQueryClient,
5
+ useInfiniteQuery as useRenamedInfiniteQuery,
6
+ useIsFetching as useRenamedIsFetching,
7
+ useIsMutating as useRenamedIsMutating,
8
+ useMutation as useRenamedMutation,
9
+ useQueries as useRenamedQueries,
10
+ useQuery as useRenamedQuery,
11
+ useQueryClient as useRenamedQueryClient,
12
+ } from 'react-query'
13
+
14
+ export const Examples = () => {
15
+ useRenamedQuery(['todos'])
16
+ useRenamedInfiniteQuery(['todos'])
17
+ useRenamedMutation(['todos'])
18
+ useRenamedIsFetching(['todos'])
19
+ useRenamedIsMutating(['todos'])
20
+ useRenamedQueries({
21
+ queries: [query1, query2]
22
+ })
23
+ // QueryClient methods
24
+ // --- Instantiated hook call.
25
+ const queryClient = useRenamedQueryClient()
26
+ queryClient.getMutationDefaults(['todos'])
27
+ queryClient.getQueriesData(['todos'])
28
+ queryClient.getQueryData(['todos'])
29
+ queryClient.getQueryDefaults(['todos'])
30
+ queryClient.getQueryState(['todos'])
31
+ queryClient.isFetching(['todos'])
32
+ queryClient.setMutationDefaults(['todos'], { mutationFn: async () => null })
33
+ queryClient.setQueriesData(['todos'], () => null)
34
+ queryClient.setQueryData(['todos'], () => null)
35
+ queryClient.setQueryDefaults(['todos'], { queryFn: async () => null })
36
+ queryClient.cancelQueries(['todos'])
37
+ queryClient.fetchInfiniteQuery(['todos'])
38
+ queryClient.fetchQuery(['todos'])
39
+ queryClient.invalidateQueries(['todos'])
40
+ queryClient.prefetchInfiniteQuery(['todos'])
41
+ queryClient.prefetchQuery(['todos'])
42
+ queryClient.refetchQueries(['todos'])
43
+ queryClient.removeQueries(['todos'])
44
+ queryClient.resetQueries(['todos'])
45
+ // --- Direct hook call.
46
+ useRenamedQueryClient().getMutationDefaults(['todos'])
47
+ useRenamedQueryClient().getQueriesData(['todos'])
48
+ useRenamedQueryClient().getQueryData(['todos'])
49
+ useRenamedQueryClient().getQueryDefaults(['todos'])
50
+ useRenamedQueryClient().getQueryState(['todos'])
51
+ useRenamedQueryClient().isFetching(['todos'])
52
+ useRenamedQueryClient().setMutationDefaults(['todos'], {
53
+ mutationFn: async () => null,
54
+ })
55
+ useRenamedQueryClient().setQueriesData(['todos'], () => null)
56
+ useRenamedQueryClient().setQueryData(['todos'], () => null)
57
+ useRenamedQueryClient().setQueryDefaults(['todos'], {
58
+ queryFn: async () => null,
59
+ })
60
+ useRenamedQueryClient().cancelQueries(['todos'])
61
+ useRenamedQueryClient().fetchInfiniteQuery(['todos'])
62
+ useRenamedQueryClient().fetchQuery(['todos'])
63
+ useRenamedQueryClient().invalidateQueries(['todos'])
64
+ useRenamedQueryClient().prefetchInfiniteQuery(['todos'])
65
+ useRenamedQueryClient().prefetchQuery(['todos'])
66
+ useRenamedQueryClient().refetchQueries(['todos'])
67
+ useRenamedQueryClient().removeQueries(['todos'])
68
+ useRenamedQueryClient().resetQueries(['todos'])
69
+ // QueryCache
70
+ // --- NewExpression
71
+ const queryCache1 = new RenamedQueryCache({
72
+ onError: (error) => console.log(error),
73
+ onSuccess: (success) => console.log(success)
74
+ })
75
+ queryCache1.find(['todos'])
76
+ queryCache1.findAll(['todos'])
77
+ // --- Instantiated hook call.
78
+ const queryClient1 = useRenamedQueryClient()
79
+ queryClient1.getQueryCache().find(['todos'])
80
+ queryClient1.getQueryCache().findAll(['todos'])
81
+ //
82
+ const queryClient2 = new RenamedQueryClient({})
83
+ queryClient2.getQueryCache().find(['todos'])
84
+ queryClient2.getQueryCache().findAll(['todos'])
85
+ //
86
+ const queryCache2 = queryClient1.getQueryCache()
87
+ queryCache2.find(['todos'])
88
+ queryCache2.findAll(['todos'])
89
+ // --- Direct hook call.
90
+ useRenamedQueryClient().getQueryCache().find(['todos'])
91
+ useRenamedQueryClient().getQueryCache().findAll(['todos'])
92
+ //
93
+ const queryCache3 = useRenamedQueryClient().getQueryCache()
94
+ queryCache3.find(['todos'])
95
+ queryCache3.findAll(['todos'])
96
+
97
+ return <div>Example Component</div>
98
+ }
@@ -0,0 +1,86 @@
1
+ import * as React from 'react'
2
+ import * as RQ from 'react-query'
3
+
4
+ export const Examples = () => {
5
+ RQ.useQuery('todos')
6
+ RQ.useInfiniteQuery('todos')
7
+ RQ.useMutation('todos')
8
+ RQ.useIsFetching('todos')
9
+ RQ.useIsMutating('todos')
10
+ RQ.useQueries([query1, query2])
11
+ // QueryClient methods
12
+ // --- Instantiated hook call.
13
+ const queryClient = RQ.useQueryClient()
14
+ queryClient.getMutationDefaults('todos')
15
+ queryClient.getQueriesData('todos')
16
+ queryClient.getQueryData('todos')
17
+ queryClient.getQueryDefaults('todos')
18
+ queryClient.getQueryState('todos')
19
+ queryClient.isFetching('todos')
20
+ queryClient.setMutationDefaults('todos', { mutationFn: async () => null })
21
+ queryClient.setQueriesData('todos', () => null)
22
+ queryClient.setQueryData('todos', () => null)
23
+ queryClient.setQueryDefaults('todos', { queryFn: async () => null })
24
+ queryClient.cancelQueries('todos')
25
+ queryClient.fetchInfiniteQuery('todos')
26
+ queryClient.fetchQuery('todos')
27
+ queryClient.invalidateQueries('todos')
28
+ queryClient.prefetchInfiniteQuery('todos')
29
+ queryClient.prefetchQuery('todos')
30
+ queryClient.refetchQueries('todos')
31
+ queryClient.removeQueries('todos')
32
+ queryClient.resetQueries('todos')
33
+ // --- Direct hook call.
34
+ RQ.useQueryClient().getMutationDefaults('todos')
35
+ RQ.useQueryClient().getQueriesData('todos')
36
+ RQ.useQueryClient().getQueryData('todos')
37
+ RQ.useQueryClient().getQueryDefaults('todos')
38
+ RQ.useQueryClient().getQueryState('todos')
39
+ RQ.useQueryClient().isFetching('todos')
40
+ RQ.useQueryClient().setMutationDefaults('todos', {
41
+ mutationFn: async () => null,
42
+ })
43
+ RQ.useQueryClient().setQueriesData('todos', () => null)
44
+ RQ.useQueryClient().setQueryData('todos', () => null)
45
+ RQ.useQueryClient().setQueryDefaults('todos', {
46
+ queryFn: async () => null,
47
+ })
48
+ RQ.useQueryClient().cancelQueries('todos')
49
+ RQ.useQueryClient().fetchInfiniteQuery('todos')
50
+ RQ.useQueryClient().fetchQuery('todos')
51
+ RQ.useQueryClient().invalidateQueries('todos')
52
+ RQ.useQueryClient().prefetchInfiniteQuery('todos')
53
+ RQ.useQueryClient().prefetchQuery('todos')
54
+ RQ.useQueryClient().refetchQueries('todos')
55
+ RQ.useQueryClient().removeQueries('todos')
56
+ RQ.useQueryClient().resetQueries('todos')
57
+ // QueryCache
58
+ // --- NewExpression
59
+ const queryCache1 = new RQ.QueryCache({
60
+ onError: (error) => console.log(error),
61
+ onSuccess: (success) => console.log(success)
62
+ })
63
+ queryCache1.find('todos')
64
+ queryCache1.findAll('todos')
65
+ // --- Instantiated hook call.
66
+ const queryClient1 = RQ.useQueryClient()
67
+ queryClient1.getQueryCache().find('todos')
68
+ queryClient1.getQueryCache().findAll('todos')
69
+ //
70
+ const queryClient2 = new RQ.QueryClient({})
71
+ queryClient2.getQueryCache().find('todos')
72
+ queryClient2.getQueryCache().findAll('todos')
73
+ //
74
+ const queryCache2 = queryClient1.getQueryCache()
75
+ queryCache2.find('todos')
76
+ queryCache2.findAll('todos')
77
+ // --- Direct hook call.
78
+ RQ.useQueryClient().getQueryCache().find('todos')
79
+ RQ.useQueryClient().getQueryCache().findAll('todos')
80
+ //
81
+ const queryCache3 = RQ.useQueryClient().getQueryCache()
82
+ queryCache3.find('todos')
83
+ queryCache3.findAll('todos')
84
+
85
+ return <div>Example Component</div>
86
+ }
@@ -0,0 +1,88 @@
1
+ import * as React from 'react'
2
+ import * as RQ from 'react-query'
3
+
4
+ export const Examples = () => {
5
+ RQ.useQuery(['todos'])
6
+ RQ.useInfiniteQuery(['todos'])
7
+ RQ.useMutation(['todos'])
8
+ RQ.useIsFetching(['todos'])
9
+ RQ.useIsMutating(['todos'])
10
+ RQ.useQueries({
11
+ queries: [query1, query2]
12
+ })
13
+ // QueryClient methods
14
+ // --- Instantiated hook call.
15
+ const queryClient = RQ.useQueryClient()
16
+ queryClient.getMutationDefaults(['todos'])
17
+ queryClient.getQueriesData(['todos'])
18
+ queryClient.getQueryData(['todos'])
19
+ queryClient.getQueryDefaults(['todos'])
20
+ queryClient.getQueryState(['todos'])
21
+ queryClient.isFetching(['todos'])
22
+ queryClient.setMutationDefaults(['todos'], { mutationFn: async () => null })
23
+ queryClient.setQueriesData(['todos'], () => null)
24
+ queryClient.setQueryData(['todos'], () => null)
25
+ queryClient.setQueryDefaults(['todos'], { queryFn: async () => null })
26
+ queryClient.cancelQueries(['todos'])
27
+ queryClient.fetchInfiniteQuery(['todos'])
28
+ queryClient.fetchQuery(['todos'])
29
+ queryClient.invalidateQueries(['todos'])
30
+ queryClient.prefetchInfiniteQuery(['todos'])
31
+ queryClient.prefetchQuery(['todos'])
32
+ queryClient.refetchQueries(['todos'])
33
+ queryClient.removeQueries(['todos'])
34
+ queryClient.resetQueries(['todos'])
35
+ // --- Direct hook call.
36
+ RQ.useQueryClient().getMutationDefaults(['todos'])
37
+ RQ.useQueryClient().getQueriesData(['todos'])
38
+ RQ.useQueryClient().getQueryData(['todos'])
39
+ RQ.useQueryClient().getQueryDefaults(['todos'])
40
+ RQ.useQueryClient().getQueryState(['todos'])
41
+ RQ.useQueryClient().isFetching(['todos'])
42
+ RQ.useQueryClient().setMutationDefaults(['todos'], {
43
+ mutationFn: async () => null,
44
+ })
45
+ RQ.useQueryClient().setQueriesData(['todos'], () => null)
46
+ RQ.useQueryClient().setQueryData(['todos'], () => null)
47
+ RQ.useQueryClient().setQueryDefaults(['todos'], {
48
+ queryFn: async () => null,
49
+ })
50
+ RQ.useQueryClient().cancelQueries(['todos'])
51
+ RQ.useQueryClient().fetchInfiniteQuery(['todos'])
52
+ RQ.useQueryClient().fetchQuery(['todos'])
53
+ RQ.useQueryClient().invalidateQueries(['todos'])
54
+ RQ.useQueryClient().prefetchInfiniteQuery(['todos'])
55
+ RQ.useQueryClient().prefetchQuery(['todos'])
56
+ RQ.useQueryClient().refetchQueries(['todos'])
57
+ RQ.useQueryClient().removeQueries(['todos'])
58
+ RQ.useQueryClient().resetQueries(['todos'])
59
+ // QueryCache
60
+ // --- NewExpression
61
+ const queryCache1 = new RQ.QueryCache({
62
+ onError: (error) => console.log(error),
63
+ onSuccess: (success) => console.log(success)
64
+ })
65
+ queryCache1.find(['todos'])
66
+ queryCache1.findAll(['todos'])
67
+ // --- Instantiated hook call.
68
+ const queryClient1 = RQ.useQueryClient()
69
+ queryClient1.getQueryCache().find(['todos'])
70
+ queryClient1.getQueryCache().findAll(['todos'])
71
+ //
72
+ const queryClient2 = new RQ.QueryClient({})
73
+ queryClient2.getQueryCache().find(['todos'])
74
+ queryClient2.getQueryCache().findAll(['todos'])
75
+ //
76
+ const queryCache2 = queryClient1.getQueryCache()
77
+ queryCache2.find(['todos'])
78
+ queryCache2.findAll(['todos'])
79
+ // --- Direct hook call.
80
+ RQ.useQueryClient().getQueryCache().find(['todos'])
81
+ RQ.useQueryClient().getQueryCache().findAll(['todos'])
82
+ //
83
+ const queryCache3 = RQ.useQueryClient().getQueryCache()
84
+ queryCache3.find(['todos'])
85
+ queryCache3.findAll(['todos'])
86
+
87
+ return <div>Example Component</div>
88
+ }
@@ -0,0 +1,49 @@
1
+ import * as React from 'react'
2
+ import { useMutation, useQuery, useQueryClient } from 'react-query'
3
+
4
+ export const ExampleWithStringLiteralKey = () => {
5
+ const stringLiteralKey = 'todos'
6
+ useQuery(stringLiteralKey)
7
+ useMutation(stringLiteralKey)
8
+ // QueryClient methods
9
+ // --- Instantiated hook call.
10
+ const queryClient = useQueryClient()
11
+ queryClient.cancelQueries(stringLiteralKey)
12
+ // --- Direct hook call.
13
+ useQueryClient().cancelQueries(stringLiteralKey)
14
+
15
+ return <div>Example Component</div>
16
+ }
17
+
18
+ export const ExampleWithTemplateLiteral = () => {
19
+ const templateLiteralKey = `todos`
20
+ useQuery(templateLiteralKey)
21
+ useMutation(templateLiteralKey)
22
+ }
23
+
24
+ export const ExampleWithArrayExpressionKey = () => {
25
+ const arrayExpressionKey = ['todos']
26
+ useQuery(arrayExpressionKey)
27
+ useMutation(arrayExpressionKey)
28
+ // QueryClient methods
29
+ // --- Instantiated hook call.
30
+ const queryClient = useQueryClient()
31
+ queryClient.cancelQueries(queryKey2)
32
+ // --- Direct hook call.
33
+ useQueryClient().cancelQueries(queryKey2)
34
+
35
+ return <div>Example Component</div>
36
+ }
37
+
38
+ export const ExampleWithUnknownKey = () => {
39
+ useQuery(unknownQueryKey)
40
+ useMutation(unknownQueryKey)
41
+ // QueryClient methods
42
+ // --- Instantiated hook call.
43
+ const queryClient = useQueryClient()
44
+ queryClient.cancelQueries(unknownQueryKey)
45
+ // --- Direct hook call.
46
+ useQueryClient().cancelQueries(unknownQueryKey)
47
+
48
+ return <div>Example Component</div>
49
+ }
@@ -0,0 +1,49 @@
1
+ import * as React from 'react'
2
+ import { useMutation, useQuery, useQueryClient } from 'react-query'
3
+
4
+ export const ExampleWithStringLiteralKey = () => {
5
+ const stringLiteralKey = 'todos'
6
+ useQuery([stringLiteralKey])
7
+ useMutation([stringLiteralKey])
8
+ // QueryClient methods
9
+ // --- Instantiated hook call.
10
+ const queryClient = useQueryClient()
11
+ queryClient.cancelQueries([stringLiteralKey])
12
+ // --- Direct hook call.
13
+ useQueryClient().cancelQueries([stringLiteralKey])
14
+
15
+ return <div>Example Component</div>
16
+ }
17
+
18
+ export const ExampleWithTemplateLiteral = () => {
19
+ const templateLiteralKey = `todos`
20
+ useQuery([templateLiteralKey])
21
+ useMutation([templateLiteralKey])
22
+ }
23
+
24
+ export const ExampleWithArrayExpressionKey = () => {
25
+ const arrayExpressionKey = ['todos']
26
+ useQuery(arrayExpressionKey)
27
+ useMutation(arrayExpressionKey)
28
+ // QueryClient methods
29
+ // --- Instantiated hook call.
30
+ const queryClient = useQueryClient()
31
+ queryClient.cancelQueries(queryKey2)
32
+ // --- Direct hook call.
33
+ useQueryClient().cancelQueries(queryKey2)
34
+
35
+ return <div>Example Component</div>
36
+ }
37
+
38
+ export const ExampleWithUnknownKey = () => {
39
+ useQuery(unknownQueryKey)
40
+ useMutation(unknownQueryKey)
41
+ // QueryClient methods
42
+ // --- Instantiated hook call.
43
+ const queryClient = useQueryClient()
44
+ queryClient.cancelQueries(unknownQueryKey)
45
+ // --- Direct hook call.
46
+ useQueryClient().cancelQueries(unknownQueryKey)
47
+
48
+ return <div>Example Component</div>
49
+ }