[#66] fix: useAuth 로직 수정 및 SigninPage 에서 사용하도록 수정

telbby · Dec 29, 2021 · e790e74 · e790e74
1 parent f62d72a
commit e790e74
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 16 deletions.
diff --git a/src/hooks/useAuth.ts b/src/hooks/useAuth.ts
@@ -2,10 +2,10 @@ import { useState } from 'react';
 import { useHistory } from 'react-router-dom';
 
 import { authApi } from '@/apis';
-import { LoginRequestBody } from '@/types';
 import { useSetUserState } from '@/atoms/userState';
-import { NETWORK_ERROR, loginError, UNEXPECTED_ERROR } from '@/constants/error';
+import { NETWORK_ERROR, UNEXPECTED_ERROR, loginError } from '@/constants/error';
 import Uri from '@/constants/uri';
+import { LoginRequestBody } from '@/types';
 
 const useAuth = (): {
   login: ({ userId, password }: LoginRequestBody) => Promise<void>;
@@ -24,9 +24,11 @@ const useAuth = (): {
 
       await authApi.login({ userId, password });
 
-      // @TODO 로그인 성공 시 사용자 정보 가져오는 API 호출 후 상태로 저장
+      setUserState((prev) => ({ ...prev, userId }));
+
+      setIsLoading(false);
 
-      history.replace(Uri.home);
+      history.replace(Uri.service);
     } catch (e) {
       if (e.response) {
         if (loginError[e.response.status]) {
@@ -37,9 +39,10 @@ const useAuth = (): {
       } else {
         setError(NETWORK_ERROR);
       }
-      throw e;
-    } finally {
+
       setIsLoading(false);
+
+      throw e;
     }
   };
 

diff --git a/src/pages/SigninPage/index.tsx b/src/pages/SigninPage/index.tsx
@@ -1,21 +1,19 @@
 import React, { FC, useCallback } from 'react';
-import { Link, useHistory } from 'react-router-dom';
+import { Link } from 'react-router-dom';
 
-import { authApi } from '@/apis';
-import { useSetUserState } from '@/atoms/userState';
 import Jumbotron from '@/components/common/Jumbotron';
 import Logo from '@/components/common/Logo';
 import Shell from '@/components/shell/Shell';
 import { reject, renderProps, resolve } from '@/components/shell/helper';
 import { NETWORK_ERROR, UNEXPECTED_ERROR, loginError } from '@/constants/error';
 import Uri from '@/constants/uri';
+import useAuth from '@/hooks/useAuth';
 import { LoginRequestBody } from '@/types';
 
 import { footerStyle, headerStyle, layoutStyle } from './style';
 
 const SigninPage: FC = () => {
-  const setUserState = useSetUserState();
-  const { push } = useHistory();
+  const { login } = useAuth();
 
   const checkIsValueEmpty = useCallback(
     (option: {
@@ -37,11 +35,7 @@ const SigninPage: FC = () => {
     if (val !== 'y') return reject(2, 'Access denied');
 
     try {
-      await authApi.login(body);
-
-      setUserState((prev) => ({ ...prev, userId: body.userId }));
-
-      push(Uri.service);
+      await login(body);
 
       return resolve();
     } catch (error) {