Skip to content

Commit cea3240

Browse files
author
liaoliao666
committed
feat: compatible with react-query v5
1 parent a6a844e commit cea3240

11 files changed

Lines changed: 214 additions & 114 deletions

‎.eslintrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
"@typescript-eslint/no-use-before-define": "off",
4848
"@typescript-eslint/no-empty-function": "off",
4949
"@typescript-eslint/no-explicit-any": "off",
50+
"@typescript-eslint/ban-ts-comment": "off",
5051
"jest/consistent-test-it": [
5152
"error",
5253
{ "fn": "it", "withinDescribe": "it" }

‎README-zh_CN.md‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -180,12 +180,13 @@ type Variables = { active: boolean }
180180

181181
const useProjects = createInfiniteQuery<Response, Variables, Error>({
182182
primaryKey: 'projects',
183-
queryFn: ({ queryKey: [_primaryKey, variables], pageParam = 1 }) => {
183+
queryFn: ({ queryKey: [_primaryKey, variables], pageParam }) => {
184184
return fetch(
185185
`/projects?cursor=${pageParam}?active=${variables.active}`
186186
).then(res => res.json())
187187
},
188188
getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
189+
defaultPageParam: 1
189190
})
190191

191192
const variables = { active: true }
@@ -305,7 +306,7 @@ function App() {
305306

306307
return (
307308
<div>
308-
{mutation.isLoading ? (
309+
{mutation.isPending ? (
309310
'Adding todo...'
310311
) : (
311312
<>
@@ -355,6 +356,7 @@ import { inferVariables, inferData } from 'react-query-kit'
355356

356357
type Variables = inferVariables<typeof usePost>
357358
type Data = inferData<typeof usePost>
359+
type FnData = inferFnData<typeof usePost>
358360
```
359361
360362
## 注意事项

‎README.md‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -189,12 +189,13 @@ type Variables = { active: boolean }
189189

190190
const useProjects = createInfiniteQuery<Response, Variables, Error>({
191191
primaryKey: 'projects',
192-
queryFn: ({ queryKey: [_primaryKey, variables], pageParam = 1 }) => {
192+
queryFn: ({ queryKey: [_primaryKey, variables], pageParam }) => {
193193
return fetch(
194194
`/projects?cursor=${pageParam}?active=${variables.active}`
195195
).then(res => res.json())
196196
},
197197
getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
198+
defaultPageParam: 1
198199
})
199200

200201
const variables = { active: true }
@@ -321,7 +322,7 @@ function App() {
321322

322323
return (
323324
<div>
324-
{mutation.isLoading ? (
325+
{mutation.isPending ? (
325326
'Adding todo...'
326327
) : (
327328
<>
@@ -370,6 +371,7 @@ import { inferVariables, inferData } from 'react-query-kit'
370371

371372
type Variables = inferVariables<typeof usePost>
372373
type Data = inferData<typeof usePost>
374+
type FnData = inferFnData<typeof usePost>
373375
```
374376
375377
## Caution

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
"@rollup/plugin-commonjs": "^22.0.2",
2828
"@rollup/plugin-node-resolve": "^13.2.1",
2929
"@rollup/plugin-replace": "^4.0.0",
30-
"@tanstack/react-query": "^4.2.3",
30+
"@tanstack/react-query": "^5.0.0-alpha.19",
3131
"@types/jest": "^28.1.6",
3232
"@typescript-eslint/eslint-plugin": "^5.32.0",
3333
"@typescript-eslint/parser": "^5.32.0",

‎src/createBaseQuery.ts‎

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import type { SetDataOptions, UseBaseQueryOptions } from '@tanstack/react-query'
22
import { useQueryClient } from '@tanstack/react-query'
3-
import type { Updater } from '@tanstack/react-query/build/types/packages/query-core/src/utils'
43
import type {
54
AdditionalCreateOptions,
65
AdditionalQueryHookOptions,
6+
Updater,
77
} from './types'
88

99
interface CreateQueryOptions
@@ -16,11 +16,12 @@ type QueryBaseHookOptions = Omit<
1616
UseBaseQueryOptions,
1717
'queryKey' | 'queryFn' | 'enabled'
1818
> &
19-
AdditionalQueryHookOptions<any, any>
19+
AdditionalQueryHookOptions<any, any> & { context?: any }
2020

2121
export function createBaseQuery(
2222
options: any,
23-
useRQHook: (options: any) => any
23+
useRQHook: (options: any, queryClient?: any) => any,
24+
queryClient?: any
2425
): any {
2526
const {
2627
primaryKey,
@@ -54,18 +55,26 @@ export function createBaseQuery(
5455
queryKey,
5556
}
5657

57-
const queryClient = useQueryClient({ context: mergedOptions.context })
58+
const client = useQueryClient(
59+
// @ts-ignore
60+
mergedOptions.context ? { context: mergedOptions.context } : queryClient
61+
)
5862

59-
const setData = (updater: Updater<any, any>, options?: SetDataOptions) =>
60-
queryClient.setQueryData(queryKey, updater, options)
63+
const setData = (
64+
updater: Updater<any, any>,
65+
setDataOptions?: SetDataOptions
66+
) => client.setQueryData(queryKey, updater, setDataOptions)
6167

62-
const result = useRQHook({
63-
...mergedOptions,
64-
enabled:
65-
typeof enabled === 'function'
66-
? enabled(queryClient.getQueryData(queryKey), variables)
67-
: enabled,
68-
})
68+
const result = useRQHook(
69+
{
70+
...mergedOptions,
71+
enabled:
72+
typeof enabled === 'function'
73+
? enabled(client.getQueryData(queryKey), variables)
74+
: enabled,
75+
},
76+
client
77+
)
6978

7079
return Object.assign(result, { queryKey, setData })
7180
}

‎src/createInfiniteQuery.ts‎

Lines changed: 61 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,83 @@
1-
import type { UseInfiniteQueryOptions } from '@tanstack/react-query'
1+
import type { QueryClient } from '@tanstack/react-query'
22
import { useInfiniteQuery } from '@tanstack/react-query'
33
import { createBaseQuery } from './createBaseQuery'
44
import type {
55
AdditionalCreateOptions,
6+
CompatibleUseInfiniteQueryOptions,
7+
CompatibleWithV4,
68
InfiniteQueryHook,
79
InfiniteQueryHookOptions,
8-
QueryKitKey,
910
} from './types'
1011

11-
interface CreateInfiniteQueryOptions<TFnData, TVariables, Error>
12+
interface CreateInfiniteQueryOptions<TFnData, TVariables, Error, TPageParam>
1213
extends Omit<
13-
UseInfiniteQueryOptions<
14-
TFnData,
15-
Error,
16-
TFnData,
17-
TFnData,
18-
QueryKitKey<TVariables>
19-
>,
14+
CompatibleUseInfiniteQueryOptions<TFnData, TVariables, Error, TPageParam>,
2015
'queryKey' | 'queryFn' | 'enabled' | 'select'
2116
>,
22-
AdditionalCreateOptions<TFnData, TVariables> {}
17+
AdditionalCreateOptions<TFnData, TVariables, TPageParam> {}
2318

24-
export function createInfiniteQuery<TFnData, TVariables = any, Error = unknown>(
25-
options: CreateInfiniteQueryOptions<TFnData, TVariables, Error> & {
19+
export function createInfiniteQuery<
20+
TFnData,
21+
TVariables = any,
22+
Error = unknown,
23+
TPageParam = number
24+
>(
25+
options: CreateInfiniteQueryOptions<
26+
TFnData,
27+
TVariables,
28+
Error,
29+
TPageParam
30+
> & {
2631
useDefaultOptions: () => Omit<
27-
InfiniteQueryHookOptions<TFnData, Error, TFnData, TVariables>,
32+
InfiniteQueryHookOptions<
33+
TFnData,
34+
Error,
35+
TVariables,
36+
TVariables,
37+
TPageParam
38+
>,
2839
'select'
2940
> & { variables: TVariables }
30-
}
31-
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables | void>
41+
},
42+
queryClient?: CompatibleWithV4<QueryClient, void>
43+
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables | void, TPageParam>
3244

33-
export function createInfiniteQuery<TFnData, TVariables = any, Error = unknown>(
34-
options: CreateInfiniteQueryOptions<TFnData, TVariables, Error> & {
45+
export function createInfiniteQuery<
46+
TFnData,
47+
TVariables = any,
48+
Error = unknown,
49+
TPageParam = number
50+
>(
51+
options: CreateInfiniteQueryOptions<
52+
TFnData,
53+
TVariables,
54+
Error,
55+
TPageParam
56+
> & {
3557
useDefaultOptions: () => Omit<
36-
InfiniteQueryHookOptions<TFnData, Error, TFnData, TVariables>,
58+
InfiniteQueryHookOptions<
59+
TFnData,
60+
Error,
61+
TVariables,
62+
TVariables,
63+
TPageParam
64+
>,
3765
'select' | 'variables'
3866
>
39-
}
40-
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables>
67+
},
68+
queryClient?: CompatibleWithV4<QueryClient, void>
69+
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables, TPageParam>
4170

42-
export function createInfiniteQuery<TFnData, TVariables = any, Error = unknown>(
43-
options: CreateInfiniteQueryOptions<TFnData, TVariables, Error>
44-
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables>
71+
export function createInfiniteQuery<
72+
TFnData,
73+
TVariables = any,
74+
Error = unknown,
75+
TPageParam = number
76+
>(
77+
options: CreateInfiniteQueryOptions<TFnData, TVariables, Error, TPageParam>,
78+
queryClient?: CompatibleWithV4<QueryClient, void>
79+
): InfiniteQueryHook<TFnData, TVariables, Error, TVariables, TPageParam>
4580

46-
export function createInfiniteQuery(options: any) {
47-
return createBaseQuery(options, useInfiniteQuery)
81+
export function createInfiniteQuery(options: any, queryClient?: any) {
82+
return createBaseQuery(options, useInfiniteQuery, queryClient)
4883
}

‎src/createMutation.ts‎

Lines changed: 21 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import { useMutation } from '@tanstack/react-query'
2-
import type { UseMutationOptions } from '@tanstack/react-query'
3-
import type { MutationHook, MutationHookOptions } from './types'
2+
import type { QueryClient, UseMutationOptions } from '@tanstack/react-query'
3+
import type {
4+
CompatibleWithV4,
5+
MutationHook,
6+
MutationHookOptions,
7+
} from './types'
48

59
interface CreateMutationOptions<TData, TError, TVariables, TContext>
610
extends UseMutationOptions<TData, TError, TVariables, TContext> {
@@ -17,24 +21,26 @@ export function createMutation<
1721
TVariables = void,
1822
TError = unknown,
1923
TContext = unknown
20-
>({
21-
useDefaultOptions,
22-
...defaultOptions
23-
}: CreateMutationOptions<TData, TError, TVariables, TContext>): MutationHook<
24-
TData,
25-
TError,
26-
TVariables
27-
> {
24+
>(
25+
{
26+
useDefaultOptions,
27+
...defaultOptions
28+
}: CreateMutationOptions<TData, TError, TVariables, TContext>,
29+
queryClient?: CompatibleWithV4<QueryClient, void>
30+
): MutationHook<TData, TError, TVariables> {
2831
const getKey = () => defaultOptions.mutationKey
2932

3033
const useGeneratedMutation = (
3134
options?: MutationHookOptions<TData, TError, TVariables, TContext>
3235
) => {
33-
return useMutation({
34-
...defaultOptions,
35-
...useDefaultOptions?.(),
36-
...options,
37-
})
36+
return useMutation(
37+
{
38+
...defaultOptions,
39+
...useDefaultOptions?.(),
40+
...options,
41+
},
42+
queryClient
43+
)
3844
}
3945

4046
return Object.assign(useGeneratedMutation, {

‎src/createQuery.tsx‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import type { UseQueryOptions } from '@tanstack/react-query'
1+
import type { QueryClient, UseQueryOptions } from '@tanstack/react-query'
22
import { useQuery } from '@tanstack/react-query'
33
import { createBaseQuery } from './createBaseQuery'
44
import type {
55
AdditionalCreateOptions,
6+
CompatibleWithV4,
67
QueryHook,
78
QueryHookOptions,
89
QueryKitKey,
@@ -21,7 +22,8 @@ export function createQuery<TFnData, TVariables = any, Error = unknown>(
2122
QueryHookOptions<TFnData, Error, TFnData, TVariables>,
2223
'select'
2324
> & { variables: TVariables }
24-
}
25+
},
26+
queryClient?: CompatibleWithV4<QueryClient, void>
2527
): QueryHook<TFnData, TVariables, Error, TVariables | void>
2628

2729
export function createQuery<TFnData, TVariables = any, Error = unknown>(
@@ -30,13 +32,15 @@ export function createQuery<TFnData, TVariables = any, Error = unknown>(
3032
QueryHookOptions<TFnData, Error, TFnData, TVariables>,
3133
'select' | 'variables'
3234
>
33-
}
35+
},
36+
queryClient?: CompatibleWithV4<QueryClient, void>
3437
): QueryHook<TFnData, TVariables, Error, TVariables>
3538

3639
export function createQuery<TFnData, TVariables = any, Error = unknown>(
37-
options: CreateQueryOptions<TFnData, TVariables, Error>
40+
options: CreateQueryOptions<TFnData, TVariables, Error>,
41+
queryClient?: CompatibleWithV4<QueryClient, void>
3842
): QueryHook<TFnData, TVariables, Error, TVariables>
3943

40-
export function createQuery(options: any) {
41-
return createBaseQuery(options, useQuery)
44+
export function createQuery(options: any, queryClient?: any) {
45+
return createBaseQuery(options, useQuery, queryClient)
4246
}

‎src/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,5 @@ export type {
1010
MutationHook,
1111
inferVariables,
1212
inferData,
13+
inferFnData,
1314
} from './types'

0 commit comments

Comments
 (0)