fix: upload 중일 경우 재요청 보내지 않도록 처리 추가

pickly-team · Oct 16, 2023 · 99a72d8 · 99a72d8
1 parent 2ed17a8
commit 99a72d8
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 22 deletions.
diff --git a/src/comment/ui/bookmark/CommentUploadInput.tsx b/src/comment/ui/bookmark/CommentUploadInput.tsx
@@ -24,11 +24,13 @@ const CommentUploadInput = () => {
     initComment();
   };
 
-  const { mutate: postComment } = usePOSTCommentQuery({
-    bookmarkId: bookmarkId ?? '',
-    initComment,
-  });
-  const { mutate: editComment } = usePUTCommentQuery({
+  const { mutate: postComment, isLoading: isPostLoading } = usePOSTCommentQuery(
+    {
+      bookmarkId: bookmarkId ?? '',
+      initComment,
+    },
+  );
+  const { mutate: editComment, isLoading: isEditLoading } = usePUTCommentQuery({
     bookmarkId: bookmarkId ?? '',
     initComment,
   });
@@ -37,6 +39,9 @@ const CommentUploadInput = () => {
     event: React.FormEvent<HTMLFormElement> | MouseEvent<HTMLButtonElement>,
   ) => {
     event.preventDefault();
+    if (isPostLoading || isEditLoading) return;
+    if (!comment.content) return;
+
     if (mode === 'CREATE') {
       postComment({
         bookmarkId: Number(id),

diff --git a/src/pages/BookmarkAddPage.tsx b/src/pages/BookmarkAddPage.tsx
@@ -59,21 +59,23 @@ const BookmarkAddPage = () => {
   );
 
   const { memberId } = useAuthStore();
-  const { mutate: postBookmark } = usePOSTBookmarkMutation({
-    resetAll: {
-      resetAllInputs,
-      resetCategory: () => {
-        setSelectedCategoryId(0);
-        setCategoryList(toggleCategory(0));
+  const { mutate: postBookmark, isLoading: isPostLoading } =
+    usePOSTBookmarkMutation({
+      resetAll: {
+        resetAllInputs,
+        resetCategory: () => {
+          setSelectedCategoryId(0);
+          setCategoryList(toggleCategory(0));
+        },
+        resetVisibility: () => onClickPublishScoped('SCOPE_PUBLIC'),
       },
-      resetVisibility: () => onClickPublishScoped('SCOPE_PUBLIC'),
-    },
-    memberId,
-  });
+      memberId,
+    });
 
   const { fireToast } = useToast();
 
   const onClickSubmitButton = () => {
+    if (isPostLoading) return;
     if (isBookmarkError) {
       fireToast({
         mode: 'ERROR',

diff --git a/src/pages/CategoryManagePage.tsx b/src/pages/CategoryManagePage.tsx
@@ -58,14 +58,17 @@ const CategoryManagePage = ({ mode }: CategoryManagePageProps) => {
   };
 
   // 2. 저장 버튼 > 저장
-  const { mutate: postCategory } = usePOSTCategoryMutation({
-    memberId,
-  });
-  const { mutate: putCategory } = usePUTCategoryMutation({
-    memberId,
-    categoryId: categoryId ?? '',
-  });
+  const { mutate: postCategory, isLoading: isPostLoading } =
+    usePOSTCategoryMutation({
+      memberId,
+    });
+  const { mutate: putCategory, isLoading: isPutLoading } =
+    usePUTCategoryMutation({
+      memberId,
+      categoryId: categoryId ?? '',
+    });
   const onClickSave = () => {
+    if (isPostLoading || isPutLoading) return;
     if (!categoryName.length) {
       fireToast({ message: '앗! 카테고리 이름이 비어있어요', mode: 'ERROR' });
       return;