fix(web-domains): 자기소개, 코멘트 validation 수정 (#182)

* fix: validation 수정 * fix: 수정 validation
depromeet · Aug 30, 2024 · 6944711 · 6944711
1 parent 0680a3d
commit 6944711
Show file tree

Hide file tree

Showing 8 changed files with 18 additions and 9 deletions.
diff --git a/packages/web-domains/src/answer/features/comment/components/Comment.tsx b/packages/web-domains/src/answer/features/comment/components/Comment.tsx
@@ -32,8 +32,8 @@ export const Comment = ({ comment, onChangeComment }: CommentProps) => {
         <CommentInput
           value={comment}
           onChange={onChangeComment}
-          maxLength={20}
-          errors={{ maxLength: 20 }}
+          maxLength={100}
+          errors={{ maxLength: 100 }}
           css={{ marginTop: '24px' }}
         />
       </div>

diff --git a/packages/web-domains/src/answer/features/comment/components/CommentInput.tsx b/packages/web-domains/src/answer/features/comment/components/CommentInput.tsx
@@ -17,8 +17,8 @@ export const CommentInput = forwardRef<HTMLInputElement, CommentInputProps>(
 
     const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
       const { value } = e.target;
-      setInput(value);
-      onChange?.(value);
+      setInput(value.substring(0, maxLength));
+      onChange?.(value.substring(0, maxLength));
     };
 
     const handleReset = () => {

diff --git a/.../web-domains/src/new-meeting/features/get-meeting-info/components/TextField/TextField.tsx b/.../web-domains/src/new-meeting/features/get-meeting-info/components/TextField/TextField.tsx
@@ -15,6 +15,7 @@ export const TextField = forwardRef<HTMLInputElement, PropsWithChildren<InputPro
   const handleChange = (event: ChangeEvent<HTMLInputElement>) => {
     if (maxLength && event.target.value.length > maxLength) {
       event.target.value = event.target.value.slice(0, maxLength);
+      return;
     }
     onChange && onChange(event);
   };

diff --git a/packages/web-domains/src/user/features/get-user-info/components/Form/ExtraInfoForm.tsx b/packages/web-domains/src/user/features/get-user-info/components/Form/ExtraInfoForm.tsx
@@ -56,7 +56,7 @@ export const ExtraInfoForm = () => {
           required: true,
           minLength: 1,
           maxLength: 15,
-          pattern: /^\S.*\S$/,
+          validate: (value) => (value.trim().length >= 1 ? true : false),
         })}
       />
       <TextInput
@@ -69,7 +69,7 @@ export const ExtraInfoForm = () => {
           required: true,
           minLength: 1,
           maxLength: 15,
-          pattern: /^\S.*\S$/,
+          validate: (value) => (value.trim().length >= 1 ? true : false),
         })}
       />
       <div css={buttonWrapperCss}>

diff --git a/packages/web-domains/src/user/features/get-user-info/components/Form/IntroInfoForm.tsx b/packages/web-domains/src/user/features/get-user-info/components/Form/IntroInfoForm.tsx
@@ -68,7 +68,10 @@ export const IntroInfoForm = () => {
       <TextArea
         maxLength={MAX_LENGTH}
         placeholder="저는 이런 사람이에요"
-        {...register('introduction', { maxLength: MAX_LENGTH, pattern: /^\S.*\S$/ })}
+        {...register('introduction', {
+          maxLength: MAX_LENGTH,
+          validate: (value) => (value.trim().length >= 1 ? true : false),
+        })}
       />
       <Txt as="p" typography="body4" color={colors.grey600}>
         최대 {MAX_LENGTH}자까지 입력해주세요

diff --git a/packages/web-domains/src/user/features/get-user-info/components/TextInput/TextArea.tsx b/packages/web-domains/src/user/features/get-user-info/components/TextInput/TextArea.tsx
@@ -9,7 +9,8 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>((props, r
 
   const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
     if (maxLength && event.target.value.length > maxLength) {
-      event.target.value = event.target.value.slice(0, maxLength);
+      event.target.value = event.target.value.substring(0, maxLength);
+      return;
     }
     onChange && onChange(event);
   };

diff --git a/packages/web-domains/src/user/features/get-user-info/components/TextInput/TextInput.tsx b/packages/web-domains/src/user/features/get-user-info/components/TextInput/TextInput.tsx
@@ -18,6 +18,7 @@ export const TextInput = forwardRef<HTMLInputElement, TextInputProps>((props, re
   const handleChange = (event: ChangeEvent<HTMLInputElement>) => {
     if (maxLength && event.target.value.length > maxLength) {
       event.target.value = event.target.value.slice(0, maxLength);
+      return;
     }
     onChange && onChange(event);
   };

diff --git a/packages/web-domains/src/user/features/modify-user-info/components/ModifyIntroForm.tsx b/packages/web-domains/src/user/features/modify-user-info/components/ModifyIntroForm.tsx
@@ -26,7 +26,10 @@ export const ModifyIntroForm = () => {
       <TextArea
         placeholder="저는 이런 사람이에요."
         maxLength={MAX_LENGTH}
-        {...register('introduction', { maxLength: MAX_LENGTH, pattern: /^\S.*\S$/ })}
+        {...register('introduction', {
+          maxLength: MAX_LENGTH,
+          validate: (value) => (value.trim().length >= 1 ? true : false),
+        })}
       />
       <Txt as="p" typography="body4" color={colors.grey600}>
         최대 {MAX_LENGTH}자까지 입력해주세요