admin/hspguard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: delimiter def

Browse Source
This commit is contained in:
Amir Adal
2025-06-13 21:45:32 +02:00
parent 7321448ce7
commit a8a0fa55b7
1 changed files with 30 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
web/src/hooks/barItems.tsx
View File

@ -1,21 +1,31 @@
import { useAuth } from "@/store/auth"; import { useAuth } from "@/store/auth";
import { Blocks, Home, Settings2, User, Users } from "lucide-react"; import { Blocks, Home, 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";
export interface BarDelimiter {
type: "delimiter";
key: string;
title?: string;
}
export interface BarItem { export interface BarItem {
type?: "nav";
icon: ReactNode; icon: ReactNode;
title: string; title: string;
tab: string; tab: string;
pathname: string; pathname: string;
} }
export const useBarItems = (): [BarItem[], (item: BarItem) => boolean] => { export type Item = BarItem | BarDelimiter;
export const useBarItems = (): [Item[], (item: Item) => boolean] => {
const profile = useAuth((state) => state.profile); const profile = useAuth((state) => state.profile);
const location = useLocation(); const location = useLocation();
const isActive = useCallback( const isActive = useCallback(
(item: BarItem) => { (item: Item) => {
if (item.type === "delimiter") return false;
if (item.pathname === "/") return location.pathname === item.pathname; if (item.pathname === "/") return location.pathname === item.pathname;
return location.pathname.startsWith(item.pathname); return location.pathname.startsWith(item.pathname);
}, },
@ -28,6 +38,11 @@ export const useBarItems = (): [BarItem[], (item: BarItem) => boolean] => {
return [ return [
[ [
{
type: "delimiter" as const,
title: "Basic",
key: "basic-del",
},
{ {
icon: <Home />, icon: <Home />,
title: "Home", title: "Home",
@ -40,14 +55,20 @@ export const useBarItems = (): [BarItem[], (item: BarItem) => boolean] => {
tab: "personal-info", tab: "personal-info",
pathname: "/personal-info", pathname: "/personal-info",
}, },
{ // TODO:
icon: <Settings2 />, // {
title: "Data & Personalization", // icon: <Settings2 />,
tab: "data-personalization", // title: "Data & Personalization",
pathname: "/data-personalize", // tab: "data-personalization",
}, // pathname: "/data-personalize",
// },
...(profile.is_admin ...(profile.is_admin
? [ ? [
{
type: "delimiter" as const,
title: "Admin",
key: "admin-del",
},
{ {
icon: <Blocks />, icon: <Blocks />,
title: "API Services", title: "API Services",