orval
orval copied to clipboard
anymaniax
Global useQuery Configuration does not apply to POST requests
What are the steps to reproduce this issue?
- In the orval.config.js, configure the operations as follows:
operations: {
query: {
useQuery: true,
},
};
- Use this configuration on a POST request in the OpenAPI schema.
- Generate the API using orval
What happens?
Even though useQuery: true is configured globally, the POST request generates a useMutation instead of a useQuery.
What were you expecting to happen?
I expected the POST request to generate useQuery based on the global configuration.
Any logs, error output, etc?
…
Any other comments?
When specifying the operationId explicitly in the orval.config.js:
operations: {
getSideMenu: {
query: {
useQuery: true,
},
},
};
I have found this https://github.com/orval-labs/orval/issues/515 Is it related?
What versions are you using?
System:
OS: macOS 12.1
CPU: (10) arm64 Apple M1 Pro
Memory: 107.91 MB / 16.00 GB
Shell: 5.8 - /bin/zsh
npmPackages:
@tanstack/react-query: 5.61.5 => 5.61.5
axios: 1.7.8 => 1.7.8
orval: 7.3.0 => 7.3.0
react: 18.3.1 => 18.3.1
See this ticket: https://github.com/orval-labs/orval/issues/1162
did you try..
query: {
useQuery: true,
useMutation: false,
}
there is my config
/* eslint-disable no-undef */
function header(info) {
return [
'eslint-disable',
'Generated by orval 🍺',
'Do not edit manually.',
...(info.title ? [info.title] : []),
...(info.description ? [info.description] : []),
...(info.version ? [`OpenAPI spec version: ${info.version}`] : [])
];
}
module.exports = {
bff: {
output: {
mode: 'single',
target: './src/api/bff/index.ts',
schemas: './src/api/bff/model',
client: 'react-query',
clean: true,
prettier: true,
headers: true,
override: {
header,
mutator: {
path: './src/shared/config/axios/instance.ts',
name: 'customInstance'
},
query: {
useQuery: true,
useMutation: false,
usePrefetch: true
}
}
},
input: {
target: './merged.yaml'
}
}
};
The useMutation: false setting does not generate hooks or prefetch for POST requests at all. The point is to enable POST requests to be made using useQuery as well.
To clarify the situation a bit, I want to know: is it possible to generate useQuery hooks for POST requests instead of useMutation? I assume that the current options act as a filter.
My code from back then looked something like this, but the override doesn’t appear to be functioning properly.
module.exports = {
example: {
output: {
mode: "single",
clean: true,
target: "api/index.ts",
schemas: "api/models",
client: "react-query",
override: {
operations: {
postExample: {
query: {
useQuery: true,
useMutation: false,
},
},
},
},
},
input: {
target:
"https://example.com/swagger/v1/swagger.yaml",
},
},
};
This bug is preventing us to upgrade to v7. Is there any known work around or maybe any directions on where to start to get this fixed in Orval?
@matheussampaio - I'm running into the same issue, I've tracked the regression back to this commit: https://github.com/orval-labs/orval/commit/d2baa511bc7600087d509273f79936f9f71fef58
The good news is that it only effects the latest version 7.10.0, if you use Orval 7.9.0 (eg. npx [email protected] --config ./orval.config.js) it works as expected. I've provided sample working config below for an example operation override for a POST operation.
module.exports = {
media: {
output: {
mode: 'tags-split',
target: 'src/client/query/',
schemas: 'src/client/model/',
client: 'react-query',
httpClient: 'fetch',
mock: true,
override: {
operations: {
getItems: {
query: {
useQuery: true,
},
},
},
},
},
input: {
target: './swagger.v3.json',
},
},
};
cc: @melloware , @dqhendricks
@joel1st I am trying to configure orval to generate useQueries for all POST requests,(along the useMutation) downgraded to 7.9.0 and still cannot make it work... Would you know if such global setting is possible?
What is getItems in your example?
Do I need to list all endpoints? (...a the issue is about "Global useQuery Configuration" I would not think so...)
Can I have useQuery and useMutation generated or I need to choose one? Thanks
PR with answers to my questions? In hey-api it works out of the box. No config needed.
no you don't need to list all endpoints the global config should work thus my comment of its a BUG and needs a PR. Thus the ticket was marked "Bug" on the right...
I ran into this problem yesterday as well, as @joel1st mentioned, it works if using 7.9.0, but in 7.10.0 useQuery: true is ignored. I don't have time at the moment to see if I can fix it and create a PR, but I hope it can get fixed soon!
Looking at the commit that @joel1st mentioned, it seems that the change means that operationQueryOptions are only applied if it's a GET request.
The problem seems to be in this PR: https://github.com/orval-labs/orval/pull/2097/files
if you restore this code, it should work again:
if (operationQueryOptions?.useInfinite !== undefined) {
isQuery = operationQueryOptions.useInfinite;
}
if (operationQueryOptions?.useSuspenseInfiniteQuery !== undefined) {
isQuery = operationQueryOptions.useSuspenseInfiniteQuery;
}
if (operationQueryOptions?.useQuery !== undefined) {
isQuery = operationQueryOptions.useQuery;
}
if (operationQueryOptions?.useSuspenseQuery !== undefined) {
isQuery = operationQueryOptions.useSuspenseQuery;
}
@kno if we restore the code you mention, then the issue where setting useQuery to false for an individual operation, will cause infinite queries to not be generated, even if useInfinite is set to true for that operation. There was already a merged pull request to fix the issue of per operation query settings being ignored if the verb is not GET here: #2188
I think the new issue that @Rigel772 mentions, of global query settings being ignored if it is not a GET request, must have been present for a while, as the code seems to have functioned that way since before I submitted any PRs.
There are a few things at play here. One, global query settings are ignored if it is a POST request, which I believe is due to this code checking the verb, and ignoring the global query settings if the verb is not GET:
let isQuery =
Verbs.GET === verb &&
(override.query.useQuery ||
override.query.useSuspenseQuery ||
override.query.useInfinite ||
override.query.useSuspenseInfiniteQuery);
The second issue, is that it sounds like @Rigel772 would like to be able to generate both mutation and query hooks at the same time (Correct me if I am wrong @Rigel772). That issue would be due to this code, a little below the previous code, which seems to have been present for a while as well. It essentially only lets you generate one or the other, query or mutation, if I understand it correctly.
// If both query and mutation are true for a non-GET operation, prioritize query
if (verb !== Verbs.GET && isQuery) {
isMutation = false;
}
// If both query and mutation are true for a GET operation, prioritize mutation
if (verb === Verbs.GET && isMutation) {
isQuery = false;
}
It seems easy enough to undo/change these things, but I worry about whether changing the code causing these issues would mean orval will generate queries, mutations, or both, for operations not meant to do so. Would need to research what the defaults are for the overrides, and have clarity on what the expected behavior is, to do it right.
I also worry about this code below, since it contains similar issues to the isQuery code. It seems to ignore global useMutation settings if the verb is GET. So if the expected behavior is that global settings can override the verb, we should probably change this too.
let isMutation = override.query.useMutation && verb !== Verbs.GET;
yeah i know i and i feel like this has been broken and unbroken so many times in the past.
I think we need to look at previous ticket use cases...and look at Git Blame for changes.
Then create a PR that fixes all those previous attempts as well as fixes this scenario.
Just my two cents.
