There is an issue with the current implementation and how react router handles navigation state. Navigation state can be obtained using the useNavigation hook. Using the current implementation, the state will always be idle, and not loading or submitting.
My guess is this happens because the generated loader returns immediately and the state will never have a chance to change. I encountered this issue before I found this package. I solved this by having my loader at the time return a Promise like so:
This is a recommended pattern if you need to avoid suspense but it works here to "manually keep track of a loading state".
I'm not sure what the best solution here is. The above works fine for single queries, but its unclear what should be done when multiple queries exist. React router has defer which may be useful here.
There is an issue with the current implementation and how react router handles navigation state. Navigation state can be obtained using the
useNavigation
hook. Using the current implementation, the state will always beidle
, and notloading
orsubmitting
.My guess is this happens because the generated loader returns immediately and the state will never have a chance to change. I encountered this issue before I found this package. I solved this by having my loader at the time return a Promise like so:
This is a recommended pattern if you need to avoid suspense but it works here to "manually keep track of a loading state".
I'm not sure what the best solution here is. The above works fine for single queries, but its unclear what should be done when multiple queries exist. React router has defer which may be useful here.