Logout menu for large screen

BIT-GDSC · Jan 19, 2024 · 8dc52b4 · 8dc52b4
1 parent 81b26e0
commit 8dc52b4
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 32 deletions.
diff --git a/client/.env.example b/client/.env.example
@@ -1,3 +1,4 @@
 VITE_DEV_GOOGLE_AUTH_URL=http://localhost:5000/api/auth/google
 VITE_DEV_TWITTER_AUTH_URL=http://localhost:5000/api/auth/twitter
-VITE_DEV_LINKEDIN_AUTH_URL=http://localhost:5000/api/auth/linkedin
+VITE_DEV_LINKEDIN_AUTH_URL=http://localhost:5000/api/auth/linkedin
+VITE_SECRET_KEY=
diff --git a/client/src/components/AvatarMenu.jsx b/client/src/components/AvatarMenu.jsx
@@ -7,7 +7,6 @@ export default function AvatarMenu() {
  const { avatarMenu, setAvatarMenu, closeAvatar } = useAnimStore()
  const { setUser, setVerifySuccess } = useAuthStore();
  const [animClass, setAnimClass] = useState('')
- const [width, setWidth] = useState(null)
  const menuRef = useRef(null)
  const linkRef = useRef(null)
 
@@ -19,18 +18,6 @@ export default function AvatarMenu() {
  closeAvatar()
  setAvatarMenu(false)
  }
- useEffect(() => {
- const updateDimensions = () => {
- setWidth(window.innerWidth)
- if (width > 650) {
- handleLogoutButton()
- }
- }
- window.addEventListener('resize', updateDimensions)
- return () => {
- window.removeEventListener('resize', updateDimensions)
- }
- }, [width])
 
  useEffect(() => {
  if (avatarMenu) setAnimClass('active')
@@ -44,9 +31,7 @@ export default function AvatarMenu() {
  Profile
  </Link>
  <button
- onClick={() => {
- handleLogoutButton()
- }}
+ onClick={handleLogoutButton}
  className='mobile-menu-close-btn'
  >
  Logout

diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx
@@ -21,33 +21,29 @@ export const Navbar = () => {
  } = useAnimStore()
 
  function handleMenuToggle() {
- if (mobileMenu) {
- closeMenu()
- } else {
- openMenu()
- }
+ if (mobileMenu) closeMenu()
+ else openMenu()
  setMobileMenu(!mobileMenu)
  }
 
  function handleAvatarToggle() {
- if (avatarMenu) {
- closeAvatar()
- } else {
- openAvatar()
- }
+ if (avatarMenu) closeAvatar()
+ else openAvatar()
  setAvatarMenu(!avatarMenu)
  }
 
  useEffect(() => {
- if (width <= 640 && (menuPopup || avatarPopup)) {
- document.body.style.overflow = "hidden";
- }
+ if (width <= 640 && menuPopup) document.body.style.overflow = "hidden";
  else {
  document.body.style.overflow = "";
  closeMenu();
- closeAvatar();
  }
- }, [width, menuPopup, avatarPopup])
+ }, [width, menuPopup])
+
+ useEffect(() => {
+ if (avatarMenu) document.body.style.overflow = "hidden";
+ else document.body.style.overflow = "";
+ }, [avatarMenu])
 
  return (
  <div className='Navbar-container'>