More smart refetchOnMount

[artem-malko]

Hey)

I have an example of usage of the same query in two different React-components: https://codesandbox.io/p/sandbox/refetchonmount-getobservercount-kd88g2?file=%2Fsrc%2FApp.js%3A13%2C2 The second component appears only after "Show Comp2!" button click.

In a console you can see a log from api call, cause <Comp1 /> uses useAppQuery. And you will see another log from api after <Comp2 /> mount, cause useAppQuery is used there too. I'm talking about react-query usage with defaults from react-query.

But it is useless for me, when the second call of useAppQuery in <Comp2 /> triggers api call. So, as I can see it from docs, I can pass a function to refetchOnMount option. Like here (commented): https://codesandbox.io/p/sandbox/refetchonmount-getobservercount-kd88g2?file=%2Fsrc%2Findex.js%3A12%2C10-12%2C24 I can check, that current query does not have any active observers. And if there are no any observes — we should refetch. And we do not refetch otherwise.

refetchOnMount: (query) => {
    return !query.getObserversCount();
},

So, is it a good idea? Do you see any problems?

I can see only one problem, that <Comp2 /> can have outdated data. But invalidation should work (cause <Comp1 /> is mounted).

@TkDodo may be you can give me some ideas =)

[artem-malko]

Another idea is to have staleTime: Infinity in defaults. But, it's not as flexible as my idea from the topic. Cause Infinity means that I have to manually invalidate data even on Read-operations.

[vossmalte]

What's your use case? What about a stale time of 60*1000? Is that a good compromise?

Other than that: I like your approach. But is having an observer a good metric for not being outdated? I don't think so.

[artem-malko]

Thx for your interest)

My case — a lot of components on one page, which uses the same query. staleTime 60*1000 could be ok, but not in my case, cause components can be appended during more than 60*1000 ms. And I don't want to calculate that time for each type of query.

But is having an observer a good metric for not being outdated?

That is the question) Waiting for feedback from maintainers (@TkDodo for example =) )

Actually, I think, that the most smart idea is to set staleTime after request data received, cause there can be cache time info. But it is not possible in case of use-query.

[artem-malko]

@TkDodo I do need your opinion, please) You know everything about react-query)