From e03c79dcc1456354f983274b0953d6c51a44a9c1 Mon Sep 17 00:00:00 2001
From: Lee sang Yeop <mma7710@naver.com>
Date: Tue, 21 Nov 2023 16:55:30 +0900
Subject: [PATCH] =?UTF-8?q?Fix(JoinLeague):=20=EA=B2=8C=EC=9E=84=20?=
 =?UTF-8?q?=EC=95=84=EC=9D=B4=EB=94=94=EC=99=80=20=ED=83=9C=EA=B7=B8?=
 =?UTF-8?q?=EB=B2=88=ED=98=B8=EB=A5=BC=20=EA=B5=AC=EB=B6=84=ED=95=B4?=
 =?UTF-8?q?=EC=84=9C=20=EC=9E=85=EB=A0=A5=ED=95=98=EB=8F=84=EB=A1=9D=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

---
 .../Modal/JoinLeague/JoinLeague.tsx           | 34 +++++++++++--------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/src/components/Modal/JoinLeague/JoinLeague.tsx b/src/components/Modal/JoinLeague/JoinLeague.tsx
index ab105ef..dfd26ef 100644
--- a/src/components/Modal/JoinLeague/JoinLeague.tsx
+++ b/src/components/Modal/JoinLeague/JoinLeague.tsx
@@ -19,26 +19,21 @@ const JoinLeague = ({ onClose, channelLink }: JoinLeagueProps) => {
   const { profile } = useProfile();
   const userNameRef = useRef<HTMLInputElement>(null);
   const gameIdRef = useRef<HTMLInputElement>(null);
-
-  function validateFormat(gameId: string) {
-    const regex = /^[^#]+#\d+$/;
-    console.log(gameId);
-    return regex.test(gameId);
-  }
+  const gameTagRef = useRef<HTMLInputElement>(null);
 
   const submitGameId: MouseEventHandler<HTMLElement> = async () => {
     const gameIdVal = gameIdRef.current?.value;
-    if (!gameIdVal || gameIdVal.length < 2) {
-      return;
-    }
+    const gameTagVal = gameTagRef.current?.value;
 
-    if (!validateFormat(gameIdVal)) {
-      alert("'게임아이디#태그번호' 와 같은 형식으로 검색해주세요");
+    if (!gameIdVal || !gameTagVal || gameIdVal.length < 2 || gameTagVal.length < 2) {
+      alert('아이디와 태그번호를 입력해주세요');
       return;
     }
 
+    const concatGameId = gameIdVal + '#' + gameTagVal;
+
     const userTier: string = (
-      await authAPI.get(SERVER_URL + '/api/participant/stat?gameid=' + gameIdVal)
+      await authAPI.get(SERVER_URL + '/api/participant/stat?gameid=' + concatGameId)
     ).data.tier;
     setTier(userTier);
     setGameId(gameIdVal);
@@ -120,7 +115,16 @@ const JoinLeague = ({ onClose, channelLink }: JoinLeagueProps) => {
         <FlexWrapper>
           <InputButton>
             <Input type='text' placeholder='게임 아이디' ref={gameIdRef} />
-            <Button onClick={submitGameId}>입력</Button>
+            <div
+              css={css`
+                margin-top: 0.5rem;
+                width: 100%;
+                position: relative;
+              `}
+            >
+              #<Input type='text' placeholder='게임 태그 번호' ref={gameTagRef} />
+              <Button onClick={submitGameId}>입력</Button>
+            </div>
           </InputButton>
         </FlexWrapper>
       </Wrapper>
@@ -189,7 +193,7 @@ const Input = styled.input`
   height: 4rem;
   border: none;
   border-radius: 0.6rem;
-  padding: 0.6rem;
+  padding: 0.6rem 5rem 0.6rem 0.6rem;
 `;
 
 const Button = styled.button`
@@ -201,7 +205,7 @@ const Button = styled.button`
   border: none;
   color: white;
   border-radius: 0.6rem;
-  right: 3.2rem;
+  right: 2.5rem;
   top: 0.5rem;
 
   &:hover {