Update profile menu to reflect actual name & role
This commit is contained in:
@@ -4,11 +4,10 @@ import {UserContext} from '@/common/contexts/UserContext.jsx';
|
||||
import './styles.sass';
|
||||
|
||||
export const ProfileMenu = () => {
|
||||
const {logout} = useContext(UserContext);
|
||||
const {logout, user} = useContext(UserContext);
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const menuRef = useRef(null);
|
||||
|
||||
// Close menu when clicking outside
|
||||
useEffect(() => {
|
||||
const handleClickOutside = (event) => {
|
||||
if (menuRef.current && !menuRef.current.contains(event.target)) {
|
||||
@@ -22,7 +21,6 @@ export const ProfileMenu = () => {
|
||||
};
|
||||
}, []);
|
||||
|
||||
// Close menu on escape key
|
||||
useEffect(() => {
|
||||
const handleEscapeKey = (event) => {
|
||||
if (event.key === 'Escape') {
|
||||
@@ -58,7 +56,7 @@ export const ProfileMenu = () => {
|
||||
<div className="profile-menu-avatar">
|
||||
<UserCircleIcon size={16} weight="fill"/>
|
||||
</div>
|
||||
<span className="profile-menu-name">Admin</span>
|
||||
<span className="profile-menu-name">{user.username}</span>
|
||||
<CaretDownIcon
|
||||
size={14}
|
||||
className={`profile-menu-caret ${isOpen ? 'rotated' : ''}`}
|
||||
@@ -72,8 +70,8 @@ export const ProfileMenu = () => {
|
||||
<UserCircleIcon size={20} weight="fill"/>
|
||||
</div>
|
||||
<div className="profile-menu-info">
|
||||
<div className="profile-menu-name-large">Admin User</div>
|
||||
<div className="profile-menu-role">Administrator</div>
|
||||
<div className="profile-menu-name-large">{user.username}</div>
|
||||
<div className="profile-menu-role">{user.role === 'admin' ? 'Administrator' : 'User'}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
Reference in New Issue
Block a user