[FE] fix: 로그인 성공 후 헤더가 바뀌지 않는 오류 해결 (#428)

* fix: 로그인시 헤더가 바뀌지 않는 문제 해결

* refactor: eslint 적용

Author: nan-noo

frontend/src/layout/header/Header.tsx

@@ -1,5 +1,5 @@
 import { useContext, useState } from 'react';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, useLocation, useNavigate } from 'react-router-dom';
 
 import { PATH } from '@constants';
 
@@ -27,6 +27,8 @@ const Header: React.FC = () => {
   const [isOpenDropDownBox, setIsOpenDropDownBox] = useState(false);
 
   const navigate = useNavigate();
+  const location = useLocation();
+
   const { logout, isLoggedIn } = useAuth();
   const { userInfo } = useUserInfo();
 
@@ -41,6 +43,10 @@ const Header: React.FC = () => {
     navigate(PATH.MAIN);
   };
 
+  const handleLoginButtonClick = () => {
+    window.sessionStorage.setItem('prevPath', location.pathname);
+  };
+
   const handleLogoutButtonClick = () => {
     logout();
   };
@@ -94,7 +100,7 @@ const Header: React.FC = () => {
         </nav>
       ) : (
         <a href={`https://github.com/login/oauth/authorize?client_id=${process.env.CLIENT_ID}`}>
-          <NavButton ariaLabel="로그인">
+          <NavButton ariaLabel="로그인" onClick={handleLoginButtonClick}>
             <LoginIcon />
             <span>Github 로그인</span>
           </NavButton>

frontend/src/pages/login-redirect-page/hooks/useLoginRedirectPage.ts

@@ -10,6 +10,7 @@ import { useAuth } from '@hooks/useAuth';
 const useLoginRedirectPage = () => {
   const [searchParams] = useSearchParams();
   const codeParam = searchParams.get('code');
+
   const navigate = useNavigate();
 
   const { login } = useAuth();
@@ -23,16 +24,19 @@ const useLoginRedirectPage = () => {
       return;
     }
 
+    // 외부 사이트에서 리다이렉트하는 것이기 때문에 react-router의 location state를 사용할 수 없어 sessionStorage를 이용
+    const prevPath = window.sessionStorage.getItem('prevPath') || PATH.MAIN;
+
     mutate(
       { code: codeParam },
       {
         onError: () => {
           alert('로그인에 실패했습니다.');
-          navigate(PATH.MAIN, { replace: true });
+          navigate(prevPath, { replace: true });
         },
         onSuccess: ({ accessToken, expiredTime }) => {
           login(accessToken, expiredTime);
-          navigate(-1);
+          navigate(prevPath, { replace: true });
         },
       },
     );