Link to grandchild route broken in 2.3.0

[WillSmithTE]

Reproduction

https://stackblitz.com/edit/remix-run-remix-gbbwif?file=app%2Froutes%2F_.%24userId.blog.tsx

• Have a grandparent route (_), parent (_.$userId) and child (_.$userId.blog).
• From grandparent, use a Link <Link to="blog" relative="path">

System Info

It's same in stackblitz

Used Package Manager

npm

Expected Behavior

Clicking "Blog" shows the Blog route (Blog stuff goes here).

Actual Behavior

On 2.3.0, the route changes to /blog.

On 2.2.0, (the version in the blitz), the route correctly navigates to /$userId/blog

[brophdawg11]

This is due to a bug fix in React Router 6.19.0 where when relative="path" was specified, we were losing the contextual route starting point. This meant that the link href changed values every time you navigated since it was not properly tied to the contextual route.

All routing in React Router should be relative to the current route hierarchy, so relative links (or links starting with ./) start at the current location in the tree. Specifying path=relative changes the behavior of how .. works - by default it traverses the route hierarchy, but you can tell it to instead traverse the path by URL segment.

In your example, the Link in _.tsx is relative to that route (path /), so <Link to="blog" relative="path> now correctly results in /blog. If you want it to tack onto the end of the current pathname you have a few options:

// Use the current location
let location = useLocation();
<Link to={`${location.pathname}/blog`}>

// Or construct via the current params
let params = useParams();
<Link to={`${params.userId}/blog`}>

[WillSmithTE]

I guess your bug was my feature!

But thanks for the quick resolution, appreciate it