From 45c82424fcf525fa9cc28560ded4464394339d37 Mon Sep 17 00:00:00 2001
From: hanan o <77591083+heosman@users.noreply.github.com>
Date: Thu, 23 May 2024 14:21:10 -0700
Subject: [PATCH] belindas-closet-nextjs_7_392_nav-bar-drop-down-menu (#393)

* Condense "Profile" and "My account"

* Route users from My Account button to proper pages
---
 components/AuthProfileMenu.tsx | 26 +++++++++++++++++++++-----
 1 file changed, 21 insertions(+), 5 deletions(-)

diff --git a/components/AuthProfileMenu.tsx b/components/AuthProfileMenu.tsx
index 02a3b2a3..1c563609 100644
--- a/components/AuthProfileMenu.tsx
+++ b/components/AuthProfileMenu.tsx
@@ -15,6 +15,15 @@ import React, { Fragment } from "react";
 
 export default function AuthProfileMenu() {
   const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
+  const [userRole, setUserRole] = React.useState("");
+  const token = localStorage.getItem("token");
+  React.useEffect(() => {
+    if (token) {
+      const role = JSON.parse(atob(token.split(".")[1])).role;
+      setUserRole(role);
+    }
+  }, [token, userRole]);
+  
   const open = Boolean(anchorEl);
   const handleClick = (event: React.MouseEvent<HTMLElement>) => {
     setAnchorEl(event.currentTarget);
@@ -25,6 +34,16 @@ export default function AuthProfileMenu() {
 
   const router = useRouter();
 
+  const handleMyAccount = () => {
+    if (userRole == "admin") {
+      router.push("/admin-page")
+    } else if (userRole == "creator") {
+      router.push("/creator-page")
+    } else {
+      router.push("/profile")
+    }
+  };
+
   const handleLogOut = () => {
     localStorage.removeItem("token");
     window.location.reload();
@@ -81,11 +100,8 @@ export default function AuthProfileMenu() {
         transformOrigin={{ horizontal: "right", vertical: "top" }}
         anchorOrigin={{ horizontal: "right", vertical: "bottom" }}
       >
-        <MenuItem onClick={handleClose}>
-          <Avatar /> Profile
-        </MenuItem>
-        <MenuItem onClick={handleClose}>
-          <Avatar /> My account
+        <MenuItem onClick={handleMyAccount}>
+          <Avatar /> My Account
         </MenuItem>
         <Divider />
         <MenuItem onClick={handleClose}>