Changed to use NavLink to fix urls based on router (#2788)

This commit is contained in:
Erik Jan de Wit 2022-06-13 11:41:39 +02:00 committed by GitHub
parent fe0a5b9834
commit d05410d60d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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>
); );
}; };