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

[typescript react-query] vue-query not compatible since 6.0.0 and tanstack v5 #538

Open
jbreuil opened this issue Dec 12, 2023 · 1 comment

Comments

@jbreuil
Copy link

jbreuil commented Dec 12, 2023

Which packages are impacted by your issue?

No response

Describe the bug

Until now you could replace @tanstack/react-query by @tanstack/vue-query and the plugin would work seamlessly.

Following the support of Tanstack v5 through this change this is not possible anymore as typescript is not resolving query options correctly.

The problem is a combination of the introduction of :

options?: Omit<${query.getOptions()}<${operationResultType}, TError, TData>, 'queryKey'> & { queryKey?: ${query.getOptions()}<${operationResultType}, TError, TData>['queryKey'] }
from the codegen plugin

and changes made to UseQueryOptions in @tanstack/vue-query.

Here is a minimal reproduction of the typing problem.

I will try to get a code reproduction if needed

Your Example Website or App

https://www.typescriptlang.org/play?ts=5.3.2#code/FDCWDsBcFMCcDMCGBjaACAStA5qAzjLGgN7AC+IkAngA7oAi0SArgDaQCissA9kQLyYc+QmmgAPGOAAmeEsDSK00pojadufAFxoI8OGgAqXXrADc5NAH4jJvmh13zlWugCKzOFQDS0KmkEsRGkecFYqAEFuRCoAHmZwAGtwHgB3cAA+CxVkVkRYdGRQgiF4AGUqAFsAIx5WHQTQAEdPNDwq2tYLMCg4JFRS2MMAtERwKgz5JTQAN0RWTx1DC2mAegAqdYVp9aNXZVB4fQKoUERIe1DwgDptpV2AdXRwaGhpNEgAC3wPnjRq9AQNA0ZjVVigZDKa6QOTVZiQZShADkCNSYwRoARFzanzSaGYNF04DQAEl6Bw7opdmoLkVKjRWNAYAAaNp-VLoZh4dCIYGwUBzGBoCo1OpEgjQYK3aZodarSkAbSw5Q6dQAujpILBPBYKNQ6GgAAr8yqYgXoQQEfngbBoAA+aHAzBqBgdtTqkuJbtAuCg9raqtY-oSKngEDe-qdrC6LgNAFkYgDlUNJoEmCn-ctgPr0ABVcCpWCIGgAGUl8BGxtApsg5v9ADEEsha6F-fRzugHU5-VhsBxxISHQmaLExlRWWPJg6nohEsPR+MJ+Mp8KmQuJv6Z4kymvJ9loLl8oVigiyp95qw0sqE7BEnAGuBmq12qKY9n9meL1f08NBJORsmhiTAAZFMSgKp+0bfvAN53rAapWJq2rQLqFg5mgABCiDcoYrhyJaWoQLaDpOi6RBujwHpjBYEg0HwGK9AgKDoMq+aFsWWGgKwuF0HIpAUDkeQFGgRTgCUGCIKkIqdA+T7oC+nT7oewmiSUkGXqkQTNuasH3vij4tPJgbdOhbFFjQyplNWDLQBmgjDBIUiyGgjbgNprYOlhOF4T2TC+fAZkcYgXE8dAeAKneVA8BWrEFuZnHcXhar+qQ0xKpJ0nqohHzIbq1hGA4BWOdAMhyPOegGN4rIVUQABqkw2POVVoIFFlMFZ9KMrE9WTEsYiSCVzlbuV4DHGgzU1Wg9X5cNxaxM1rWWdZXU9YVDkDaVq6QLEk3TTYO7bYt7XLbZq19cVm1bgdO2jQYe1oFda5HeUJ3dRkvVFRtzlBCEYSRNEcT-jYqXgd4RJoJF0VGBqLVxcWS2dbZhgKt4apZJY51fXIPDVAAVgeCKgSDigQeeUGaZK2kzNAunwdlLzU84ZD5cTaAKoa4OQxWhgwxzF3OQpYo2MjhrJToz1DOzaN5Us3S0fRHz7BLQEjOtTlyOp0E3WN921Wt-Xq4Mu0NbD7FtS9iNvYVz0dTZKYmfsjDQDQyupp9hutWWiAVsL+v83IyaTbmJtOy7cPm7Ewd+1jJDM8DirGjwdCwNQnN+FDPM6KHyvs7wyfUNLGOm+ZgEZLG6AJlQSZMKHdloJX1fwEMBuDXIrnucSvuY4bOP482LMJ3ncCp0CXPQzoDfQMqtci0PKdUIXzNLOj6GT8qADysAAOJMoQddrz+K4ABRHwAlAEkyGKfaH7A8mKfFgLSgAU0hDKyYP+xD6fc27wxE4qAB9cGqMdDEDIKhEAEBCD9HcJ4WAVB17VG5LARm68aAtjEkMDwXh6zgHbJAXkggEjJDSOAVkxhNACDQIwFg7AnDkPwYQow2D4G4MYeQlhVBGGq04Ww84iAOFwJ8H4Fum1OG+H8IIcRfhyGGkQNgaAciiyVBGAzOAkxP6cLQRgvAWChF8IIeQ+hzChHsJMV4CRsj5GKPyIgSokxWYEHmNAQw1ZoD02dACJmkDGIwLQFo9BoBih6JwXg-hIxiEpHSEYyhIwaFqDoZQhh4T7K8LCYY8x8CJGiOctIyR-ihGWKMHIhRSi7GqOgIzBxlJDJZL8NlQweTdQ+OgcxNAO9IC5mQZwkg+JkHZWII6Ox0AdBWiImgZmFB3wGi6dAAJOiQmsPSUwyJpCYmmDiaodQxjDDcNSfo5ZgivB7MyVQAxAjTnZM0YUkRUibkbkEAfJurNc5J2Hv4Ue38CleEQcg1BgTgmNIOWYihphkkZKBcc-hRy6kTF5nPVOn8kS1LOeAJE+UtFILgP8hZkKlkgp2SCzhZjs7h0Ank96rz84L0KonalOS5BIhKogMEbx0WNUTFPJgm8Ol70xX8uA2igmYLxaiglSSjBEtMdCy5fgMhUveWjQqTza53y+I-Zgz83ixH5diwVAKRVpPFWCyVMrRVSosXK1kyL7lInlXSxV6MyDo2megIVxQd4vCLDAaQoURjrxrJHbk8zhW6I6bM2AnDWSrOie0pkEbOEZGtSiiRdq0BEzQCm+pOgxwTJAKpBEScdE6HdWJT1cAOy+v2IIRxBDGSuMqCMtAABWWUaAABsAAGNtABGTt-bmTkGAEAA

Steps to Reproduce the Bug or Issue

Generate with codegen
Replace react-query by vue-query
Use options in a generated custom useQuery hook
Correct options object is considered invalid by typescript

Expected behavior

query options like
{
staleTime: 60,
}
should be valid (typescript)

Screenshots or Videos

No response

Platform

  • OS: [e.g. macOS, Windows, Linux]
  • NodeJS: [e.g. 18.5.0]
  • graphql version: [e.g. 16.3.0]
  • @graphql-codegen/* version(s): [e.g. 2.6.2]

Codegen Config File

plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
config: {
reactQueryVersion: 4,
useTypeImports: true,
addInfiniteQuery: true,
exposeDocument: true,
exposeQueryKeys: true,
exposeFetcher: true,
skipTypename: true,
maybeValue: 'T | undefined',
},

Additional context

No response

@jbreuil
Copy link
Author

jbreuil commented Dec 12, 2023

Minimal repro stack blitz
=> execute vue-tsc in terminal to show the problem

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant