From 6ca0dec0f284007edc00eb7939679fb7ae671307 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 10 Nov 2023 20:27:57 +0900 Subject: [PATCH 01/14] =?UTF-8?q?fix:=20=ED=86=A0=ED=81=B0=EC=97=86?= =?UTF-8?q?=EC=9D=8C=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/index.ts | 2 +- src/layout/AuthLayout/index.tsx | 3 ++- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/api/index.ts b/src/api/index.ts index 16f57379..a28c87b3 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -14,7 +14,7 @@ const accessClient = axios.create({ timeout: 2000, }); -const refresh = (config: InternalAxiosRequestConfig) => { +const refresh = async (config: InternalAxiosRequestConfig) => { const refreshToken = localStorage.getItem('refresh_token'); if (refreshToken) { diff --git a/src/layout/AuthLayout/index.tsx b/src/layout/AuthLayout/index.tsx index 3f726abd..50489493 100644 --- a/src/layout/AuthLayout/index.tsx +++ b/src/layout/AuthLayout/index.tsx @@ -10,7 +10,8 @@ export default function AuthLayout() { const { user, setUser } = useUserStore(); useEffect(() => { - setUser(); + // @ChoiWonBeen 토큰없음 에러제거. TODO: setUser가 에러를 다루는 문제 제거 + setUser().catch(() => {}); if (user) { navigate('/', { replace: true }); } From 0a5d3512b06f9c2209752c0667845a33797ad3f2 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 10 Nov 2023 20:31:08 +0900 Subject: [PATCH 02/14] =?UTF-8?q?refactor:=20=EC=A0=9C=EC=B6=9C=20?= =?UTF-8?q?=EB=B2=84=ED=8A=BC=20css=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FindPassword/SendAuthNumber/SendAuthNumber.module.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss b/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss index e00624ce..f69a0025 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss +++ b/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss @@ -60,10 +60,14 @@ width: 368px; height: 48px; color: white; - background: #c4c4c4; + background: #175C8E; cursor: pointer; margin-top: 250px; box-sizing: border-box; + + &:disabled { + background-color: #c4c4c4; + } } .auth-container { From f405d9eae09f5db469f2f14713ec350019a0e677 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 10 Nov 2023 20:31:42 +0900 Subject: [PATCH 03/14] =?UTF-8?q?feat:=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20?= =?UTF-8?q?=EC=9D=B8=EC=A6=9D=EB=B2=88=ED=98=B8=20=EB=B0=9C=EC=86=A1,=20?= =?UTF-8?q?=EA=B2=80=EC=A6=9D=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/auth/index.ts | 13 ++++ .../FindPassword/SendAuthNumber/index.tsx | 63 +++++++++++++++---- 2 files changed, 63 insertions(+), 13 deletions(-) diff --git a/src/api/auth/index.ts b/src/api/auth/index.ts index 325f7d4e..da0ddcd0 100644 --- a/src/api/auth/index.ts +++ b/src/api/auth/index.ts @@ -15,3 +15,16 @@ export const getMe = async () => { const { data } = await accessClient.get('/owner'); return UserResponse.parse(data); }; + +export const findPasswordVerify = ({ address }: { address: string }) => client.post('/owners/password/reset/verification', { address }); + +export const findPassword = ({ + address, + certificationCode, +}: { + address: string; + certificationCode: string; +}) => client.post('/owners/password/reset/send', { + address, + certification_code: certificationCode, +}); diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index d8031b33..de105bfe 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -1,9 +1,29 @@ -import { Outlet } from 'react-router-dom'; +import { Outlet, useNavigate } from 'react-router-dom'; import { ReactComponent as KoinLogo } from 'assets/svg/auth/koin-logo.svg'; +import { useState } from 'react'; import cn from 'utils/ts/className'; +import { useMutation } from '@tanstack/react-query'; +import { findPassword, findPasswordVerify } from 'api/auth'; import styles from './SendAuthNumber.module.scss'; export default function FindPassword() { + const navigate = useNavigate(); + const [emailInput, setEmailInput] = useState(''); + const [verifyInput, setVerifyInput] = useState(''); + const verifyEmail = useMutation({ + mutationFn: () => findPasswordVerify({ address: emailInput }), + }); + + const submit = useMutation({ + mutationFn: async () => findPassword({ address: emailInput, certificationCode: verifyInput }), + onSuccess: () => { + navigate('/new-password'); + }, + onError: () => { + // TODO: 이메일 인증 실패 시 UI 처리 필요 + }, + }); + return ( <>
@@ -11,24 +31,41 @@ export default function FindPassword() {
- - + +
From 2c21426dfa35f1c446e3571fe34bafd86df4a252 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 10 Nov 2023 20:53:51 +0900 Subject: [PATCH 04/14] =?UTF-8?q?refactor:=20lint=EC=97=90=EB=9F=AC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FindPassword/SendAuthNumber/SendAuthNumber.module.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss b/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss index f69a0025..e30531b8 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss +++ b/src/page/Auth/FindPassword/SendAuthNumber/SendAuthNumber.module.scss @@ -60,11 +60,11 @@ width: 368px; height: 48px; color: white; - background: #175C8E; + background: #175c8e; cursor: pointer; margin-top: 250px; box-sizing: border-box; - + &:disabled { background-color: #c4c4c4; } From 27a6556a386d96cf43db51828028d42efca10f95 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Fri, 10 Nov 2023 21:00:16 +0900 Subject: [PATCH 05/14] =?UTF-8?q?feat:=20=EC=9D=B8=EC=A6=9D=EB=B2=88?= =?UTF-8?q?=ED=98=B8=20=EB=B0=9C=EC=86=A1=20=EC=8B=9C=20=EC=9E=AC=EB=B0=9C?= =?UTF-8?q?=EC=86=A1=20=ED=99=9C=EC=84=B1=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/SendAuthNumber/index.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index de105bfe..4a255ccf 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -10,8 +10,12 @@ export default function FindPassword() { const navigate = useNavigate(); const [emailInput, setEmailInput] = useState(''); const [verifyInput, setVerifyInput] = useState(''); + const [isSendAuth, setIsSendAuth] = useState(false); const verifyEmail = useMutation({ mutationFn: () => findPasswordVerify({ address: emailInput }), + onSuccess: () => { + setIsSendAuth(true); + }, }); const submit = useMutation({ @@ -42,7 +46,7 @@ export default function FindPassword() { id="email" /> From 7730d7e0a0bf813c8fd8f2ba7d9a3b032041a9ad Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Sat, 11 Nov 2023 01:33:02 +0900 Subject: [PATCH 06/14] =?UTF-8?q?refactor:=20=ED=95=84=EC=9A=94=EC=97=86?= =?UTF-8?q?=EB=8A=94=20=EB=B9=84=EB=8F=99=EA=B8=B0=EC=B2=98=EB=A6=AC=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/page/Auth/FindPassword/SendAuthNumber/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index 4a255ccf..eb771ec6 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -19,7 +19,7 @@ export default function FindPassword() { }); const submit = useMutation({ - mutationFn: async () => findPassword({ address: emailInput, certificationCode: verifyInput }), + mutationFn: () => findPassword({ address: emailInput, certificationCode: verifyInput }), onSuccess: () => { navigate('/new-password'); }, From 584e1e2086e10e120398ec3e0863aa51d15b2156 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Sat, 11 Nov 2023 02:03:03 +0900 Subject: [PATCH 07/14] =?UTF-8?q?feat:=20=EC=9D=B8=EC=A6=9D=20=EB=AF=B8?= =?UTF-8?q?=EC=99=84=EB=A3=8C=20=EC=8B=9C=20=EB=B9=84=EB=B0=80=EB=B2=88?= =?UTF-8?q?=ED=98=B8=20=EB=B3=80=EA=B2=BD=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=EC=A0=91=EA=B7=BC=20=EB=B6=88=EA=B0=80=EB=8A=A5=ED=95=98?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EB=B0=A9=EC=A7=80=ED=95=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Auth/FindPassword/NewPassword/index.tsx | 2 ++ .../FindPassword/SendAuthNumber/index.tsx | 2 +- .../Auth/FindPassword/hooks/useRouteCheck.ts | 20 +++++++++++++++++++ 3 files changed, 23 insertions(+), 1 deletion(-) create mode 100644 src/page/Auth/FindPassword/hooks/useRouteCheck.ts diff --git a/src/page/Auth/FindPassword/NewPassword/index.tsx b/src/page/Auth/FindPassword/NewPassword/index.tsx index a8e63e14..8c1d32ee 100644 --- a/src/page/Auth/FindPassword/NewPassword/index.tsx +++ b/src/page/Auth/FindPassword/NewPassword/index.tsx @@ -1,8 +1,10 @@ import { ReactComponent as KoinLogo } from 'assets/svg/auth/koin-logo.svg'; import { ReactComponent as Blind } from 'assets/svg/auth/blind.svg'; +import useRouteCheck from 'page/Auth/FindPassword/hooks/useRouteCheck'; import styles from './NewPassword.module.scss'; export default function NewPassword() { + useRouteCheck('new-password', '/find-password'); return (
diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index eb771ec6..f877d49f 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -21,7 +21,7 @@ export default function FindPassword() { const submit = useMutation({ mutationFn: () => findPassword({ address: emailInput, certificationCode: verifyInput }), onSuccess: () => { - navigate('/new-password'); + navigate('/new-password', { state: { authCheck: true }, replace: true }); }, onError: () => { // TODO: 이메일 인증 실패 시 UI 처리 필요 diff --git a/src/page/Auth/FindPassword/hooks/useRouteCheck.ts b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts new file mode 100644 index 00000000..932e17d4 --- /dev/null +++ b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts @@ -0,0 +1,20 @@ +import { useEffect } from 'react'; +import { useLocation, useNavigate } from 'react-router-dom'; + +type RouteCheckValue = { + [key: string]: boolean +}; + +const useRouteCheck = (checkValue: string, route: string) => { + const location = useLocation(); + const navigate = useNavigate(); + + useEffect(() => { + const state = location.state as RouteCheckValue; + if (!state || !(checkValue in state)) { + navigate(route, { replace: true }); + } + }, [location.state, navigate, route, checkValue]); +}; + +export default useRouteCheck; From 19d33f16e76aa280755861fbe3a986286f853da5 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Sat, 11 Nov 2023 02:15:03 +0900 Subject: [PATCH 08/14] =?UTF-8?q?fix:=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/NewPassword/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/page/Auth/FindPassword/NewPassword/index.tsx b/src/page/Auth/FindPassword/NewPassword/index.tsx index 8c1d32ee..4b0f0748 100644 --- a/src/page/Auth/FindPassword/NewPassword/index.tsx +++ b/src/page/Auth/FindPassword/NewPassword/index.tsx @@ -4,7 +4,7 @@ import useRouteCheck from 'page/Auth/FindPassword/hooks/useRouteCheck'; import styles from './NewPassword.module.scss'; export default function NewPassword() { - useRouteCheck('new-password', '/find-password'); + useRouteCheck('authCheck', '/find-password'); return (
From 604d97d0fc199fba6401d4d12ab28be7f1ed09db Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Sat, 11 Nov 2023 02:39:00 +0900 Subject: [PATCH 09/14] =?UTF-8?q?refactor:=20useRouteCheck=20Hook=20?= =?UTF-8?q?=EA=B0=80=EB=8F=85=EC=84=B1=20=ED=96=A5=EC=83=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/hooks/useRouteCheck.ts | 14 +++++--------- 1 file changed, 5 insertions(+), 9 deletions(-) diff --git a/src/page/Auth/FindPassword/hooks/useRouteCheck.ts b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts index 932e17d4..ac4c7cea 100644 --- a/src/page/Auth/FindPassword/hooks/useRouteCheck.ts +++ b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts @@ -1,20 +1,16 @@ import { useEffect } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -type RouteCheckValue = { - [key: string]: boolean -}; - -const useRouteCheck = (checkValue: string, route: string) => { +const useRouteCheck = (prevState: string, entryRoute: string) => { const location = useLocation(); const navigate = useNavigate(); useEffect(() => { - const state = location.state as RouteCheckValue; - if (!state || !(checkValue in state)) { - navigate(route, { replace: true }); + const 이전_상태를_가지고_넘어왔는가 = location.state && (prevState in location.state); + if (!이전_상태를_가지고_넘어왔는가) { + navigate(entryRoute, { replace: true }); } - }, [location.state, navigate, route, checkValue]); + }, [location.state, navigate, entryRoute, prevState]); }; export default useRouteCheck; From bc3c85becee7df26d479aee25f5e90c53d3353c1 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Mon, 13 Nov 2023 17:11:57 +0900 Subject: [PATCH 10/14] =?UTF-8?q?refactor:=20=EB=B3=80=EC=88=98=EB=AA=85?= =?UTF-8?q?=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/auth/index.ts | 2 +- src/page/Auth/FindPassword/SendAuthNumber/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/api/auth/index.ts b/src/api/auth/index.ts index da0ddcd0..f7c3af79 100644 --- a/src/api/auth/index.ts +++ b/src/api/auth/index.ts @@ -16,7 +16,7 @@ export const getMe = async () => { return UserResponse.parse(data); }; -export const findPasswordVerify = ({ address }: { address: string }) => client.post('/owners/password/reset/verification', { address }); +export const findPasswordVerify = ({ email }: { email: string }) => client.post('/owners/password/reset/verification', { address: email }); export const findPassword = ({ address, diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index f877d49f..af5de73f 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -12,7 +12,7 @@ export default function FindPassword() { const [verifyInput, setVerifyInput] = useState(''); const [isSendAuth, setIsSendAuth] = useState(false); const verifyEmail = useMutation({ - mutationFn: () => findPasswordVerify({ address: emailInput }), + mutationFn: () => findPasswordVerify({ email: emailInput }), onSuccess: () => { setIsSendAuth(true); }, From acc88a7576113b27b7d449eb3ada168a2e72f8b2 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Mon, 13 Nov 2023 23:55:37 +0900 Subject: [PATCH 11/14] =?UTF-8?q?refactor:=20=EB=B3=80=EC=88=98=EB=AA=85?= =?UTF-8?q?=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/hooks/useRouteCheck.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/page/Auth/FindPassword/hooks/useRouteCheck.ts b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts index ac4c7cea..d72cddde 100644 --- a/src/page/Auth/FindPassword/hooks/useRouteCheck.ts +++ b/src/page/Auth/FindPassword/hooks/useRouteCheck.ts @@ -1,16 +1,16 @@ import { useEffect } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -const useRouteCheck = (prevState: string, entryRoute: string) => { +const useRouteCheck = (prevRoute: string, entryRoute: string) => { const location = useLocation(); const navigate = useNavigate(); useEffect(() => { - const 이전_상태를_가지고_넘어왔는가 = location.state && (prevState in location.state); + const 이전_상태를_가지고_넘어왔는가 = location.state && (prevRoute in location.state); if (!이전_상태를_가지고_넘어왔는가) { navigate(entryRoute, { replace: true }); } - }, [location.state, navigate, entryRoute, prevState]); + }, [location.state, navigate, entryRoute, prevRoute]); }; export default useRouteCheck; From 2557882a5a6cadc6ecaf93b66c9466ba95f6d6df Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Thu, 16 Nov 2023 04:07:41 +0900 Subject: [PATCH 12/14] =?UTF-8?q?refactor:=20api=20=EB=A1=9C=EC=A7=81=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FindPassword/SendAuthNumber/index.tsx | 31 ++++++------------- src/page/Auth/Login/index.tsx | 2 +- src/query/auth.ts | 30 ++++++++++++++++-- 3 files changed, 38 insertions(+), 25 deletions(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index af5de73f..93374f1d 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -1,32 +1,16 @@ -import { Outlet, useNavigate } from 'react-router-dom'; +import { Outlet } from 'react-router-dom'; import { ReactComponent as KoinLogo } from 'assets/svg/auth/koin-logo.svg'; import { useState } from 'react'; import cn from 'utils/ts/className'; -import { useMutation } from '@tanstack/react-query'; -import { findPassword, findPasswordVerify } from 'api/auth'; +import { useVerifyEmail, useSubmit } from 'query/auth'; import styles from './SendAuthNumber.module.scss'; export default function FindPassword() { - const navigate = useNavigate(); const [emailInput, setEmailInput] = useState(''); const [verifyInput, setVerifyInput] = useState(''); const [isSendAuth, setIsSendAuth] = useState(false); - const verifyEmail = useMutation({ - mutationFn: () => findPasswordVerify({ email: emailInput }), - onSuccess: () => { - setIsSendAuth(true); - }, - }); - - const submit = useMutation({ - mutationFn: () => findPassword({ address: emailInput, certificationCode: verifyInput }), - onSuccess: () => { - navigate('/new-password', { state: { authCheck: true }, replace: true }); - }, - onError: () => { - // TODO: 이메일 인증 실패 시 UI 처리 필요 - }, - }); + const verifyEmail = useVerifyEmail(emailInput, setIsSendAuth); + const submit = useSubmit(emailInput, verifyInput); return ( <> @@ -45,7 +29,12 @@ export default function FindPassword() { type="text" id="email" /> -
diff --git a/src/page/Auth/Login/index.tsx b/src/page/Auth/Login/index.tsx index 554767d4..963037dc 100644 --- a/src/page/Auth/Login/index.tsx +++ b/src/page/Auth/Login/index.tsx @@ -6,7 +6,7 @@ import { ReactComponent as Logo } from 'assets/svg/auth/koin-logo.svg'; import { ReactComponent as ShowIcon } from 'assets/svg/auth/show.svg'; import { ReactComponent as BlindIcon } from 'assets/svg/auth/blind.svg'; import { ReactComponent as LockIcon } from 'assets/svg/auth/lock.svg'; -import useLogin from 'query/auth'; +import { useLogin } from 'query/auth'; import { SubmitHandler, useForm } from 'react-hook-form'; import { zodResolver } from '@hookform/resolvers/zod'; import { LoginParams } from 'model/auth'; diff --git a/src/query/auth.ts b/src/query/auth.ts index a3ecb59a..7bd6c332 100644 --- a/src/query/auth.ts +++ b/src/query/auth.ts @@ -1,10 +1,10 @@ import { useMutation } from '@tanstack/react-query'; -import { postLogin } from 'api/auth'; +import { postLogin, findPasswordVerify, findPassword } from 'api/auth'; import { LoginForm } from 'model/auth'; import { useNavigate } from 'react-router-dom'; import usePrevPathStore from 'store/path'; -const useLogin = () => { +export const useLogin = () => { const navigate = useNavigate(); const { prevPath } = usePrevPathStore((state) => state); @@ -29,4 +29,28 @@ const useLogin = () => { return { login: mutate, error, isError }; }; -export default useLogin; +export const useVerifyEmail = (emailInput: string, setIsSendAuth: (value:boolean)=>void) => { + const { mutate, isLoading, isSuccess } = useMutation({ + mutationFn: () => findPasswordVerify({ email: emailInput }), + onSuccess: () => { + setIsSendAuth(true); + }, + }); + return { + verifyEmail: mutate, mutate, isLoading, isSuccess, + }; +}; + +export const useSubmit = (emailInput: string, verifyInput:string) => { + const navigate = useNavigate(); + const { mutate } = useMutation({ + mutationFn: () => findPassword({ address: emailInput, certificationCode: verifyInput }), + onSuccess: () => { + navigate('/new-password', { state: { authCheck: true }, replace: true }); + }, + onError: () => { + // TODO: 이메일 인증 실패 시 UI 처리 필요 + }, + }); + return { submit: mutate, mutate }; +}; From caab496e2749340e4ce169baf9426f5195f44dd1 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Mon, 20 Nov 2023 09:20:40 +0900 Subject: [PATCH 13/14] =?UTF-8?q?refactor:=20=EC=83=81=ED=83=9C=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=20=EA=B0=84=EC=86=8C=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/page/Auth/FindPassword/SendAuthNumber/index.tsx | 5 ++--- src/query/auth.ts | 5 +---- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index 93374f1d..a613c01e 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -8,8 +8,7 @@ import styles from './SendAuthNumber.module.scss'; export default function FindPassword() { const [emailInput, setEmailInput] = useState(''); const [verifyInput, setVerifyInput] = useState(''); - const [isSendAuth, setIsSendAuth] = useState(false); - const verifyEmail = useVerifyEmail(emailInput, setIsSendAuth); + const verifyEmail = useVerifyEmail(emailInput); const submit = useSubmit(emailInput, verifyInput); return ( @@ -35,7 +34,7 @@ export default function FindPassword() { onClick={() => verifyEmail.mutate()} disabled={verifyEmail.isLoading} > - {isSendAuth ? '재발송' : '인증번호 발송'} + {verifyEmail.isSuccess ? '재발송' : '인증번호 발송'}
diff --git a/src/query/auth.ts b/src/query/auth.ts index 7bd6c332..e2e28ba7 100644 --- a/src/query/auth.ts +++ b/src/query/auth.ts @@ -29,12 +29,9 @@ export const useLogin = () => { return { login: mutate, error, isError }; }; -export const useVerifyEmail = (emailInput: string, setIsSendAuth: (value:boolean)=>void) => { +export const useVerifyEmail = (emailInput: string) => { const { mutate, isLoading, isSuccess } = useMutation({ mutationFn: () => findPasswordVerify({ email: emailInput }), - onSuccess: () => { - setIsSendAuth(true); - }, }); return { verifyEmail: mutate, mutate, isLoading, isSuccess, From 2e7495dd8f36faf7a2b17b8d981d11a41fd916a7 Mon Sep 17 00:00:00 2001 From: MinGu Jeong Date: Mon, 20 Nov 2023 13:37:17 +0900 Subject: [PATCH 14/14] =?UTF-8?q?refactor:=20Hook=EC=9D=B4=20=EC=83=81?= =?UTF-8?q?=ED=83=9C=EC=97=90=20=EC=9D=98=EC=A1=B4=ED=95=98=EC=A7=80=20?= =?UTF-8?q?=EC=95=8A=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FindPassword/SendAuthNumber/index.tsx | 8 +++--- src/query/auth.ts | 25 ++++++++++++------- 2 files changed, 20 insertions(+), 13 deletions(-) diff --git a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx index a613c01e..e59748cf 100644 --- a/src/page/Auth/FindPassword/SendAuthNumber/index.tsx +++ b/src/page/Auth/FindPassword/SendAuthNumber/index.tsx @@ -8,8 +8,8 @@ import styles from './SendAuthNumber.module.scss'; export default function FindPassword() { const [emailInput, setEmailInput] = useState(''); const [verifyInput, setVerifyInput] = useState(''); - const verifyEmail = useVerifyEmail(emailInput); - const submit = useSubmit(emailInput, verifyInput); + const { verifyEmail } = useVerifyEmail(); + const submit = useSubmit(); return ( <> @@ -31,7 +31,7 @@ export default function FindPassword() {