TanStackT
TanStack•2y ago•
7 replies
faint-white

Router Context not updating

basically the same problem as here: https://stackoverflow.com/questions/77856598/tanstack-router-how-to-pass-value-from-another-context
Setup is a little different because I am using react-query to get the currently logged in user.

export function App() {
  const currentUserQuery = useQuery(currentUserQueryOptions);
  if (currentUserQuery.isLoading)
    return (
        <Loader/>
    );

  console.log("router now has new context:", currentUserQuery.data);
   //^ this console log runs only once, and is never called again
  return (
    <Suspense
      fallback={
        <Loader/>
      }
    >
      <RouterProvider
        router={router}
        context={{ currentUser: currentUserQuery.data }}
      />
    </Suspense>
  );
}

Even when the query dev tools tell me that currentUserQuery.data has updated, the context still keeps the old values. This means I manually need to add 
useEffect
 in the protected routes and redirect users if they are not logged in, since I cannot rely on the context. What am I missing?
Stack Overflow
Tanstack Router - How to pass value from another context
I'm building a react app that is using Tanstack router, and I'd like to access values from a context provider that I created over to the router beforeLoad handler for a given route. My app structure
Tanstack Router - How to pass value from another context
Was this page helpful?