devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added user type to navbar

Browse Source
This commit is contained in:
Joao Ramos
2023-12-13 23:57:32 +00:00
parent 67925c8a9e
commit 9ad4f077d1
1 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/Navbar.tsx
View File

@@ -8,6 +8,7 @@ import clsx from "clsx";
import moment from "moment"; import moment from "moment";
import MobileMenu from "./MobileMenu"; import MobileMenu from "./MobileMenu";
import {useState} from "react"; import {useState} from "react";
import {Type} from "@/interfaces/user";
interface Props { interface Props {
user: User; user: User;
@@ -42,6 +43,9 @@ export default function Navbar({user, path, navDisabled = false, focusMode = fal
return today.add(7, "days").isAfter(momentDate); return today.add(7, "days").isAfter(momentDate);
}; };
const uppercaseFirstLetter = (string: Type) => string.charAt(0).toUpperCase() + string.slice(1);
return ( return (
<> <>
{user && <MobileMenu path={path} isOpen={isMenuOpen} onClose={() => setIsMenuOpen(false)} user={user} />} {user && <MobileMenu path={path} isOpen={isMenuOpen} onClose={() => setIsMenuOpen(false)} user={user} />}
@@ -67,10 +71,10 @@ export default function Navbar({user, path, navDisabled = false, focusMode = fal
{user.subscriptionExpirationDate && moment(user.subscriptionExpirationDate).format("DD/MM/YYYY")} {user.subscriptionExpirationDate && moment(user.subscriptionExpirationDate).format("DD/MM/YYYY")}
</Link> </Link>
)} )}
<Link href={disableNavigation ? "" : "/profile"} className="flex gap-6 items-center justify-end -md:hidden"> <Link href={disableNavigation ? "" : "/profile"} className="flex gap-6 items-center justify-end -md:hidden">
<img src={user.profilePicture} alt={user.name} className="w-10 h-10 rounded-full object-cover" /> <img src={user.profilePicture} alt={user.name} className="w-10 h-10 rounded-full object-cover" />
<span className="text-right -md:hidden">{user.name}</span> <span className="text-right -md:hidden">{user.name} | {uppercaseFirstLetter(user.type)}</span>
</Link> </Link>
<div className="cursor-pointer md:hidden" onClick={() => setIsMenuOpen(true)}> <div className="cursor-pointer md:hidden" onClick={() => setIsMenuOpen(true)}>
<BsList className="text-mti-purple-light w-8 h-8" /> <BsList className="text-mti-purple-light w-8 h-8" />
</div> </div>