Customizable specific react-query hook

useCustomizableSpecificReactQueryHook.ts

// Usecase: Say you have an endpoint `/clients` and you have created a custom
// hook, that wraps over a `useQuery` that has a fixed `queryKey` and `queryFn`
// (because it is supposed to only fetch data from the `/clients` endpoint)
// However you want to be able to pass a valid `useQuery` config object in order
// to customize its behaviour (except for passing a custom queryKey or queryFn)
// This is one way to do this.
// 2023 Dimitris Karagiannis
// Twitter: @MitchKarajohn

export function useSpecificButCustomizableQuery(
  queryOptions: Omit<
    UseQueryOptions<
      TypeOfReturnValue,
      unknown,
      TypeOfReturnValue,
      TypeOfTheQueryKey
    >,
    'queryKey' | 'queryFn'
  > = {}
) {

  return useQuery<
    TypeOfReturnValue,
    unknown,
    TypeOfReturnValue,
    TypeOfTheQueryKey
  >({
    ...queryOptions,
    queryKey: ['your', 'key'],
    queryFn: (): Promise<TypeOfReturnValue> => {}
  });
}