From b73268fc39c6a43e9d69d87c83845f98cbe68a7c Mon Sep 17 00:00:00 2001
From: yoonyesol <maniac970430@naver.com>
Date: Thu, 29 Aug 2024 13:37:28 +0900
Subject: [PATCH] =?UTF-8?q?Feat:=20#80=20zustand=20authStore=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20persist=20=EB=AF=B8=EB=93=A4=EC=9B=A8=EC=96=B4=20?=
 =?UTF-8?q?=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/mocks/services/authServiceHandler.ts |  4 +--
 src/pages/user/SignInPage.tsx            |  4 ++-
 src/stores/useAuthStore.ts               | 34 +++++++++---------------
 3 files changed, 18 insertions(+), 24 deletions(-)

diff --git a/src/mocks/services/authServiceHandler.ts b/src/mocks/services/authServiceHandler.ts
index 392053a5..76efd37d 100644
--- a/src/mocks/services/authServiceHandler.ts
+++ b/src/mocks/services/authServiceHandler.ts
@@ -39,7 +39,7 @@ const authServiceHandler = [
         status: 200,
         headers: {
           Authorization: `Bearer ${accessToken}`,
-          'Set-Cookie': `refreshToken=${refreshToken}; Max-Age=${REFRESH_TOKEN_EXPIRATION / 1000}; HttpOnly; SameSite=Strict`,
+          'Set-Cookie': `refreshToken=${refreshToken}; Max-Age=${REFRESH_TOKEN_EXPIRATION / 1000}; HttpOnly; SameSite=Strict; Secure`,
         },
       });
     }
@@ -67,7 +67,7 @@ const authServiceHandler = [
         status: 200,
         headers: {
           Authorization: `Bearer ${newAccessToken}`,
-          'Set-Cookie': `refreshToken=${refreshToken}; Max-Age=${REFRESH_TOKEN_EXPIRATION / 1000}; HttpOnly; SameSite=Strict`,
+          'Set-Cookie': `refreshToken=${refreshToken}; Max-Age=${REFRESH_TOKEN_EXPIRATION / 1000}; HttpOnly; SameSite=Strict; Secure`,
         },
       });
     }
diff --git a/src/pages/user/SignInPage.tsx b/src/pages/user/SignInPage.tsx
index c8348a26..7c9427b8 100644
--- a/src/pages/user/SignInPage.tsx
+++ b/src/pages/user/SignInPage.tsx
@@ -15,6 +15,7 @@ import { useAuthStore } from '@/stores/useAuthStore';
 import { login } from '@/services/authService';
 
 export default function SignInPage() {
+  const { Login } = useAuthStore();
   const { toastError } = useToast();
   const navigate = useNavigate();
   const {
@@ -29,6 +30,7 @@ export default function SignInPage() {
     },
   });
 
+  // TODO: react-query 코드 분리하기
   const signIn = useMutation({
     mutationFn: (data: UserSignInForm) => login(data),
     onSuccess: (response) => {
@@ -36,7 +38,7 @@ export default function SignInPage() {
       if (!accessToken) return toastError('로그인에 실패했습니다.');
 
       authAxios.defaults.headers.Authorization = accessToken;
-      useAuthStore.getState().Login(accessToken.replace('Bearer ', ''));
+      Login(accessToken.replace('Bearer ', ''));
 
       navigate('/', { replace: true });
     },
diff --git a/src/stores/useAuthStore.ts b/src/stores/useAuthStore.ts
index e3878698..4c5d43e3 100644
--- a/src/stores/useAuthStore.ts
+++ b/src/stores/useAuthStore.ts
@@ -1,6 +1,5 @@
 /* eslint-disable import/prefer-default-export */
-import { createStore } from 'zustand';
-import { persist } from 'zustand/middleware';
+import { create } from 'zustand';
 
 type AuthStore = {
   isAuthenticated: boolean;
@@ -11,22 +10,15 @@ type AuthStore = {
   Logout: () => void;
 };
 
-export const useAuthStore = createStore(
-  persist<AuthStore>(
-    (set) => ({
-      isAuthenticated: false,
-      accessToken: null,
-      setAccessToken: (token: string) => set({ accessToken: token }),
-      // clearAccessToken: () => set({ accessToken: null }),
-      Login: (token: string) => {
-        set({ isAuthenticated: true, accessToken: token });
-      },
-      Logout: () => {
-        set({ isAuthenticated: false, accessToken: null });
-      },
-    }),
-    {
-      name: 'auth-storage',
-    },
-  ),
-);
+export const useAuthStore = create<AuthStore>((set) => ({
+  isAuthenticated: false,
+  accessToken: null,
+  setAccessToken: (token: string) => set({ accessToken: token }),
+  // clearAccessToken: () => set({ accessToken: null }),
+  Login: (token: string) => {
+    set({ isAuthenticated: true, accessToken: token });
+  },
+  Logout: () => {
+    set({ isAuthenticated: false, accessToken: null });
+  },
+}));