Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ReactQuery: useQuery not inherit data from select #1600

Open
vitorcamachoo opened this issue Aug 27, 2024 · 2 comments
Open

ReactQuery: useQuery not inherit data from select #1600

vitorcamachoo opened this issue Aug 27, 2024 · 2 comments
Labels
tanstack-query TanStack Query related issue

Comments

@vitorcamachoo
Copy link

vitorcamachoo commented Aug 27, 2024

What are the steps to reproduce this issue?

I am trying to follow this approach https://tkdodo.eu/blog/the-query-options-api, exporting only the query options and then we can prevent earlier abstractions, especially when extending the options of a query.

My approach was using the *QueryOptions generated interface and using their options to extend whatever I want so the result can be used with useQuery (for example).

The problem is that the generated query options do not pass correctly the select type to the result as we can see in the following images.

Query options builder:
Screenshot 2024-08-27 at 21 05 16

Result 1:
Screenshot 2024-08-27 at 21 06 01

Result 2:
Screenshot 2024-08-27 at 21 06 08

Result 3:
Screenshot 2024-08-27 at 21 06 14

By the way, what would be the best option to type the query options builder function? Sometimes I use:
1.

export const getProjectDisciplinesQueryOptions = (
  ...args: Parameters<typeof getGetApiProjectsProjectIdDisciplinesQueryOptions>
)
export const getProjectDisciplinesQueryOptions: typeof getGetApiProjectsProjectIdDisciplinesQueryOptions = (
  ...args
)

None of them works 100%.

One suggestion would be to start using what react query provides, queryOptions and infiniteQueryOptions. This would make the generated code much more prepared to be extended and they are useful when talking about types as we can see in the above blog post.
Example: https://github.com/kubb-labs/kubb/blob/main/examples/react-query/src/gen/hooks/useGetOrderByIdHook.ts#L27

We could also integrate a new configuration in the Orval to only generate the query options because, in my scenario, I am only interested in the query options and not in the useQuery* interfaces.

What versions are you using?

 System:
    OS: macOS 14.6.1
    CPU: (11) arm64 Apple M3 Pro
    Memory: 153.34 MB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  npmPackages:
    @tanstack/react-query: 5.52.1 => 5.52.1 
    axios: 1.7.2 => 1.7.2 
    orval: 6.21.0 => 6.21.0
@melloware melloware added the tanstack-query TanStack Query related issue label Aug 27, 2024
@melloware
Copy link
Collaborator

have you tried Orval 7.0.1?

@melloware melloware changed the title useQuery not inherit data from select react-query: useQuery not inherit data from select Aug 27, 2024
@melloware melloware changed the title react-query: useQuery not inherit data from select ReactQuery: useQuery not inherit data from select Aug 27, 2024
@vitorcamachoo
Copy link
Author

have you tried Orval 7.0.1?

Yes, same behaviour.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
tanstack-query TanStack Query related issue
Projects
None yet
Development

No branches or pull requests

2 participants