[V6] [Bug] .. navigation not working on the end of to path

[fxOne]

Version

react-router-dom@v6.0.0-beta.8

Steps to reproduce

I have the following route: /baseId/pagePath/inpectorPage/deleteDialog/id
If I use the following code:

const navigate = useNavigate();
navigate('..');

The route is resolved to /baseId/pagePath/inpectorPage which is correct.
But as I need to preplace the baseId I'm using the following code:

const navigate = useNavigate();
const location = useLocation();
navigate(`${location.pathname.replace('baseId', 'newBaseId')}/..`);

The result is /newBaseId/pagePath/inpectorPage/deleteDialog. The .. navigation goes only one folder up instead of the expected one component.

I would expect the issue is base on the check if .. is on the start of the to path:

react-router/packages/react-router/index.tsx

Line 1219 in 3485453

if (toPathname.startsWith("..")) {

[mjackson]

The .. segment only traverses up routes when it's placed at the beginning of a to value, before any other path segments.

To achieve what you're trying to do here I'd use useResolvedPath("..").replace('baseId', 'newBaseId') instead. That should get you where you want to go.