[UI v2] feat: simplfies invalidating all variable queries #16140
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What does this PR do and why?
Simplifies invalidating all queries for
['variables']
.Looking at the code, it looks like we want to invalidate all queries starting with
'variables'
as the key.The simplest way of doing it is just passing
queryKey: variableKeys.all
, orqueryKey: ['variables']
. You don't need to iterate through all queries and evaluate each one for this caseReact Query's query key matching is simple. It will match query keys on how specific the key sequence is being passed.
eg:
Passing
['variables']
, will invalidate all query keys starting with'variables'
.Passing
['variables', 'filtered-count]
, will only invalidate all queries that matches up to this sequence, such as['variables', 'filter-count', 'foo']
['variables', 'filter-count', 'foo', 'bar']
['variables', 'filter-count', 'baz', {id: 1}]
🗒️ Sidenote and future enhancement: this is why query factories is a useful model. You can structure which queries you want to invalidate, and invalidate certain sequences. This is why
all()
is mapped with['variables']
. If you want to invalidate all queries relating to a'variables'
, just passqueryKey: ['variables']
(📖 https://tkdodo.eu/blog/the-query-options-api#query-factories)
Docs:
https://tanstack.com/query/latest/docs/framework/react/guides/query-invalidation#query-matching-with-invalidatequeries
Future
We should centralize the query keys so that they're accessible in the mutations called in
variables/data-table/cells
. Additionally, these mutations should probably be re-usable as hookshttps://github.com/PrefectHQ/prefect/blob/main/ui-v2/src/components/variables/data-table/cells.tsx#L40-L47
Checklist
<link to issue>
"mint.json
.Related to #15512