From 8bf3abb5b6f5d74178b240a5140a36e71a0235e4 Mon Sep 17 00:00:00 2001
From: Yash Rathore <rathorey467@gmail.com>
Date: Tue, 10 Nov 2020 22:22:45 +0530
Subject: [PATCH] Fixed PropOver

---
 web/src/layouts/MainLayout/MainLayout.js | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/web/src/layouts/MainLayout/MainLayout.js b/web/src/layouts/MainLayout/MainLayout.js
index 33a8215..045609d 100644
--- a/web/src/layouts/MainLayout/MainLayout.js
+++ b/web/src/layouts/MainLayout/MainLayout.js
@@ -25,7 +25,6 @@ import logo from 'src/layouts/MainLayout/Logo_2.jpg'
 const MainLayout = ({ children}) => {
   const { logIn, logOut, isAuthenticated, currentUser } = useAuth()
   const {data, loading} = useQuery(QUERY, {variables: {id: currentUser?.sub}})
-  console.log(data?.user?.name);
   const [isOpen, setIsOpen] = useState(false)
   const [anchorEl, setAnchorEl] = useState(null)
   const [popoverId, setPopoverId] = useState(undefined)
@@ -72,9 +71,12 @@ const MainLayout = ({ children}) => {
           </ul>
           <ul className="flex items-center">
             <li className={getActiveClasses("mr-8 h-10 w-10 rounded-full border-2 border-gray-700 flex items-center justify-center", {'border-indigo-300': currentUser})}>
-              <button className="h-full w-full" onClick={() => currentUser && routes.newPart2({userName: data?.user?.userName})}>
-              <Svg name="plus" className={getActiveClasses("text-gray-700 w-full h-full",{'text-indigo-300': currentUser})} />
-              </button>
+              {isAuthenticated && data?.user?.userName ?
+                <Link className="h-full w-full" to={routes.newPart2({userName: data?.user?.userName})}>
+                  <Svg name="plus" className="text-indigo-300 w-full h-full" />
+                </Link>:
+                <Svg name="plus" className="text-gray-700 w-full h-full" />
+              }
             </li>
             <li className="h-10 w-10 border-1 rounded-full border-indigo-300 text-indigo-200">
             <div aria-describedby={popoverId} onMouseOver={togglePopover}>
@@ -95,11 +97,11 @@ const MainLayout = ({ children}) => {
             onClose={closePopover}
             anchorOrigin={{
               vertical: 'bottom',
-              horizontal: 'left',
+              horizontal: 'right',
             }}
             transformOrigin={{
               vertical: 'top',
-              horizontal: 'left',
+              horizontal: 'right',
             }}
           >
           {