From 5e9ee98c6856f99e8b72310040b04ec7414f7a0e Mon Sep 17 00:00:00 2001
From: JANGHYUNn <kimjh2369@gmail.com>
Date: Thu, 22 Feb 2024 14:44:48 +0900
Subject: [PATCH] =?UTF-8?q?logout=20redux=20=EC=B4=88=EA=B8=B0=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../menu/vertical-menu/VerticalMenuHeader.js     | 14 +++++++++++++-
 .../components/menu/vertical-menu/index.js       |  2 ++
 .../layouts/components/navbar/UserDropdown.js    |  5 -----
 .../simulator/AnalysisSimulationContainer.js     |  8 ++++++--
 src/redux/features/account/auth/authSlice.ts     |  9 +++++++++
 src/redux/features/account/auth/authThunk.ts     |  3 ---
 src/redux/rootReducer.ts                         |  6 ++++++
 src/views/control/main/ControlMain.js            | 16 +++++++++++++---
 8 files changed, 49 insertions(+), 14 deletions(-)

diff --git a/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js b/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js
index 75bb4815..f7fb02ae 100644
--- a/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js
+++ b/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js
@@ -7,6 +7,8 @@ import { Disc, X, Circle } from 'react-feather';
 
 // ** Config
 import themeConfig from '@configs/themeConfig';
+import { useDispatch } from '@src/redux/store';
+import { clientDispatchTopMenu } from '@src/redux/features/layout/layoutSlice';
 
 const VerticalMenuHeader = props => {
   // ** Props
@@ -18,6 +20,8 @@ const VerticalMenuHeader = props => {
     menuHover
   } = props;
 
+  const dispatch = useDispatch();
+
   // ** Reset open group
   useEffect(() => {
     if (!menuHover && menuCollapsed) setGroupOpen([]);
@@ -50,7 +54,15 @@ const VerticalMenuHeader = props => {
     <div className='navbar-header'>
       <ul className='nav navbar-nav flex-row'>
         <li className='nav-item mr-auto'>
-          <NavLink to='/' className='navbar-brand' style={{ marginRight: 0 }}>
+          <NavLink
+            to='/'
+            className='navbar-brand'
+            style={{ marginRight: 0 }}
+            onClick={e => {
+              localStorage.setItem('topMenuCd', '/');
+              dispatch(clientDispatchTopMenu('/'));
+            }}
+          >
             <span className='brand-logo'>
               <img src={themeConfig.app.appLogoImage} alt='logo' />
             </span>
diff --git a/src/@core/layouts/components/menu/vertical-menu/index.js b/src/@core/layouts/components/menu/vertical-menu/index.js
index d09af22c..a2463a26 100644
--- a/src/@core/layouts/components/menu/vertical-menu/index.js
+++ b/src/@core/layouts/components/menu/vertical-menu/index.js
@@ -48,6 +48,8 @@ const Sidebar = props => {
         return statistics;
       case 'cstmrService':
         return cstmrService;
+      case '/':
+        return [];
     }
   };
 
diff --git a/src/@core/layouts/components/navbar/UserDropdown.js b/src/@core/layouts/components/navbar/UserDropdown.js
index 77a40064..20874154 100644
--- a/src/@core/layouts/components/navbar/UserDropdown.js
+++ b/src/@core/layouts/components/navbar/UserDropdown.js
@@ -18,11 +18,6 @@ import {
   UncontrolledDropdown
 } from '@component/ui';
 import { setLogout } from '@src/redux/features/account/auth/authThunk';
-import {
-  COOKIE_ACCESS_TOKEN,
-  COOKIE_REFRESH_TOKEN,
-  cookieStorage
-} from '@src/utility/authService/cookie';
 
 const UserDropdown = () => {
   // ** Store Vars
diff --git a/src/containers/analysis/simulator/AnalysisSimulationContainer.js b/src/containers/analysis/simulator/AnalysisSimulationContainer.js
index 35ad1136..1908845d 100644
--- a/src/containers/analysis/simulator/AnalysisSimulationContainer.js
+++ b/src/containers/analysis/simulator/AnalysisSimulationContainer.js
@@ -243,8 +243,12 @@ export const AnalysisSimulationContainer = props => {
   };
 
   // 로그아웃
-  const handlerLogout = () => {
-    dispatch(setLogout());
+  const handlerLogout = async () => {
+    const { payload } = await dispatch(setLogout());
+
+    if (payload === 'SUCCESS') {
+      history.replace('/account/login');
+    }
   };
 
   // 비행 시물레이션 데이터 닫기
diff --git a/src/redux/features/account/auth/authSlice.ts b/src/redux/features/account/auth/authSlice.ts
index f2e8b7c7..79f6707e 100644
--- a/src/redux/features/account/auth/authSlice.ts
+++ b/src/redux/features/account/auth/authSlice.ts
@@ -13,6 +13,11 @@ import {
   setLogin,
   setLogout
 } from './authThunk';
+import {
+  COOKIE_ACCESS_TOKEN,
+  COOKIE_REFRESH_TOKEN,
+  cookieStorage
+} from '@src/utility/authService/cookie';
 
 const initAuth: IAuthState = {
   userPage: {
@@ -68,6 +73,10 @@ const authSlice = createSlice({
         state.user = user;
       })
       .addCase(setLogout.fulfilled, (state, action) => {
+        cookieStorage.removeCookie(COOKIE_ACCESS_TOKEN);
+        cookieStorage.removeCookie(COOKIE_REFRESH_TOKEN);
+        localStorage.removeItem('dronGroupId');
+        localStorage.removeItem('dronGroupNm');
         state.isLogin = false;
         state.user = initAuth.user;
       })
diff --git a/src/redux/features/account/auth/authThunk.ts b/src/redux/features/account/auth/authThunk.ts
index 253a05f4..b5ad78d5 100644
--- a/src/redux/features/account/auth/authThunk.ts
+++ b/src/redux/features/account/auth/authThunk.ts
@@ -95,9 +95,6 @@ export const setLogout = createAsyncThunk(
       const accessToken = cookieStorage.getCookie(COOKIE_ACCESS_TOKEN);
 
       if (accessToken) {
-        cookieStorage.removeCookie(COOKIE_ACCESS_TOKEN);
-        cookieStorage.removeCookie(COOKIE_REFRESH_TOKEN);
-
         const decodedToken = decode<IDecodeToken>(accessToken);
         const { data }: { data: string } = await axios.get(
           `api/acnt/jwt/logout/${decodedToken.cstmrSno}`
diff --git a/src/redux/rootReducer.ts b/src/redux/rootReducer.ts
index fea3d058..19467907 100644
--- a/src/redux/rootReducer.ts
+++ b/src/redux/rootReducer.ts
@@ -55,6 +55,12 @@ const rootReducer = (state: any, action: any) => {
     // statistics
     statisticsState: statisticsReducer
   });
+
+  if (action.type === 'account/setLogout/fulfilled') {
+    combineReducer(undefined, action);
+  }
+
   return combineReducer(state, action);
 };
+
 export default rootReducer;
diff --git a/src/views/control/main/ControlMain.js b/src/views/control/main/ControlMain.js
index 77537428..227d3198 100644
--- a/src/views/control/main/ControlMain.js
+++ b/src/views/control/main/ControlMain.js
@@ -22,6 +22,7 @@ import '../../../assets/css/custom.css';
 import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg';
 import logo from '../../../assets/images/logo/kac_logo_ icon.svg';
 import { setLogout } from '@src/redux/features/account/auth/authThunk';
+import { clientDispatchTopMenu } from '@src/redux/features/layout/layoutSlice';
 
 const ControlReportList = lazy(() => import('../report/ControlReportList'));
 const ControlReportDetail = lazy(() => import('../report/ControlReportDetail'));
@@ -128,8 +129,12 @@ const ControlMain = () => {
   };
 
   // 로그아웃
-  const handlerLogout = () => {
-    dispatch(setLogout());
+  const handlerLogout = async () => {
+    const { payload } = await dispatch(setLogout());
+
+    if (payload === 'SUCCESS') {
+      history.replace('/account/login');
+    }
   };
 
   // 드론 상세정보 창 닫기
@@ -181,7 +186,12 @@ const ControlMain = () => {
           </li>
           <li>
             <button>
-              <Grid onClick={() => history.push('/main/dashboard')} />
+              <Grid
+                onClick={() => {
+                  dispatch(clientDispatchTopMenu('/'));
+                  history.push('/main/dashboard');
+                }}
+              />
             </button>
           </li>
         </ul>