Merge branch 'hoxfix' into main

Team-return · Nov 7, 2023 · 14da2a6 · 14da2a6
2 parents b199270 + 21910c7
commit 14da2a6
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 19 deletions.
diff --git a/src/apis/user/index.ts b/src/apis/user/index.ts
@@ -24,8 +24,8 @@ export const Login = (body: RequestBody, checkBoxValue: boolean) => {
       onSuccess: (res) => {
         if (res.authority !== "STUDENT" && res.authority !== "DEVELOPER") {
           append({
-            title: "해당 서비스를 사용할 수 없는 계정입니다.",
-            message: "",
+            title: "",
+            message: "해당 서비스를 이용할 수 없는 계정입니다.",
             type: "RED",
           });
         } else {

diff --git a/src/components/account/login/loginInputsComponents.tsx b/src/components/account/login/loginInputsComponents.tsx
@@ -7,10 +7,10 @@ import React, { useState } from "react";
 interface PropsType {
   inputStates: RequestBody;
   handleChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+  enterEvent: () => void;
 }
 
-function LoginInputs({ inputStates, handleChange }: PropsType) {
-  const [isHidden, setIsHidden] = useState<boolean>(true);
+function LoginInputs({ inputStates, handleChange, enterEvent }: PropsType) {
   return (
     <div className="flex flex-col gap-[14px] pt-[40px] pb-[12px] px-0">
       <TextFiled
@@ -30,11 +30,8 @@ function LoginInputs({ inputStates, handleChange }: PropsType) {
         name="password"
         label="비밀번호"
         placeholder="비밀번호를 입력해주세요"
-        enterEvent={() => {
-          setIsHidden((prev) => !prev);
-        }}
-        customType={isHidden ? "EyesClose" : "EyesOpen"}
-        type={isHidden ? "password" : "text"}
+        enterEvent={enterEvent}
+        type="password"
       />
     </div>
   );

diff --git a/src/components/account/login/loginStateManagement.tsx b/src/components/account/login/loginStateManagement.tsx
@@ -22,7 +22,11 @@ export default function LoginStateMenagement() {
 
   return (
     <div>
-      <LoginInputs inputStates={inputStates} handleChange={handleChange} />
+      <LoginInputs
+        inputStates={inputStates}
+        handleChange={handleChange}
+        enterEvent={loginClick}
+      />
       <SubmitBtn
         allIsInputState={allIsInputState}
         isChecked={isChecked}

diff --git a/src/components/common/TextFiled.tsx b/src/components/common/TextFiled.tsx
@@ -4,7 +4,7 @@ import { Icon, theme } from "@team-return/design-system";
 import React, { KeyboardEvent, useState } from "react";
 
 interface PropsType extends React.ComponentProps<"input"> {
-  customType?: "Text" | "Search" | "EyesClose" | "EyesOpen";
+  customType?: "Search" | "EyesClose" | "EyesOpen";
   enterEvent?: () => void;
   onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
   label?: string;
@@ -16,16 +16,18 @@ function TextFiled({
   value,
   placeholder,
   onChange,
-  customType = "Text",
+  customType,
   name,
   enterEvent,
   width,
   height,
   label,
-  type,
+  type = "text",
 }: PropsType) {
   const [focus, setFocuse] = useState<boolean>(false);
-  const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
+  const [isHidden, setIsHidden] = useState<boolean>(true);
+
+  const isKeyDownToEnter = (e: KeyboardEvent<HTMLInputElement>) => {
     if (e.key === "Enter") if (enterEvent) enterEvent();
   };
 
@@ -47,25 +49,29 @@ function TextFiled({
       >
         <input
           className="w-full flex-1 h-full px-[16px] border-none text-b3 font-r leading-b3"
-          type={type}
+          type={type === "password" ? (isHidden ? "password" : "text") : type}
           value={value}
           onChange={onChange}
           placeholder={placeholder}
           name={name}
-          onKeyUp={onKeyDown}
+          onKeyUp={isKeyDownToEnter}
           onFocus={() => {
             setFocuse(true);
           }}
           onBlur={() => {
             setFocuse(false);
           }}
         />
-        {customType !== "Text" && (
+        {type !== "text" && (
           <div
             className="flex justify-center items-center mr-[14px] cursor-pointer  "
-            onClick={enterEvent}
+            onClick={() => setIsHidden((prev) => !prev)}
           >
-            <Icon icon={customType} size={20} color="gray60" />
+            <Icon
+              icon={isHidden ? "EyesClose" : "EyesOpen"}
+              size={20}
+              color="gray60"
+            />
           </div>
         )}
       </div>