Changed to use NavLink to fix urls based on router (#2788)
This commit is contained in:
parent
fe0a5b9834
commit
d05410d60d
1 changed files with 7 additions and 5 deletions
|
@ -1,5 +1,5 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useHistory, useRouteMatch } from "react-router-dom";
|
import { NavLink, useHistory, useRouteMatch } from "react-router-dom";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import {
|
import {
|
||||||
Nav,
|
Nav,
|
||||||
|
@ -52,17 +52,19 @@ export const PageNav: React.FunctionComponent = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
//remove "/realm-name" from the start of the path
|
//remove "/realm-name" from the start of the path
|
||||||
const activeItem = history.location.pathname.substr(realm.length + 1);
|
const activeItem = history.location.pathname.substring(realm.length + 1);
|
||||||
return (
|
return (
|
||||||
<NavItem
|
<NavLink
|
||||||
id={"nav-item" + path.replace("/", "-")}
|
id={"nav-item" + path.replace("/", "-")}
|
||||||
to={`/${realm}${path}`}
|
to={`/${realm}${path}`}
|
||||||
isActive={
|
className="pf-c-nav__link"
|
||||||
|
activeClassName="pf-m-current"
|
||||||
|
isActive={() =>
|
||||||
path === activeItem || (path !== "/" && activeItem.startsWith(path))
|
path === activeItem || (path !== "/" && activeItem.startsWith(path))
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{t(title)}
|
{t(title)}
|
||||||
</NavItem>
|
</NavLink>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue