How to derive "retrying" status

[keul]

Currently status can be one of the following:

• success
• loading
• error

But I think it can be useful to know also if the operation is a retry after a failure.

[tannerlinsley]

You can access and use the failureCount to derive this meta-state like this:

const { failureCount } = useQuery('posts', fetchPosts)

[xmflsct]

Seems like failureCount is reset when firing refetch? I am trying to let user say maximum retry 3 times by pressing a button.

[keul]

Great! Sorry I missed this from the doc!

[TkDodo]

I am trying to let user say maximum retry 3 times by pressing a button.

this sounds more like you want to set the retry option on useQuery ?

[xmflsct]

I understand. But what about allowing user to tap say max 3 times? Each tap could trigger say 3 times of retry. In this case, I need to manage max taps by myself?

[TkDodo]

Not sure I fully understand. If you have retry: 2 on your useQuery, I think all you would need to do is call refetch() on the button click, and then it would try 3 more times (one try and two retries)

[xmflsct]

Thanks for the follow up!

I mean this case, try to explain it in steps below:

1. useQuery's default 3 tries, all failed, returning status with error. During this stage, the button is disabled, with loading animation.
2. Now button becomes available, but saying connection failed. Now tapping on this button will fire first time refetch from user perspective.
3. useQuery goes through the same stage as step 1, same as the button state itself.
4. Still failed, now the user can tap again on the button to retry once more. This is the second time from the user perspective to try refetching.
5. useQuery goes throught the same stage as step 1, same as the button state itself.
6. Now I want to disallow the user to retry even more. <-- This is the stage I mean that I cannot rely on failureCount as it resets on each user's action on refetch. Or am I wrong?

[TkDodo]

Yes, I think you are right - Unless I'm mistaken, failureCount resets when you refetch. What you can do is a simple useState that keeps track of how often the user clicked and additionally disables the button if the user retried too much (you can also disable the query for example in that situation). You can keep that together with the useQuery in a custom hook, keeping this an "implementation detail" and only expose what you need in the view from the custom hook :)

[xmflsct]

Thank you! Same as my assumption, although I was expecting failureCount to be per mount. :) I will manage that with my own hook then.