AcadeNice/AcadeDoc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix active settings path

Browse source
This commit is contained in:
Philipinho 2024-04-08 13:51:44 +01:00
parent 1a8cb9b397
commit b02cfd02f0
1 changed files with 5 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
apps/client/src/components/layouts/settings/settings-sidebar.tsx
View file

@ -9,7 +9,7 @@ import {
IconUsersGroup, IconUsersGroup,
IconSpaces, IconSpaces,
} from "@tabler/icons-react"; } from "@tabler/icons-react";
import { Link } from "react-router-dom"; import { Link, useLocation } from "react-router-dom";
import classes from "./settings.module.css"; import classes from "./settings.module.css";
interface DataItem { interface DataItem {
@ -52,7 +52,8 @@ const groupedData: DataGroup[] = [
]; ];
export default function SettingsSidebar() { export default function SettingsSidebar() {
const [active, setActive] = useState("Profile"); const pathname = useLocation().pathname;
const [active, setActive] = useState(pathname);
const menuItems = groupedData.map((group) => ( const menuItems = groupedData.map((group) => (
<div key={group.heading}> <div key={group.heading}>
@ -62,11 +63,11 @@ export default function SettingsSidebar() {
{group.items.map((item) => ( {group.items.map((item) => (
<Link <Link
className={classes.link} className={classes.link}
data-active={item.label === active || undefined} data-active={active.startsWith(item.path) || undefined}
key={item.label} key={item.label}
to={item.path} to={item.path}
onClick={() => { onClick={() => {
setActive(item.label); setActive(item.path);
}} }}
> >
<item.icon className={classes.linkIcon} stroke={2} /> <item.icon className={classes.linkIcon} stroke={2} />