From 467764e30996dc296b52c6eeb1760191c0048995 Mon Sep 17 00:00:00 2001
From: Leejin-Yang <ejin1996@gmail.com>
Date: Fri, 15 Sep 2023 17:07:20 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EB=A6=AC=EB=B7=B0,=20=EA=BF=80=EC=A1=B0?=
 =?UTF-8?q?=ED=95=A9=20=EC=9E=91=EC=84=B1=20=ED=95=A8=EC=88=98=20=EB=94=94?=
 =?UTF-8?q?=EB=B0=94=EC=9A=B4=EC=8A=A4=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Recipe/RecipeRegisterForm/RecipeRegisterForm.tsx      | 6 ++++--
 .../Review/ReviewRegisterForm/ReviewRegisterForm.tsx      | 8 +++++---
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/Recipe/RecipeRegisterForm/RecipeRegisterForm.tsx b/frontend/src/components/Recipe/RecipeRegisterForm/RecipeRegisterForm.tsx
index 96f13fad4..4b15893a9 100644
--- a/frontend/src/components/Recipe/RecipeRegisterForm/RecipeRegisterForm.tsx
+++ b/frontend/src/components/Recipe/RecipeRegisterForm/RecipeRegisterForm.tsx
@@ -7,7 +7,7 @@ import RecipeNameInput from '../RecipeNameInput/RecipeNameInput';
 import RecipeUsedProducts from '../RecipeUsedProducts/RecipeUsedProducts';
 
 import { ImageUploader, SvgIcon } from '@/components/Common';
-import { useImageUploader, useFormData } from '@/hooks/common';
+import { useImageUploader, useFormData, useTimeout } from '@/hooks/common';
 import { useRecipeFormValueContext, useRecipeFormActionContext } from '@/hooks/context';
 import { useRecipeRegisterFormMutation } from '@/hooks/queries/recipe';
 import type { RecipeRequest } from '@/types/recipe';
@@ -61,6 +61,8 @@ const RecipeRegisterForm = ({ closeRecipeDialog }: RecipeRegisterFormProps) => {
     });
   };
 
+  const [debouncedRecipeSubmit] = useTimeout(handleRecipeFormSubmit, 200);
+
   return (
     <RecipeRegisterFormContainer>
       <RecipeHeading tabIndex={0}>나만의 꿀조합 만들기🍯</RecipeHeading>
@@ -69,7 +71,7 @@ const RecipeRegisterForm = ({ closeRecipeDialog }: RecipeRegisterFormProps) => {
       </CloseButton>
       <Divider />
       <Spacing size={36} />
-      <form onSubmit={handleRecipeFormSubmit}>
+      <form onSubmit={debouncedRecipeSubmit}>
         <RecipeNameInput recipeName={recipeFormValue.title} />
         <Spacing size={40} />
         <RecipeUsedProducts />
diff --git a/frontend/src/components/Review/ReviewRegisterForm/ReviewRegisterForm.tsx b/frontend/src/components/Review/ReviewRegisterForm/ReviewRegisterForm.tsx
index a75ea5ee6..f555d0314 100644
--- a/frontend/src/components/Review/ReviewRegisterForm/ReviewRegisterForm.tsx
+++ b/frontend/src/components/Review/ReviewRegisterForm/ReviewRegisterForm.tsx
@@ -10,7 +10,7 @@ import StarRate from '../StarRate/StarRate';
 import { ImageUploader, SvgIcon } from '@/components/Common';
 import { ProductOverviewItem } from '@/components/Product';
 import { MIN_DISPLAYED_TAGS_LENGTH } from '@/constants';
-import { useFormData, useImageUploader, useScroll } from '@/hooks/common';
+import { useFormData, useImageUploader, useScroll, useTimeout } from '@/hooks/common';
 import { useReviewFormActionContext, useReviewFormValueContext } from '@/hooks/context';
 import { useProductDetailQuery } from '@/hooks/queries/product';
 import { useReviewRegisterFormMutation } from '@/hooks/queries/review';
@@ -77,6 +77,8 @@ const ReviewRegisterForm = ({ productId, targetRef, closeReviewDialog, initTabMe
     });
   };
 
+  const [debouncedReviewSubmit] = useTimeout(handleSubmit, 200);
+
   return (
     <ReviewRegisterFormContainer>
       <ReviewHeading tabIndex={0}>리뷰 작성</ReviewHeading>
@@ -88,7 +90,7 @@ const ReviewRegisterForm = ({ productId, targetRef, closeReviewDialog, initTabMe
         <ProductOverviewItem name={productDetail.name} image={productDetail.image} />
       </ProductOverviewItemWrapper>
       <Divider customHeight="4px" variant="disabled" />
-      <RegisterForm onSubmit={handleSubmit}>
+      <RegisterForm onSubmit={debouncedReviewSubmit}>
         <ReviewImageUploaderContainer>
           <Heading as="h2" size="xl" tabIndex={0}>
             구매한 상품 사진이 있다면 올려주세요.
@@ -110,7 +112,7 @@ const ReviewRegisterForm = ({ productId, targetRef, closeReviewDialog, initTabMe
         <RebuyCheckbox />
         <Spacing size={16} />
         <Text size="sm" color={theme.textColors.disabled}>
-          [작성시 유의사항] 신뢰성 확보에 저해되는 게시물은 삭제하거나 보이지 않게 할 수 있습니다.{' '}
+          [작성시 유의사항] 신뢰성 확보에 저해되는 게시물은 삭제하거나 보이지 않게 할 수 있습니다.
         </Text>
         <Spacing size={10} />
         <FormButton type="submit" customWidth="100%" customHeight="60px" size="xl" weight="bold" disabled={!isValid}>