From 500e49f18c7b91d4e4ae273c7aa04635f4f07a13 Mon Sep 17 00:00:00 2001
From: mihee <s2809h29@gmail.com>
Date: Wed, 30 Aug 2023 22:30:26 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=9D=B4=EB=A9=94=EC=9D=BC=20=ED=8C=A8?=
 =?UTF-8?q?=ED=84=B4=20=EA=B2=80=EC=82=AC=20#80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/features/common/routes/HelpDesk.tsx | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/features/common/routes/HelpDesk.tsx b/src/features/common/routes/HelpDesk.tsx
index e7e955e9..b3e3aeb9 100644
--- a/src/features/common/routes/HelpDesk.tsx
+++ b/src/features/common/routes/HelpDesk.tsx
@@ -13,9 +13,16 @@ export default function HelpDesk() {
   const [translateX, setTranslateX] = useState(0);
   const [email, setEmail] = useState("");
   const [inquiryContent, setInquiryContent] = useState("");
-  const [emailError, setEmailError] = useState(false);
+  const [emailError, setEmailError] = useState<number>(0);
   const [contentError, setContentError] = useState(false);
 
+  const emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+  const emailErrorMessage = [
+    "",
+    "이메일을 입력해 주세요.",
+    "이메일 형식이 올바르지 않습니다.",
+  ];
+
   const handlerItem = (i: number) => {
     setSelected(i + 1);
     setTranslateX(-50);
@@ -24,7 +31,7 @@ export default function HelpDesk() {
   const goPrev = () => {
     setTranslateX(0);
     setSelected(0);
-    setEmailError(false);
+    setEmailError(0);
     setContentError(false);
     setEmail("");
     setInquiryContent("");
@@ -39,8 +46,9 @@ export default function HelpDesk() {
   };
 
   const send = () => {
-    if (email === "") setEmailError(true);
-    else setEmailError(false);
+    if (email === "") setEmailError(1);
+    else if (!emailPattern.test(email)) setEmailError(2);
+    else setEmailError(0);
     if (inquiryContent === "") setContentError(true);
     else setContentError(false);
   };
@@ -76,8 +84,8 @@ export default function HelpDesk() {
               type="email"
               placeholder="답변 받을 이메일 주소"
               onChange={handlerEmailChange}
-              warn={emailError}
-              message="이메일을 입력해 주세요."
+              warn={Boolean(emailError)}
+              message={emailError ? emailErrorMessage[emailError] : ""}
               icon={<Mail width={20} height={20} />}
               required
             />