-
-
Notifications
You must be signed in to change notification settings - Fork 10.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Bug]: useNavigate inside useRoutes broken in 6.11.0 #10430
Comments
i have the same problem, i'm trying to create a funciton for authorization like the following: import { redirect } from "react-router-dom";
export async function requireAuth() {
// assume user is not loggend in
const isLoggedIn = false;
console.log("isLoggedIn", isLoggedIn);
if (!isLoggedIn) {
throw redirect("/login");
}
}; when i use it in a route like the following way: <Route
path="object"
element={<Object />}
loader={async () => await requireAuth()}
/> but i get an error page with the title Unexpected Application Error! indicating that i should provide a better ux experience to the end user with the following code. |
i changed the react router to version 6.4.3 and it works fine now. |
Thanks @mycroes - it looks like our detection of "are we in a data router" is a bit too broad and detects the top-level data router, without catching that we're nested in a separate |
This is fixed by #10432 and should be available once 6.11.1 is released |
Thanks a lot! |
🤖 Hello there, We just published version Thanks! |
🤖 Hello there, We just published version Thanks! |
What version of React Router are you using?
6.11.0
Steps to Reproduce
https://codesandbox.io/s/react-router-dom-6-11-0-si04vs
Summary:
<Link />
inside route rendered fromuseRoutes
is broken, error given indicates thatuseNavigate
inside route rendered fromuseRoutes
is actually broken. I'm expecting this is a bug and not incorrect usage (no matter that it's a regression since 6.10.0).Expected Behavior
Link renders (works in 6.10.0)
Actual Behavior
Following error is shown:
Error: useNavigate can only be used on routes that contain a unique "id" at invariant (https://si04vs.csb.app/node_modules/@remix-run/router/dist/router.js:407:11) at useCurrentRouteId (https://si04vs.csb.app/node_modules/react-router/dist/index.js:761:111) at useNavigateStable (https://si04vs.csb.app/node_modules/react-router/dist/index.js:843:12) at useNavigate (https://si04vs.csb.app/node_modules/react-router/dist/index.js:468:25) at useLinkClickHandler (https://si04vs.csb.app/node_modules/react-router-dom/dist/index.js:925:53) at LinkWithRef (https://si04vs.csb.app/node_modules/react-router-dom/dist/index.js:781:25) at renderWithHooks (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:16305:18) at updateForwardRef (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:19226:20) at beginWork (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:21636:16) at beginWork$1 (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:27426:14) at performUnitOfWork (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26557:12) at workLoopSync (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26466:5) at renderRootSync (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26434:7) at recoverFromConcurrentError (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:25850:20) at performConcurrentWorkOnRoot (https://si04vs.csb.app/node_modules/react-dom/cjs/react-dom.development.js:25750:22) at workLoop (https://si04vs.csb.app/node_modules/scheduler/cjs/scheduler.development.js:266:34) at flushWork (https://si04vs.csb.app/node_modules/scheduler/cjs/scheduler.development.js:239:14) at performWorkUntilDeadline (https://si04vs.csb.app/node_modules/scheduler/cjs/scheduler.development.js:533:21) at https://codesandbox.io/static/js/vendors~react-devtools-backend.98d1f41bf.chunk.js:1:230293 at h (https://codesandbox.io/static/js/vendors~react-devtools-backend.98d1f41bf.chunk.js:1:230408) at s (https://codesandbox.io/static/js/vendors~react-devtools-backend.98d1f41bf.chunk.js:1:229766)
The text was updated successfully, but these errors were encountered: