From 8c79c6fa50ad06d10cc930b6190c231687f87586 Mon Sep 17 00:00:00 2001
From: jhj2713 <juhyojeong58@gmail.com>
Date: Tue, 13 Aug 2024 13:45:07 +0900
Subject: [PATCH 1/2] =?UTF-8?q?fix:=20fetchWithTimeout=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/utils/fetchWithTimeout.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/client/src/utils/fetchWithTimeout.ts b/client/src/utils/fetchWithTimeout.ts
index 371107f3..fd9cbd56 100644
--- a/client/src/utils/fetchWithTimeout.ts
+++ b/client/src/utils/fetchWithTimeout.ts
@@ -3,12 +3,12 @@ export async function fetchWithTimeout(url: string, options: RequestInit = {}, t
     const id = setTimeout(() => controller.abort(), timeout);
     options.signal = controller.signal;
 
-    try {
-        const response = await fetch(url, options);
-        clearTimeout(id);
-        return response;
-    } catch (error) {
-        clearTimeout(id);
-        throw error;
+    const response = await fetch(url, options);
+    clearTimeout(id);
+
+    if (!response.ok) {
+        throw new Error(response.statusText);
     }
+
+    return response;
 }

From ce653a89d0ffd8d5461928a126edd22d9f08a2b9 Mon Sep 17 00:00:00 2001
From: jhj2713 <juhyojeong58@gmail.com>
Date: Tue, 13 Aug 2024 14:19:38 +0900
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=EC=96=B4=EB=93=9C=EB=AF=BC=20fetchW?=
 =?UTF-8?q?ithTimeout=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 admin/src/apis/authAPI.ts           |  6 +-----
 admin/src/hooks/useFetch.ts         |  6 ++++--
 admin/src/pages/Login/index.tsx     | 12 ++++++++++--
 admin/src/utils/fetchWithTimeout.ts | 14 +++++++-------
 4 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/admin/src/apis/authAPI.ts b/admin/src/apis/authAPI.ts
index d50d8850..3c39f1c7 100644
--- a/admin/src/apis/authAPI.ts
+++ b/admin/src/apis/authAPI.ts
@@ -10,16 +10,12 @@ const headers = {
 export const AuthAPI = {
     async postAuth(body: PostAuthParams): Promise<PostAuthResponse> {
         try {
-            return new Promise((resolve) =>
-                resolve({
-                    accessToken: "access token",
-                })
-            );
             const response = await fetchWithTimeout(`${baseURL}`, {
                 method: "POST",
                 headers: headers,
                 body: JSON.stringify(body),
             });
+
             return response.json();
         } catch (error) {
             console.error("Error:", error);
diff --git a/admin/src/hooks/useFetch.ts b/admin/src/hooks/useFetch.ts
index 9e334f8f..1c6bfed0 100644
--- a/admin/src/hooks/useFetch.ts
+++ b/admin/src/hooks/useFetch.ts
@@ -1,7 +1,7 @@
 import { useState } from "react";
 import { useErrorBoundary } from "react-error-boundary";
 
-export default function useFetch<T, P = void>(fetch: (params: P) => Promise<T>) {
+export default function useFetch<T, P = void>(fetch: (params: P) => Promise<T>, showError = true) {
     const { showBoundary } = useErrorBoundary();
 
     const [data, setData] = useState<T | null>(null);
@@ -18,8 +18,10 @@ export default function useFetch<T, P = void>(fetch: (params: P) => Promise<T>)
             setIsSuccess(!!data);
         } catch (error) {
             setIsError(true);
-            showBoundary(error);
             console.error(error);
+            if (showError) {
+                showBoundary(error);
+            }
         }
     };
 
diff --git a/admin/src/pages/Login/index.tsx b/admin/src/pages/Login/index.tsx
index f177ab9d..5446d216 100644
--- a/admin/src/pages/Login/index.tsx
+++ b/admin/src/pages/Login/index.tsx
@@ -20,19 +20,27 @@ export default function Login() {
     const {
         data: token,
         isSuccess: isSuccessPostAuth,
+        isError: isErrorPostAuth,
         fetchData: postAuth,
-    } = useFetch<PostAuthResponse>(() => AuthAPI.postAuth({ adminId: id, password }));
+    } = useFetch<PostAuthResponse>(() => AuthAPI.postAuth({ adminId: id, password }), false);
 
     const isValidButton = id.length !== 0 && password.length !== 0;
 
     useEffect(() => {
         if (isSuccessPostAuth && token) {
-            setCookie(COOKIE_KEY.ACCESS_TOKEN, token.accessToken);
+            setCookie(COOKIE_KEY.ACCESS_TOKEN, token.accessToken, { path: "/" });
 
             setErrorMessage("");
             navigate("/lottery");
         }
     }, [isSuccessPostAuth, token]);
+    useEffect(() => {
+        if (isErrorPostAuth) {
+            setErrorMessage(
+                "아이디 또는 비밀번호가 잘못 되었습니다. 아이디와 비밀번호를 정확히 입력해 주세요."
+            );
+        }
+    }, [isErrorPostAuth]);
 
     const handleChangeId = (e: ChangeEvent<HTMLInputElement>) => {
         setId(e.target.value);
diff --git a/admin/src/utils/fetchWithTimeout.ts b/admin/src/utils/fetchWithTimeout.ts
index 371107f3..fd9cbd56 100644
--- a/admin/src/utils/fetchWithTimeout.ts
+++ b/admin/src/utils/fetchWithTimeout.ts
@@ -3,12 +3,12 @@ export async function fetchWithTimeout(url: string, options: RequestInit = {}, t
     const id = setTimeout(() => controller.abort(), timeout);
     options.signal = controller.signal;
 
-    try {
-        const response = await fetch(url, options);
-        clearTimeout(id);
-        return response;
-    } catch (error) {
-        clearTimeout(id);
-        throw error;
+    const response = await fetch(url, options);
+    clearTimeout(id);
+
+    if (!response.ok) {
+        throw new Error(response.statusText);
     }
+
+    return response;
 }