diff --git a/package.json b/package.json index 6444a173..e197d323 100644 --- a/package.json +++ b/package.json @@ -27,12 +27,6 @@ "test": "react-scripts test", "eject": "react-scripts eject" }, - "eslintConfig": { - "extends": [ - "react-app", - "react-app/jest" - ] - }, "browserslist": { "production": [ ">0.2%", diff --git a/src/commons/cookie/getUser.ts b/src/commons/cookie/getUser.ts index f59f899c..f7117212 100644 --- a/src/commons/cookie/getUser.ts +++ b/src/commons/cookie/getUser.ts @@ -8,6 +8,6 @@ export const getLoginState = () => { return '로그인'; }; -export const removeUser = () => { +export const removeToken = () => { removeCookie('loginToken'); }; diff --git a/src/layouts/VGNB.tsx b/src/layouts/VGNB.tsx index cf61aa6b..c211afdd 100644 --- a/src/layouts/VGNB.tsx +++ b/src/layouts/VGNB.tsx @@ -1,5 +1,5 @@ import LogoButton from 'commons/LogoButton'; -import { getLoginState, removeUser } from 'commons/cookie/getUser'; +import { getLoginState, removeToken } from 'commons/cookie/getUser'; import { Link } from 'react-router-dom'; export interface VGNBProps { @@ -39,7 +39,7 @@ const VGNB = (props: VGNBProps) => { diff --git a/src/layouts/VLargeGNB.tsx b/src/layouts/VLargeGNB.tsx index 4d046287..8a3f7737 100644 --- a/src/layouts/VLargeGNB.tsx +++ b/src/layouts/VLargeGNB.tsx @@ -1,6 +1,6 @@ import { Link } from 'react-router-dom'; import LogoButton from 'commons/LogoButton'; -import { getLoginState, removeUser } from 'commons/cookie/getUser'; +import { getLoginState, removeToken } from 'commons/cookie/getUser'; export interface VLargeGNBProps { handleCategoryButtonClick: () => void; @@ -64,7 +64,7 @@ const VLargeGNB = (props: VLargeGNBProps) => { diff --git a/src/pages/login/LoginInputForm.tsx b/src/pages/login/LoginInputForm.tsx index 390c69e5..f39e020f 100644 --- a/src/pages/login/LoginInputForm.tsx +++ b/src/pages/login/LoginInputForm.tsx @@ -24,8 +24,7 @@ const LoginInputForm = () => { setIsEmailEmpty(false); }; - const handleSubmit = (e: React.FormEvent) => { - e.preventDefault(); + const checkEmpty = () => { if (!userInfo.email) { setErrorText('이메일을 입력해주세요'); setIsEmailEmpty(true); @@ -33,7 +32,9 @@ const LoginInputForm = () => { if (!userInfo.password) { setIsPasswordEmpty(true); } - // email, password 보내기 + }; + + const userfetch = () => { fetch(`${process.env.REACT_APP_URI}/account/login`, { method: 'POST', headers: { @@ -63,6 +64,14 @@ const LoginInputForm = () => { }); }; + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + // email, password 비었는지 확인 + checkEmpty(); + // email, password 보내기 + userfetch(); + }; + const handleChange = (event: React.ChangeEvent) => { const target = event.target as HTMLInputElement; if (target.id === 'id') { diff --git a/src/pages/login/VLoginInputForm.tsx b/src/pages/login/VLoginInputForm.tsx index 01d116c4..77625ea7 100644 --- a/src/pages/login/VLoginInputForm.tsx +++ b/src/pages/login/VLoginInputForm.tsx @@ -1,11 +1,20 @@ import InputGroup from 'commons/InputGroup'; -type Props = { +interface LoginInputFormProps { handleChange: (event: React.ChangeEvent) => void; handleSubmit: (e: React.FormEvent) => void; isEmailEmpty: boolean; isPasswordEmpty: boolean; errorText: string; +} + +interface ErrorTextProps { + isEmpty: boolean; + text: string; +} + +const ErrorText = ({ isEmpty, text }: ErrorTextProps) => { + return
{isEmpty && {text}}
; }; const VLoginInputForm = ({ @@ -14,7 +23,7 @@ const VLoginInputForm = ({ isEmailEmpty, isPasswordEmpty, errorText, -}: Props) => { +}: LoginInputFormProps) => { return (
- {isEmailEmpty &&
{errorText}
} + + - {isPasswordEmpty && ( -
비밀번호를 입력해주세요.
- )} +