From cc3a84d28cd98b67e20eaefd2ed95a8d8cf96355 Mon Sep 17 00:00:00 2001
From: yoonyesol <maniac970430@naver.com>
Date: Tue, 10 Sep 2024 12:10:35 +0900
Subject: [PATCH] =?UTF-8?q?Feat:=20#118=20=EB=84=A4=ED=8A=B8=EC=9B=8C?=
 =?UTF-8?q?=ED=81=AC=20=EC=BD=94=EB=93=9C=20=EC=9E=91=EC=84=B1=20=EB=B0=A9?=
 =?UTF-8?q?=EC=8B=9D=20=EB=B3=80=EA=B2=BD=EC=9D=84=20=EC=9C=84=ED=95=9C=20?=
 =?UTF-8?q?useAxios=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=EB=A1=9C=EA=B7=B8?=
 =?UTF-8?q?=EC=9D=B8=20=EC=BD=94=EB=93=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useAxios.ts         |  2 ++
 src/pages/user/SignInPage.tsx | 26 +++++++++++---------------
 2 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/hooks/useAxios.ts b/src/hooks/useAxios.ts
index d52c3a41..019453f6 100644
--- a/src/hooks/useAxios.ts
+++ b/src/hooks/useAxios.ts
@@ -42,9 +42,11 @@ export default function useAxios<T, P extends unknown[]>(fetchCallback: PromiseC
         const response = await fetchCallback(...params);
         setHeaders(response.headers);
         setData(response.data);
+        return response;
       } catch (error: unknown) {
         setError(error as Error);
         errorHandler(error as Error);
+        throw error;
       } finally {
         setLoading(false);
       }
diff --git a/src/pages/user/SignInPage.tsx b/src/pages/user/SignInPage.tsx
index f3594c07..95e74890 100644
--- a/src/pages/user/SignInPage.tsx
+++ b/src/pages/user/SignInPage.tsx
@@ -8,17 +8,16 @@ import AuthFormLayout from '@layouts/AuthFormLayout';
 import { useNavigate } from 'react-router-dom';
 import { AxiosError } from 'axios';
 import useToast from '@hooks/useToast';
+import useAxios from '@hooks/useAxios';
 import { login } from '@services/authService';
-import { useEffect } from 'react';
 import type { UserSignInForm } from '@/types/UserType';
 import { useAuthStore } from '@/stores/useAuthStore';
-import useAxios from '@/hooks/useAxios';
 
 export default function SignInPage() {
   const { onLogin } = useAuthStore();
   const { toastError } = useToast();
   const navigate = useNavigate();
-  const { error, fetchData, headers, loading } = useAxios(login);
+  const { fetchData } = useAxios(login);
 
   const {
     register,
@@ -33,12 +32,11 @@ export default function SignInPage() {
   });
 
   const onSubmit = async (formData: UserSignInForm) => {
-    await fetchData(formData);
-  };
+    try {
+      const response = await fetchData(formData);
+      if (!response.headers) return;
 
-  useEffect(() => {
-    if (headers) {
-      const accessToken = headers.authorization;
+      const accessToken = response.headers.authorization;
       if (!accessToken) {
         toastError('로그인에 실패했습니다.');
         return;
@@ -46,17 +44,15 @@ export default function SignInPage() {
 
       onLogin(accessToken.split(' ')[1]);
       navigate('/', { replace: true });
-      return;
-    }
-
-    if (error instanceof AxiosError) {
-      if (error.response?.status === 401) {
+    } catch (error) {
+      const axiosError = error as AxiosError;
+      if (axiosError.response?.status === 401) {
         toastError('아이디와 비밀번호를 한번 더 확인해 주세요.');
         return;
       }
-      toastError(`로그인 도중 오류가 발생했습니다: ${error.message}`);
+      toastError(`로그인 도중 오류가 발생했습니다: ${axiosError.message}`);
     }
-  }, [headers, error]);
+  };
 
   return (
     <>