[Common] [Hotfix] 헤더 로그인 사항 적용안된 부분 수정

apps/web/src/shared/components/layout/header/header.tsx

@@ -2,7 +2,9 @@
 
 import Link from 'next/link';
 import React, { useRef, useState } from 'react';
+import useClickOutside from '@/shared/hooks/useClickOutside';
 import { useGetUserInfo } from '@/shared/apis/auth/queries';
+import { getAuthHeader } from '@/shared/utils/auth';
 import CloseIcon from '@/shared/assets/svgs/close_icon.svg';
 import Logo from '@/shared/assets/svgs/logo_sm.svg';
 import HamburgerIcon from '@/shared/assets/svgs/menu_icon.svg';
@@ -32,6 +34,8 @@ const Header = () => {
 
   const menuRef = useRef(null);
 
+  useClickOutside(menuRef, handleMenuClose);
+
   React.useEffect(() => {
     const isMobile = () => {
       return /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
@@ -44,6 +48,8 @@ const Header = () => {
       window.location.replace(newUrl);
     }
 
+    setIsLoggedIn(!!getAuthHeader());
+
     const handleResize = () => {
       if (window.innerWidth <= 700) {
         console.log('화면 너비가 700px 이하입니다.');

apps/web/src/shared/hooks/useClickOutside.ts

@@ -0,0 +1,23 @@
+import { RefObject, useEffect } from 'react';
+
+const useClickOutside = (
+  ref: RefObject<HTMLElement>,
+  callback: () => void,
+  enable: boolean = true,
+) => {
+  useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      if (!enable) return;
+      if (ref.current && !ref.current.contains(event.target as Node)) {
+        callback();
+      }
+    };
+
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [ref, callback, enable]);
+};
+
+export default useClickOutside;