🛠 fix : 로그인 로그아웃 바로 반영 안되는 오류

src/apis/config/privateApi.ts

@@ -27,6 +27,13 @@ privateApi.interceptors.request.use(
     return config;
   },
   (error) => {
+    alert('오류가 발생했습니다. 다시 시도해주세요!');
+    location.href = '/auth/logout';
+    // if (error.response.status === 415) {
+    //   if (confirm('세션이 만료되었습니다. 다시 로그인해주세요!')) {
+    //     open('/menu');
+    //   }
+    // }
     return Promise.reject(error);
   }
 );

src/app/(Main)/mypose/components/LoginModal.tsx

@@ -12,9 +12,8 @@ interface LoginModalProps {
 
 export default function LoginModal({ onClose }: LoginModalProps) {
   const router = useRouter();
-
   const handleLogin = () => {
-    router.push(KAKAO_AUTHORIZE);
+    router.replace(KAKAO_AUTHORIZE);
   };
 
   return (

src/app/(Main)/mypose/components/LoginSection.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import LoginModal from './LoginModal';
+import LogoutModal from './LogoutModal';
 import { Icon } from '@/components/Button/Icon';
 import { useOverlay } from '@/components/Overlay/useOverlay';
 import { ICON } from '@/constants/icon';
@@ -22,7 +23,11 @@ export default function LoginSection() {
     <section className="py-24">
       <button
         className="flex w-full items-center gap-16"
-        onClick={() => !isLogin && open(() => <LoginModal onClose={exit} />)}
+        onClick={() =>
+          isLogin
+            ? open(({ exit }) => <LogoutModal exit={exit} />)
+            : open(() => <LoginModal onClose={exit} />)
+        }
       >
         <DefaultProfile />
         <div className="text-start">

src/app/(Main)/mypose/components/LogoutModal.tsx

@@ -0,0 +1,25 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+
+import { PrimaryButton } from '@/components/Button';
+import { Popup } from '@/components/Modal';
+
+export default function LogoutModal({ exit }: { exit(): void }) {
+  const router = useRouter();
+  return (
+    <Popup
+      title="로그아웃"
+      content={`북마크는 로그인 시에만 유지되어요.\n정말 로그아웃하시겠어요?`}
+    >
+      <>
+        <PrimaryButton
+          text={'로그아웃'}
+          type="secondary"
+          onClick={() => router.push('/auth/logout')}
+        />
+        <PrimaryButton text="로그인 유지" onClick={exit} />
+      </>
+    </Popup>
+  );
+}

src/app/(Sub)/menu/MenuListSection.tsx

@@ -1,35 +1,18 @@
 'use client';
 
 import Link from 'next/link';
-import { useRouter } from 'next/navigation';
 
-import { PrimaryButton } from '@/components/Button';
-import { Popup } from '@/components/Modal';
+import LogoutModal from '@/app/(Main)/mypose/components/LogoutModal';
 import { useOverlay } from '@/components/Overlay/useOverlay';
 import { menuList } from '@/constants/data';
 import useUserState from '@/context/userState';
 
 export default function MenuListSection() {
   const { isLogin } = useUserState();
   const { open } = useOverlay();
-  const router = useRouter();
 
   function handleLogout() {
-    open(({ exit }) => (
-      <Popup
-        title="로그아웃"
-        content={`북마크는 로그인 시에만 유지되어요.\n정말 로그아웃하시겠어요?`}
-      >
-        <>
-          <PrimaryButton
-            text={'로그아웃'}
-            type="secondary"
-            onClick={() => router.replace('/auth/logout')}
-          />
-          <PrimaryButton text="로그인 유지" onClick={exit} />
-        </>
-      </Popup>
-    ));
+    open(({ exit }) => <LogoutModal exit={exit} />);
   }
 
   return (

src/app/auth/logout/page.tsx

@@ -7,18 +7,18 @@ import { patchLogout } from '@/apis';
 import useUserState from '@/context/userState';
 
 export default function Page() {
-  const router = useRouter();
   const { token, clearUser } = useUserState();
+  const router = useRouter();
 
   useEffect(() => {
     if (token) {
-      patchLogout(token.accessToken, token.refreshToken).then((response) => {
+      patchLogout(token.accessToken, token.refreshToken).then(() => {
         alert('로그아웃 성공!');
-        localStorage.removeItem('accesstoken');
       });
     }
     clearUser();
-    router.replace('/menu');
+    localStorage.removeItem('accesstoken');
+    router.back();
   });
 
   return <>로그아웃</>;

src/app/auth/page.tsx

@@ -8,16 +8,16 @@ import useUserState from '@/context/userState';
 
 export default function Page() {
   const code = useSearchParams().get('code');
-  const router = useRouter();
   const { setUser } = useUserState();
+  const router = useRouter();
 
   useEffect(() => {
     if (code) {
       getRegister(code).then((response) => {
         setUser(response);
         localStorage.setItem('accesstoken', response.token.accessToken);
         alert(`로그인에 성공했어요!`);
-        router.back();
+        router.replace('/mypose/bookmark');
       });
     }
   });

src/context/userState.tsx

@@ -21,7 +21,7 @@ export default function useUserState() {
 
   const setUser = (data: RegisterResponse) => {
     setUserAtom(data);
-    console.log(data.email + '님 로그인 성공');
+    console.log(data.email);
   };
   const clearUser = () => setUserAtom(null);