feat: bar items better check for isActive
This commit is contained in:
@ -1,5 +1,5 @@
|
|||||||
import { useAuth } from "@/store/auth";
|
import { useAuth } from "@/store/auth";
|
||||||
import { Blocks, Home, Settings2, User } from "lucide-react";
|
import { Blocks, Home, Settings2, User, Users } from "lucide-react";
|
||||||
import { useCallback, type ReactNode } from "react";
|
import { useCallback, type ReactNode } from "react";
|
||||||
import { useLocation } from "react-router";
|
import { useLocation } from "react-router";
|
||||||
|
|
||||||
@ -16,7 +16,8 @@ export const useBarItems = (): [BarItem[], (item: BarItem) => boolean] => {
|
|||||||
|
|
||||||
const isActive = useCallback(
|
const isActive = useCallback(
|
||||||
(item: BarItem) => {
|
(item: BarItem) => {
|
||||||
return location.pathname === item.pathname;
|
if (item.pathname === "/") return location.pathname === item.pathname;
|
||||||
|
return location.pathname.startsWith(item.pathname);
|
||||||
},
|
},
|
||||||
[location.pathname],
|
[location.pathname],
|
||||||
);
|
);
|
||||||
@ -50,9 +51,15 @@ export const useBarItems = (): [BarItem[], (item: BarItem) => boolean] => {
|
|||||||
{
|
{
|
||||||
icon: <Blocks />,
|
icon: <Blocks />,
|
||||||
title: "API Services",
|
title: "API Services",
|
||||||
tab: "api-services",
|
tab: "admin.api-services",
|
||||||
pathname: "/admin/api-services",
|
pathname: "/admin/api-services",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
icon: <Users />,
|
||||||
|
title: "Users",
|
||||||
|
tab: "admin.users",
|
||||||
|
pathname: "/admin/users",
|
||||||
|
},
|
||||||
]
|
]
|
||||||
: []),
|
: []),
|
||||||
],
|
],
|
||||||
|
Reference in New Issue
Block a user