From f2a80f9a5fc5bb67869c3d0d08d06ac9e2b7e258 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=A0=95=ED=98=B8=EC=A7=84?=
 <50974359+hozzijeong@users.noreply.github.com>
Date: Sat, 14 Oct 2023 22:26:43 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EB=90=98?=
 =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8D=98=20=EC=9D=B4=EC=8A=88=20=ED=95=B4?=
 =?UTF-8?q?=EA=B2=B0=20(#432)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* refactor: 렌더링 이후에 api 호출하도록 변경

* refactor: 로그인 했을 경우 Success, Error callback 작성
---
 frontend/src/hooks/queries/auth/useLogin.ts   | 20 +++++++++++++++++--
 .../src/pages/auth/Login/Authorization.tsx    |  7 ++++---
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/frontend/src/hooks/queries/auth/useLogin.ts b/frontend/src/hooks/queries/auth/useLogin.ts
index 9272e3f7..2ad77e7c 100644
--- a/frontend/src/hooks/queries/auth/useLogin.ts
+++ b/frontend/src/hooks/queries/auth/useLogin.ts
@@ -1,15 +1,31 @@
 import { useMutation } from '@tanstack/react-query';
+import { useNavigate } from 'react-router-dom';
+import useAddToast from 'hooks/@common/useAddToast';
 import AuthAPI from 'apis/auth';
 import throwOnInvalidStatus from 'utils/throwOnInvalidStatus';
+import { URL_PATH } from 'constants/index';
 
-const useLogin = () =>
-  useMutation<null, Error, string>({
+const useLogin = () => {
+  const navigation = useNavigate();
+  const addToast = useAddToast();
+
+  return useMutation<null, Error, string>({
     mutationFn: async (code: string) => {
       const response = await AuthAPI.getSessionId(code);
 
       throwOnInvalidStatus(response);
       return null;
     },
+
+    onSuccess: () => {
+      navigation(URL_PATH.reminder, { replace: true });
+    },
+
+    onError: (error) => {
+      addToast({ type: 'error', message: error.message, time: 3000 });
+      navigation(URL_PATH.login, { replace: true });
+    },
   });
+};
 
 export default useLogin;
diff --git a/frontend/src/pages/auth/Login/Authorization.tsx b/frontend/src/pages/auth/Login/Authorization.tsx
index 2ce0665a..935c7371 100644
--- a/frontend/src/pages/auth/Login/Authorization.tsx
+++ b/frontend/src/pages/auth/Login/Authorization.tsx
@@ -1,18 +1,19 @@
 import { useEffect } from 'react';
-import { Navigate, useSearchParams } from 'react-router-dom';
+import { useSearchParams } from 'react-router-dom';
+import Loading from 'pages/@common/Loading';
 import useLogin from 'hooks/queries/auth/useLogin';
-import { URL_PATH } from 'constants/index';
 
 const Authorization = () => {
   const [searchParams] = useSearchParams();
   const code = searchParams.get('code');
+
   const { mutate: login } = useLogin();
 
   useEffect(() => {
     login(code ?? '');
   }, [code, login]);
 
-  return <Navigate to={URL_PATH.reminder} replace />;
+  return <Loading />;
 };
 
 export default Authorization;