useRouteContext typing does not include context from beforeLoad

[nick-kang]

Describe the bug

// router.tsx
const dashboard = new Route({
  getParentRoute: () => root,
  path: 'dashboard',
  beforeLoad: () => {
    return { session: 'abc123' }
  },
  component: Dashboard,
})

// Dashboard.tsx
  const { session } = useRouteContext({  // session is not typed. session should be a string
    from: '/dashboard',
  })

Dashboard.tsx does not properly type the session from beforeLoad even though it is present in the route context.

Your Example Website or App

https://stackblitz.com/edit/github-73nmhk?file=src%2Fmain.tsx

Steps to Reproduce the Bug or Issue

See bug description

Expected behavior

useRouteContext should include the types from beforeLoad

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Chrome
• Version: 1.0.5

Additional context

No response

[schiller-manuel]

You need to use as const:

const { session } = useRouteContext({ from: '/' as const }); 

see https://stackblitz.com/edit/github-73nmhk-cs1a8c?file=src%2Fmain.tsx

alternative:

const { session } = useRouteContext({ from: indexRoute.id  });

https://stackblitz.com/edit/github-73nmhk-q45wa2?file=src%2Fmain.tsx

[CHE1RON]

@schiller-manuel Using the breadcrumbs example from the docs, how would you solve this issue there when retrieving routeContext from some match 🤔 (mainly asking because using/passing loader data to context does not seem possible). Migrating from react-router where I passed loader data to the handle prop

[schiller-manuel]

do you have a complete example on e.g. stackblitz?

[tadeumaia]

@schiller-manuel
From our conversation on https://discord.com/channels/719702312431386674/1194007808010625136

context is not typed at the RootRoute beforeload, only their children.

[schiller-manuel]

I'll close this as the original issue is resolved. Please feel free to open new issues for further discussion.