refactor: 등록버튼 중복 방지

BCSDLab · Apr 11, 2024 · 46fc3e4 · 46fc3e4
1 parent 6efd0ca
commit 46fc3e4
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/src/page/AddingEvent/index.tsx b/src/page/AddingEvent/index.tsx
@@ -78,7 +78,7 @@ export default function AddingEvent() {
     presigned: [],
     file: null,
   });
-  const { mutate: addEvent } = useAddEvent(param.id!);
+  const { mutate: addEvent, isPending } = useAddEvent(param.id!);
 
   const changeTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
     if (e.target.value.length <= 25) setEventInfo({ ...eventInfo, title: e.target.value });
@@ -239,7 +239,6 @@ export default function AddingEvent() {
           </div>
           <div>
             <ReactQuill
-              style={{ border: '1px solid black' }}
               theme="snow"
               value={editor}
               onChange={setEditor}
@@ -299,7 +298,7 @@ export default function AddingEvent() {
         </div>
         <div className={styles.buttons}>
           <button type="button" className={styles.cancel}>취소하기</button>
-          <button type="button" className={styles.add} onClick={postEvent}>등록하기</button>
+          <button type="button" className={styles.add} onClick={postEvent} disabled={isPending}>등록하기</button>
         </div>
       </div>
     </div>

diff --git a/src/query/event.ts b/src/query/event.ts
@@ -5,13 +5,13 @@ import { isKoinError } from '@bcsdlab/koin';
 import showToast from 'utils/ts/showToast';
 
 export const useAddEvent = (id: string) => {
-  const { mutate } = useMutation({
+  const { mutate, isPending } = useMutation({
     mutationFn: (data: EventInfo) => addEvent(id, data),
     onSuccess: () => showToast('success', '이벤트 추가에 성공했습니다.'),
     onError: (e) => {
       if (isKoinError(e)) showToast('error', e.message);
     },
   });
 
-  return { mutate };
+  return { mutate, isPending };
 };