feat : 이벤트 삭제 구현

src/api/shop/index.ts

@@ -48,3 +48,5 @@ export const getStoreEventList = async (param : EventListParam) => {
   return StoreEventResponse.parse(data);
 };
 export const addEvent = (id: string, eventInfo: EventInfo) => accessClient.post(`owner/shops/${id}/event`, eventInfo);
+
+export const deleteEvent = (shopId: number, eventId:number) => accessClient.delete(`owner/shops/${shopId}/events/${eventId}`);

src/page/MyShopPage/components/EventTable/index.tsx

@@ -8,6 +8,7 @@ import { ReactComponent as NonCheckCircle } from 'assets/svg/mystore/non-check-c
 import { ReactComponent as DeleteIcon } from 'assets/svg/mystore/delete-icon.svg';
 import { ReactComponent as Check } from 'assets/svg/mystore/check.svg';
 import { ReactComponent as CompleteIcon } from 'assets/svg/mystore/complete-icon.svg';
+import { useDeleteEvent } from 'query/event';
 import showToast from 'utils/ts/showToast';
 import EventCard from './components';
 import styles from './EventTable.module.scss';
@@ -17,6 +18,7 @@ export default function EventTable() {
   const [editMenu, setEditMenu] = useState(false);
   const [selectAll, setSelectAll] = useState(false);
   const [selectedEventIds, setSelectedEventIds] = useState<number[]>([]);
+  const { mutate: deleteEvent } = useDeleteEvent(shopData!.id, selectedEventIds);
 
   const toggleSelectEvent = (id: number): void => {
     setSelectedEventIds((prev : number[]) => (
@@ -31,6 +33,7 @@ export default function EventTable() {
       setSelectedEventIds([]);
     }
   }, [selectAll, eventList]);
+
   return (
     <>
       <div className={styles['manage-event-container']}>
@@ -62,7 +65,10 @@ export default function EventTable() {
               <button
                 type="button"
                 className={styles['delete-button']}
-                onClick={() => showToast('success', '이벤트 삭제에 성공했습니다.')}
+                onClick={() => {
+                  deleteEvent();
+                  showToast('success', '이벤트 삭제에 성공했습니다.');
+                }}
               >
                 삭제
                 <DeleteIcon />

src/query/event.ts

@@ -1,6 +1,6 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { useNavigate } from 'react-router-dom';
-import { addEvent } from 'api/shop';
+import { addEvent, deleteEvent } from 'api/shop';
 import { EventInfo } from 'model/shopInfo/event';
 import { isKoinError } from '@bcsdlab/koin';
 import showToast from 'utils/ts/showToast';
@@ -23,3 +23,22 @@ export const useAddEvent = (id: string) => {
 
   return { mutate, isPending };
 };
+
+export const useDeleteEvent = (shopId: number, eventIds: number[]) => {
+  const queryClient = useQueryClient();
+  const { mutate, isPending } = useMutation({
+    mutationFn: async () => {
+      const deletePromises = eventIds.map((eventId : number) => deleteEvent(shopId, eventId));
+      await Promise.all(deletePromises);
+    },
+    onSuccess: () => {
+      showToast('success', '이벤트 삭제에 성공했습니다.');
+      queryClient.invalidateQueries({ queryKey: shopKeys.eventList(shopId) });
+    },
+    onError: (e) => {
+      if (isKoinError(e)) showToast('error', e.message);
+    },
+  });
+
+  return { mutate, isPending };
+};