The path I'm trying to match is /threats/live/:id
We have a component where we usually render our breadcrumbs in and this was how they were built using react router v5:
const breadcrumbOptions = routes
.filter((route) => matchPath(pathname, { path: route.link, exact: false }))
.map((route) => ({
...route,
label: route.breadCrumbtitle,
onclick: undefined,
}))
For v6 this doesn't seem to work because it looks for :id in the url but instead finds the actual id.
I've tried the following but it still didn't work for me
const breadcrumbOptions = routes
.filter((route) =>
matchPath(
{ path: pathname, caseSensitive: false, end: false },
route.link
)
)
.map((route) => ({
...route,
label: route.breadcrumbTitle,
onclick: undefined,
}))
I think that in v6 the function parameters of matchPath were reversed.
Could you try to do
matchPath(route.link, pathname)
instead?