fix: 후기 작성 후 실시간 업데이트(쿼리 키 추가)

Author: LeeCh0129

src/app/(with-header)/mypage/reservations/page.tsx

@@ -5,6 +5,7 @@ import {
   useMyReservations,
   useCancelReservation,
   useCreateReview,
+  invalidateActivityQueries,
 } from '@/hooks/useReservationQueries';
 import { FilterOption } from '@/constants/reservationConstants';
 import useInfiniteScroll from '@/hooks/useInfiniteScroll';
@@ -102,23 +103,21 @@ export default function MyReservationsPage() {
   // 후기 작성 확인
   const handleReviewConfirm = (rating: number, content: string) => {
     if (reviewModal.reservationId) {
+      const reservation = allReservations.find(
+        (r) => r.id === reviewModal.reservationId,
+      );
+
       createReviewMutation.mutate(
         {
           reservationId: reviewModal.reservationId,
           data: { rating, content },
         },
         {
           onSuccess: () => {
-            setReviewModal({
-              isOpen: false,
-              reservationId: null,
-              activityTitle: null,
-              activityImage: null,
-              activityDate: null,
-              activityTime: null,
-              headCount: null,
-              totalPrice: null,
-            });
+            // 성공 후 추가 쿼리 무효화
+            if (reservation?.activity.id) {
+              invalidateActivityQueries(reservation.activity.id);
+            }
           },
         },
       );

src/hooks/useReservationQueries.ts

@@ -73,15 +73,36 @@ export const useCreateReview = () => {
       reservationId: number;
       data: CreateReviewRequest;
     }) => createReview(reservationId, data),
-    onSuccess: () => {
-      // 예약 리스트 캐시 무효화하여 reviewSubmitted 상태 업데이트
+    onSuccess: (data, variables) => {
+      // 기존 쿼리 무효화
       queryClient.invalidateQueries({
         queryKey: RESERVATION_QUERY_KEYS.RESERVATIONS,
       });
+
       toast.success('후기가 작성되었습니다.');
     },
     onError: (error) => {
       toast.error(`후기 작성 실패: ${error.message}`);
     },
   });
 };
+
+// 쿼리 무효화 함수
+export const invalidateActivityQueries = (activityId: number) => {
+  const queryClient = useQueryClient();
+
+  queryClient.invalidateQueries({
+    queryKey: ['popularExperiences'],
+  });
+  queryClient.invalidateQueries({
+    queryKey: ['experiences'],
+    exact: false,
+  });
+  queryClient.invalidateQueries({
+    queryKey: ['activity', activityId.toString()],
+  });
+  queryClient.invalidateQueries({
+    queryKey: ['reviews'],
+    exact: false,
+  });
+};