Merge pull request #203 from SCBJ-7/feature/#188-refactor

[#188] 입력필드 수정 시 체크박스 해제되도록 수정
SCBJ-7 · Jan 25, 2024 · bad24f3 · bad24f3
2 parents 1011c94 + edac345
commit bad24f3
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 6 deletions.
diff --git a/src/pages/paymentPage/components/userInfoSection/UserInfoSection.tsx b/src/pages/paymentPage/components/userInfoSection/UserInfoSection.tsx
@@ -11,27 +11,28 @@ const UserInfoSection = () => {
     register,
     watch,
     setValue,
-    resetField,
     formState: { errors },
   } = useFormContext();
 
   const isDiffUser = watch("isDiffUser");
 
+  watch(["name", "email", "phone"]);
+
   const userInfo = useLoadUserInfo(isDiffUser);
 
   useEffect(() => {
     if (isDiffUser && userInfo) {
       setValue("name", userInfo.name, { shouldValidate: true });
       setValue("email", userInfo.email, { shouldValidate: true });
       setValue("phone", userInfo.phone, { shouldValidate: true });
-    } else if (!isDiffUser) {
-      resetField("name");
-      resetField("email");
-      resetField("phone");
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isDiffUser, setValue, userInfo]);
 
+  const handleFieldChange = () => {
+    setValue("isDiffUser", false);
+  };
+
   return (
     <S.HStack>
       <S.Text variant="body2">이용자 정보</S.Text>
@@ -60,6 +61,7 @@ const UserInfoSection = () => {
               type="text"
               id="name"
               placeholder="김양수"
+              onChange={handleFieldChange}
               $isError={!!errors.name}
             />
             {errors.name && (
@@ -83,6 +85,7 @@ const UserInfoSection = () => {
               type="text"
               id="email"
               placeholder="이메일을 입력해주세요"
+              onChange={handleFieldChange}
               $isError={!!errors.email}
             />
             {errors.email && (
@@ -107,6 +110,7 @@ const UserInfoSection = () => {
               type="text"
               id="phone"
               placeholder="전화번호를 입력해주세요"
+              onChange={handleFieldChange}
               $isError={!!errors.phone}
             />
             {errors.phone && (

diff --git a/src/pages/roomDetailPage/RoomDetail.style.ts b/src/pages/roomDetailPage/RoomDetail.style.ts
@@ -41,7 +41,6 @@ export const OptionWrapper = styled(Flex)`
 const Box = styled.div`
   display: flex;
   flex-direction: column;
-  align-items: center;
   gap: 0.5rem;
 
   background-color: ${({ theme }) => theme.color.greyScale7};