체험관리, 예약 현황 페이지 토스트 구현 / 캘린더 뱃지 실시간 반영

apps/what-today/src/components/reservations-status/ReservationSheet.tsx

@@ -1,5 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query';
-import { type ManageableReservationStatus, Select } from '@what-today/design-system';
+import { type ManageableReservationStatus, Select, useToast } from '@what-today/design-system';
 import dayjs from 'dayjs';
 import { type ReactNode, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
@@ -22,6 +22,7 @@ const tabData: { key: ManageableReservationStatus; label: string }[] = [
 ];
 
 export default function ReservationSheet({ activityId, selectedDate }: ReservationSheetProps) {
+  const { toast } = useToast();
   // 상태 분리
   const [selectedSchedule, setSelectedSchedule] = useState<{ value: string; label: ReactNode } | null>(null);
   const [selectedScheduleId, setSelectedScheduleId] = useState<number | null>(null);
@@ -62,8 +63,21 @@ export default function ReservationSheet({ activityId, selectedDate }: Reservati
       await patchReservationStatus(activityId, id, 'confirmed');
       await queryClient.invalidateQueries({ queryKey: ['reservation'] });
       await queryClient.invalidateQueries({ queryKey: ['dailySchedule'] });
-    } catch (error) {
-      console.error('Error in handleApprove:', error);
+      await queryClient.invalidateQueries({
+        queryKey: ['monthlySchedule', activityId, selectedDate.slice(0, 4), selectedDate.slice(5, 7)],
+      });
+      toast({
+        title: '예약 승인 성공',
+        description: '정상적으로 처리되었습니다.',
+        type: 'success',
+      });
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : '승인 중 오류가 발생했습니다.';
+      toast({
+        title: '예약 승인 실패',
+        description: errorMessage,
+        type: 'error',
+      });
     }
   };
 
@@ -72,8 +86,21 @@ export default function ReservationSheet({ activityId, selectedDate }: Reservati
       await patchReservationStatus(activityId, id, 'declined');
       await queryClient.invalidateQueries({ queryKey: ['reservation'] });
       await queryClient.invalidateQueries({ queryKey: ['dailySchedule'] });
-    } catch (error) {
-      console.error('Error in handleReject:', error);
+      await queryClient.invalidateQueries({
+        queryKey: ['monthlySchedule', activityId, selectedDate.slice(0, 4), selectedDate.slice(5, 7)],
+      });
+      toast({
+        title: '예약 거절 성공',
+        description: '정상적으로 처리되었습니다.',
+        type: 'success',
+      });
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : '거절 중 오류가 발생했습니다.';
+      toast({
+        title: '예약 거절 실패',
+        description: errorMessage,
+        type: 'error',
+      });
     }
   };
 

apps/what-today/src/pages/mypage/manage-activities/index.tsx

@@ -1,4 +1,4 @@
-import { Button, ChevronIcon, ExperienceCard, Modal, NoResult, WarningLogo } from '@what-today/design-system';
+import { Button, ChevronIcon, ExperienceCard, Modal, NoResult, useToast, WarningLogo } from '@what-today/design-system';
 import { useEffect, useRef, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 
@@ -7,6 +7,7 @@ import { useInfiniteMyActivitiesQuery } from '@/hooks/myActivity/useMyActivities
 
 export default function ManageActivitiesPage() {
   const navigate = useNavigate();
+  const { toast } = useToast();
   const [isDeleteOpen, setIsDeleteOpen] = useState(false);
   const [deleteTargetId, setDeleteTargetId] = useState<number | null>(null);
 
@@ -19,10 +20,24 @@ export default function ManageActivitiesPage() {
         onSuccess: () => {
           setIsDeleteOpen(false);
           setDeleteTargetId(null);
+          toast({
+            title: '체험 삭제 성공',
+            description: '체험이 삭제되었습니다.',
+            type: 'success',
+          });
+        },
+        onError: (err) => {
+          const errorMessage = err instanceof Error ? err.message : '삭제 중 오류가 발생했습니다.';
+          toast({
+            title: '체험 삭제 실패',
+            description: errorMessage,
+            type: 'error',
+          });
         },
       });
     }
   };
+
   const observerRef = useRef<HTMLDivElement | null>(null);
   useEffect(() => {
     if (!observerRef.current || !hasNextPage) return;

apps/what-today/src/pages/mypage/reservations-status/index.tsx

@@ -40,12 +40,6 @@ export default function ReservationsStatusPage() {
     setSelectedActivityId(Number(value.value));
   };
 
-  // const handleMonthChange = (year: string, month: string) => {
-  //   if (calendarYear === year && calendarMonth === month) return;
-  //   setCalendarYear(year);
-  //   setCalendarMonth(month);
-  // };
-
   const reservationMap = monthlyReservations.reduce<Record<string, Record<CalendarReservationStatus, number>>>(
     (acc, cur) => {
       acc[cur.date] = cur.reservations;