refactor: UI 컴포넌트에 토스트 띄우는 함수만 남기고 훅으로 이동

woowacourse-teams · Aug 16, 2024 · cb205fd · cb205fd
1 parent 3cba693
commit cb205fd
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 39 deletions.
diff --git a/...t/src/components/Modal/SetActionModal/DeleteMemberActionModal/DeleteMemberActionModal.tsx b/...t/src/components/Modal/SetActionModal/DeleteMemberActionModal/DeleteMemberActionModal.tsx
@@ -23,43 +23,35 @@ const DeleteMemberActionModal = ({
 }: DeleteMemberActionModalProps) => {
   const {showToast} = useToast();
 
-  const checkAlreadyExistMemberAction = (memberAction: MemberAction) => {
-    if (!memberActionList.includes(memberAction)) {
-      showToast({
-        isClickToClose: true,
-        showingTime: 3000,
-        message: '이미 삭제된 인원입니다.',
-        type: 'error',
-        bottom: '160px',
-      });
-      return;
-    }
+  const showToastAlreadyExistMemberAction = () => {
+    showToast({
+      isClickToClose: true,
+      showingTime: 3000,
+      message: '이미 삭제된 인원입니다.',
+      type: 'error',
+      bottom: '160px',
+    });
   };
 
-  const checkExistSameMemberFromAfterStep = (
-    memberAction: MemberAction,
-    isExistSameMemberFromAfterStep: (memberAction: MemberAction) => boolean,
-  ) => {
-    if (isExistSameMemberFromAfterStep(memberAction)) {
-      showToast({
-        isClickToClose: true,
-        showingTime: 3000,
-        message: `이후의 ${memberAction.name}가 사라져요`,
-        type: 'error',
-        position: 'top',
-        top: '30px',
-        style: {
-          zIndex: 9000,
-        },
-      });
-    }
+  const showToastExistSameMemberFromAfterStep = (name: string) => {
+    showToast({
+      isClickToClose: true,
+      showingTime: 3000,
+      message: `이후의 ${name}가 사라져요`,
+      type: 'error',
+      position: 'top',
+      top: '30px',
+      style: {
+        zIndex: 9000,
+      },
+    });
   };
 
   const {aliveActionList, deleteMemberActionList, addDeleteMemberAction} = useDeleteMemberAction({
     memberActionList,
     setIsBottomSheetOpened,
-    checkAlreadyExistMemberAction,
-    checkExistSameMemberFromAfterStep,
+    showToastAlreadyExistMemberAction,
+    showToastExistSameMemberFromAfterStep,
   });
 
   return (

diff --git a/client/src/hooks/useDeleteMemberAction.tsx b/client/src/hooks/useDeleteMemberAction.tsx
@@ -13,18 +13,15 @@ import getEventIdByUrl from '@utils/getEventIdByUrl';
 type UseDeleteMemberActionProps = {
   memberActionList: MemberAction[];
   setIsBottomSheetOpened: React.Dispatch<React.SetStateAction<boolean>>;
-  checkAlreadyExistMemberAction: (memberAction: MemberAction) => void;
-  checkExistSameMemberFromAfterStep: (
-    memberAction: MemberAction,
-    isExistSameMemberFromAfterStep: (memberAction: MemberAction) => boolean,
-  ) => void;
+  showToastAlreadyExistMemberAction: () => void;
+  showToastExistSameMemberFromAfterStep: (name: string) => void;
 };
 
 const useDeleteMemberAction = ({
   memberActionList,
   setIsBottomSheetOpened,
-  checkAlreadyExistMemberAction,
-  checkExistSameMemberFromAfterStep,
+  showToastAlreadyExistMemberAction,
+  showToastExistSameMemberFromAfterStep,
 }: UseDeleteMemberActionProps) => {
   const {stepList, refreshStepList} = useStepList();
   const [aliveActionList, setAliveActionList] = useState<MemberAction[]>(memberActionList);
@@ -56,9 +53,21 @@ const useDeleteMemberAction = ({
     }
   };
 
+  const checkAlreadyExistMemberAction = (memberAction: MemberAction, showToast: () => void) => {
+    if (!memberActionList.includes(memberAction)) {
+      showToast();
+    }
+  };
+
+  const checkExistSameMemberFromAfterStep = (memberAction: MemberAction, showToast: () => void) => {
+    if (isExistSameMemberFromAfterStep(memberAction)) {
+      showToast();
+    }
+  };
+
   const addDeleteMemberAction = (memberAction: MemberAction) => {
-    checkAlreadyExistMemberAction(memberAction);
-    checkExistSameMemberFromAfterStep(memberAction, isExistSameMemberFromAfterStep);
+    checkAlreadyExistMemberAction(memberAction, showToastAlreadyExistMemberAction);
+    checkExistSameMemberFromAfterStep(memberAction, () => showToastExistSameMemberFromAfterStep(memberAction.name));
     setAliveActionList(prev => prev.filter(aliveMember => aliveMember.actionId !== memberAction.actionId));
   };