Migrating react-query v3 to tanstack-query v4
Im almost finishing this migration process
Right now the problem im having is on the getChanges function:
Deleting the undefined value solves this error highlighting but the fetch of the data fails.
Am I missing something ?
const getChanges = async (): Promise<Changeset | undefined> => {
try {
const { data } = await Axios.get<Changeset | undefined>('/changeset')
return data
} catch {
return undefined
}
}
const useChanges = <T = Changeset | undefined>(
options?: UseQueryOptions<Changeset | undefined, AxiosError, T>
) => {
return useQuery(['changes'], getChanges, {
keepPreviousData: true,
refetchOnWindowFocus: false,
staleTime: Infinity,
...options
})
}
export default useChangesconst getChanges = async (): Promise<Changeset | undefined> => {
try {
const { data } = await Axios.get<Changeset | undefined>('/changeset')
return data
} catch {
return undefined
}
}
const useChanges = <T = Changeset | undefined>(
options?: UseQueryOptions<Changeset | undefined, AxiosError, T>
) => {
return useQuery(['changes'], getChanges, {
keepPreviousData: true,
refetchOnWindowFocus: false,
staleTime: Infinity,
...options
})
}
export default useChangesRight now the problem im having is on the getChanges function:
Argument of type '() => Promise<Changeset | undefined>' is not assignable to parameter of type 'QueryFunction<Changeset, string[], any>'.Argument of type '() => Promise<Changeset | undefined>' is not assignable to parameter of type 'QueryFunction<Changeset, string[], any>'.Deleting the undefined value solves this error highlighting but the fetch of the data fails.
const getChanges = async (): Promise<Changeset> => {
try {
const { data } = await Axios.get<Changeset>('/changeset')
return data
} catch (error) {
throw new Error('Failed to fetch changeset')
}
}
const useChanges = <T = Changeset | undefined>(
options?: UseQueryOptions<Changeset | undefined, AxiosError, T>
) => {
return useQuery(['changes'], getChanges, {
keepPreviousData: true,
refetchOnWindowFocus: false,
staleTime: Infinity,
...options
})
}const getChanges = async (): Promise<Changeset> => {
try {
const { data } = await Axios.get<Changeset>('/changeset')
return data
} catch (error) {
throw new Error('Failed to fetch changeset')
}
}
const useChanges = <T = Changeset | undefined>(
options?: UseQueryOptions<Changeset | undefined, AxiosError, T>
) => {
return useQuery(['changes'], getChanges, {
keepPreviousData: true,
refetchOnWindowFocus: false,
staleTime: Infinity,
...options
})
}Missing queryFn for queryKey 'undefined' index.js:1191
XHRGET
http://localhost:3001/api/v2/changeset
[HTTP/1.1 404 Not Found 74ms]
Error: Failed to fetch changesetMissing queryFn for queryKey 'undefined' index.js:1191
XHRGET
http://localhost:3001/api/v2/changeset
[HTTP/1.1 404 Not Found 74ms]
Error: Failed to fetch changesetAm I missing something ?
