gitea/amati
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update: add icon TbMenu2 on app header

Browse Source
This commit is contained in:
abiyasa05 2024-11-14 14:02:57 +07:00
parent 3345e2408a
commit 21591abb81
1 changed files with 15 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
apps/frontend/src/components/AppHeader.tsx
View File

@ -8,6 +8,7 @@ import useAuth from "@/hooks/useAuth";
import { Avatar, AvatarFallback, AvatarImage } from "@/shadcn/components/ui/avatar";
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@/shadcn/components/ui/dropdown-menu";
import { Button } from "@/shadcn/components/ui/button";
import { TbMenu2 } from "react-icons/tb";
// import getUserMenus from "../actions/getUserMenus";
// import { useAuth } from "@/modules/auth/contexts/AuthContext";
// import UserMenuItem from "./UserMenuItem";
@ -25,6 +26,10 @@ interface User {
photoProfile?: string;
}
interface Props {
toggle: () => void;
}
// const mockUserData = {
// name: "Fulan bin Fulanah",
// email: "janspoon@fighter.dev",
@ -33,6 +38,7 @@ interface User {
export default function AppHeader({ toggle }: Props) {
const [userMenuOpened, setUserMenuOpened] = useState(false);
const [isLeftSidebarOpen, setIsLeftSidebarOpen] = useState(false);
const { user }: { user: User | null } = useAuth();
const isSuperAdmin = user?.role === "super-admin";
@ -41,6 +47,8 @@ export default function AppHeader({ toggle }: Props) {
// <UserMenuItem item={item} key={i} />
// ));
const toggleLeftSidebar = () => setIsLeftSidebarOpen(!isLeftSidebarOpen);
const { pathname } = useLocation();
const showAssessmentResultLinks = pathname === "/assessmentResult";
const showAssessmentLinks = pathname === "/assessment";
@ -62,16 +70,20 @@ export default function AppHeader({ toggle }: Props) {
</Button>
)}
{showAssessmentLinks && (
<TbMenu2 onClick={toggleLeftSidebar} className="fixed ml-2 mr-10 w-6 h-6" />
)}
<img
src={logo}
alt=""
className="w-44 h-fit px-8 py-5 object-cover"
alt="Logo"
className="w-44 h-fit px-8 py-5 object-cover hidden ml-4 lg:block"
/>
</div>
{/* Conditional Navlinks */}
{!isSuperAdmin && (
<div className="flex space-x-4 justify-center w-full">
<div className="flex space-x-4 justify-center w-full ml-14">
{showAssessmentResultLinks && (
<>
<Link