Unable to navigate using relative links

I'm running into an issue where I can't seem to navigate to a specific page from another page using relative links. This is my react component:

function DeviceLink({ id, name }: DeviceLinkProps) {
  const location = useLocation()
  console.log(`Location: ${JSON.stringify(location)}`)
  return <Link from={location.pathname} to={`./${id}/`}>{name}</Link>
}

function DeviceLink({ id, name }: DeviceLinkProps) {
  const location = useLocation()
  console.log(`Location: ${JSON.stringify(location)}`)
  return <Link from={location.pathname} to={`./${id}/`}>{name}</Link>
}

from

from

route path is

/org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices

/org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices

and the

to

to

path is shown above in the react component. I get this error in the console:

Error: Invariant failed: Could not find match for from: /org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices/93f77c03-8ac0-4425-9d97-842991a77196

Error: Invariant failed: Could not find match for from: /org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices/93f77c03-8ac0-4425-9d97-842991a77196

I have no idea what I'm missing or doing wrong. Anyone run into this issue before? Not sure if it's a bug...

TanStack•2y ago•

3 replies

colossal-harlequin

Unable to navigate using relative links

I'm running into an issue where I can't seem to navigate to a specific page from another page using relative links. This is my react component:

function DeviceLink({ id, name }: DeviceLinkProps) {
  const location = useLocation()
  console.log(`Location: ${JSON.stringify(location)}`)
  return <Link from={location.pathname} to={`./${id}/`}>{name}</Link>
}

function DeviceLink({ id, name }: DeviceLinkProps) {
  const location = useLocation()
  console.log(`Location: ${JSON.stringify(location)}`)
  return <Link from={location.pathname} to={`./${id}/`}>{name}</Link>
}

from

from

route path is

/org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices

/org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices

and the

to

to

path is shown above in the react component. I get this error in the console:

Error: Invariant failed: Could not find match for from: /org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices/93f77c03-8ac0-4425-9d97-842991a77196

Error: Invariant failed: Could not find match for from: /org/e096e8c3-ceaf-4cc2-ba8e-116b981a8c92/product/8c1e9150-3b55-47d4-b63b-a1d7e6912361/devices/93f77c03-8ac0-4425-9d97-842991a77196

I have no idea what I'm missing or doing wrong. Anyone run into this issue before? Not sure if it's a bug...

Unable to navigate using relative links

Similar Threads

Unable to navigate using relative links

Similar Threads

Similar Threads

Similar Threads