#possible solid router bug? navigate("../") doesn't go up when called from router root

23 messages · Page 1 of 1 (latest)

hasty token
#

possible solid router bug? navigate("../") doesn't go up when called from router root

sinful fossil
#

relative navigations are relative to the nearest route, not the url

#

in the case of the root component the nearest route is /

alpine fulcrum
#

somewhat of a simple solution is to just take the current path and take everything until the last /

#

yeah that seems fine to me, or use substring

sinful fossil
#

i think u could use useResolvedPath somehow to get a more reliable path

alpine fulcrum
#

I think it's internal to solid-router

sinful fossil
#

nah it's in solid router

#

i use it for some navbar stuff

#

yeah

alpine fulcrum
#

yeah

#

Maybe @brendonovich can provide an example, otherwise I would just go with the gpt answer

sinful fossil
#

i'm not sure it'll solve the problem with the route config you provided, is that actually what your route config will look like?

#

like all hardcoded sibling routes rather than nesting or a wildcard parameter?

#

i ask bc for urls like that i usually do

<Route path="/a">
  <Route path="/b">
    <Route path="/c">
#

but maybe your usecase isn't conducive to nesting

inland bay
#

Check this

<Router root={App}> <Route path="/a/b/c" component={PageC} /> <Route path="/a/b" component={PageB} /> <Route path="/a" component={PageA} /> <Route path="/" component={PageRoot} /> </Router>

sinful fossil
inland bay
sinful fossil
#

yeah bc u can generate the 'go up' route in the leaf route and then send it upwards to your root layout

#

the path splitting hack might just be good enough tbh

#

imma keep investingating tho, the router might have some extra utils

inland bay
#

this code will help you

import { useLocation, useNavigate } from "@solidjs/router";

function NavBar() {
  const navigate = useNavigate();
  const location = useLocation();

  function goUp() {
    const pathSegments = location.pathname.split("/").filter(Boolean);
    const parentPath = `/${pathSegments.slice(0, -1).join("/")}`;
    navigate(parentPath);
  }

  return <div onClick={goUp}>go up!!</div>;
}```