TanStackT
TanStack•5mo ago•
5 replies
radical-lime

Router context not defined by provider during loader/beforeLoad?

I'm setting up my router and wrapping my providers with Wrap:
export const createRouter = () => {
  const router = createTanStackRouter({
    routeTree,
    scrollRestoration: true,
    defaultPreloadStaleTime: 0,
    context: { auth: undefined! },
    defaultPendingComponent: () => <Loader />,
    defaultNotFoundComponent: () => <div>Not Found</div>,
    Wrap: ({ children }) => (
      <QueryClientProvider client={queryClient}>
        <AuthProvider>{children}</AuthProvider>
      </QueryClientProvider>
    ),
  })
  return router
}


When I print the context in the first layout, auth is still undefined:
export const Route = createFileRoute("/_authed")({
  beforeLoad: ({ context }) => {
    console.log("/_authed context:", context)
  },
  component: LayoutComponent,
})


I am just setting and returning the provider with isAuthenticated: true for testing but it seems the provider never loads before loader. How come? According to the authentication examples, this should be working?
Was this page helpful?