Open nitedani opened 1 month ago
Yes, that would be wonderful.
How about something like this?
cache(getFruits, ['fruits'])
export async function addFruit(fruit: { id: number; name: string }) {
db.push(fruit);
}
cache(updateFruit, input => ['fruit', input.id])
export async function updateFruit(input: { id: number; name: string }) {
const fruit = db.find((fruit) => fruit.id === input.id);
if (fruit) {
fruit.name = input.name;
}
return fruit;
}
cache(getFruit, input => ['fruit', input.id])
export async function getFruit(id: number) {
return db.find((fruit) => fruit.id === id);
}
cache(getFruits, ['fruits'])
export async function getFruits() {
return db;
}
The cache is invalidated when useMutation()
is used.
I feel like invalidating over a cache key is more robust than directly invalidating telefunctions? It's also more TanStack Query idiomatic I think?
Also, maybe we can name it vike-react-telefunc-query
for now (I want to experiment with a separate extension that doesn't use TanStack Query). I'm not sure yet which one will end up being the main extension. (Ideally, we can have a single vike-react-telefunc
with an optional features/peer dependency with vike-react-query
, but I don't know how feasible that is.)
(Maybe we shouldn't name it cache()
but key()
or queryKey()
to better align with TanStack Query.)
Ideas for
vike-react-telefunc
Right now, to integrate
telefunc
and@tanstack/react-query
, we need to write some boilerplate for query invalidation:It would be nice, if this integration could be simplified, for example:
What do you think?